/*
 * Mary & Blake Website 2.0 V51 — Movies destination
 * Draft-only presentation. Content comes from the existing movie taxonomy system.
 */
.mb2movie { background:#0b0e12; color:#f6f7f8; overflow:hidden; }
.mb2movie .mb2-inner { width:min(1220px, calc(100% - 52px)); max-width:1220px; margin-inline:auto; }
.mb2movie a { color:inherit; }
.mb2movie a:hover { color:#fff; }
.mb2movie .mb2movie-kicker { display:block; color:#45bbed; font:800 11px/1.35 Lato,Arial,sans-serif; text-transform:uppercase; letter-spacing:2.25px; }
.mb2movie h1,.mb2movie h2,.mb2movie h3,.mb2movie p { margin-top:0; }
.mb2movie h1,.mb2movie h2 { color:#fff; letter-spacing:-.045em; text-wrap:balance; }
.mb2movie h1 em,.mb2movie h2 em,.mb2movie-outro-mark em { font:italic 400 1em/1.08 Georgia, 'Times New Roman',serif; color:#9cddf9; letter-spacing:-.055em; }
.mb2movie .mb2movie-hero { position:relative; min-height:620px; display:flex; align-items:stretch; isolation:isolate; background:#0b0e12; }
.mb2movie-hero-art { position:absolute; inset:0; z-index:-2; overflow:hidden; }
.mb2movie-hero-art img { display:block; height:100%; width:100%; object-fit:cover; object-position:45% 36%; transform:scaleX(-1); filter:saturate(.7) brightness(.6); }
.mb2movie-hero::before { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#0b0e12 0%,rgba(11,14,18,.96) 25%,rgba(11,14,18,.67) 57%,rgba(11,14,18,.28) 100%),linear-gradient(0deg,#0b0e12 0%,transparent 29%,rgba(11,14,18,.26) 100%); }
.mb2movie-hero-inner { display:flex; flex-direction:column; padding-top:34px; padding-bottom:34px; min-height:620px; }
.mb2movie-crumb { display:flex; align-items:center; flex-wrap:wrap; gap:11px; font:700 12px/1.4 Lato,Arial,sans-serif; color:#c7cdd2; }
.mb2movie-crumb a { color:#c7cdd2; text-decoration:none; }
.mb2movie-crumb a:hover { text-decoration:underline; }
.mb2movie-crumb [aria-current] { color:white; }
.mb2movie-hero-copy { max-width:765px; margin-block:auto; padding-block:78px 80px; }
.mb2movie-hero-copy h1 { margin:18px 0 23px; max-width:820px; font:900 clamp(50px,6.6vw,98px)/.99 Lato,Arial,sans-serif; }
.mb2movie-hero-copy p { max-width:650px; font:400 clamp(17px,1.6vw,21px)/1.65 Lato,Arial,sans-serif; color:#d7e0e6; margin-bottom:30px; }
.mb2movie-hero-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.mb2movie .mb2movie-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:48px; padding:13px 23px; border-radius:6px; text-decoration:none; font:800 12px/1.25 Lato,Arial,sans-serif; letter-spacing:1.05px; text-transform:uppercase; transition:transform .18s ease,background .18s ease,border-color .18s ease; }
.mb2movie .mb2movie-button:hover { transform:translateY(-2px); }
.mb2movie .mb2movie-button--solid { background:#00a2e8; color:#061521; border:1px solid #00a2e8; }
.mb2movie .mb2movie-button--solid:hover { background:#6fcbf3; border-color:#6fcbf3; color:#061521; }
.mb2movie .mb2movie-button--line { background:rgba(7,10,13,.2); border:1px solid rgba(255,255,255,.48); color:#fff; }
.mb2movie .mb2movie-button--line:hover { background:rgba(255,255,255,.1); color:#fff; }
.mb2movie-hero-foot { display:flex; justify-content:space-between; gap:20px; border-top:1px solid rgba(255,255,255,.17); padding-top:19px; color:#99a6b0; font:800 10px/1.2 Lato,Arial,sans-serif; letter-spacing:2px; }
.mb2movie-intro { background:#10151b; border-block:1px solid #26303a; }
.mb2movie-intro-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.95fr); gap:clamp(26px,6vw,100px); padding-top:85px; padding-bottom:85px; align-items:center; }
.mb2movie-intro h2 { font:900 clamp(37px,4.1vw,58px)/1.08 Lato,Arial,sans-serif; margin:17px 0 0; max-width:610px; }
.mb2movie-intro p { color:#c6d0d9; font:400 17px/1.85 Lato,Arial,sans-serif; margin-bottom:15px; }
.mb2movie-intro p:last-child { margin-bottom:0; }
.mb2movie-section { padding-block:85px 96px; scroll-margin-top:84px; }
.mb2movie-feature-section { background:#0b0e12; }
.mb2movie-reactions { background:#131820; border-top:1px solid #29333d; border-bottom:1px solid #29333d; }
.mb2movie-analysis { background:#0b0e12; }
.mb2movie-section-header { display:flex; gap:28px; align-items:end; justify-content:space-between; margin-bottom:31px; }
.mb2movie-section-header h2 { font:900 clamp(36px,4.4vw,58px)/1.08 Lato,Arial,sans-serif; margin:13px 0 0; }
.mb2movie-section-header p { color:#aebcc6; font:400 16px/1.7 Lato,Arial,sans-serif; margin:13px 0 0; max-width:680px; }
.mb2movie-section-note { font:800 11px/1.2 Lato,Arial,sans-serif; color:#8799a8; letter-spacing:1.65px; white-space:nowrap; }
.mb2movie-text-link { font:800 12px/1.2 Lato,Arial,sans-serif; color:#7bd2fa!important; text-decoration:none; text-transform:uppercase; letter-spacing:1px; white-space:nowrap; }
.mb2movie-text-link:hover { text-decoration:underline; }
.mb2movie-feature { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); border:1px solid #293843; background:#192029; border-radius:12px; overflow:hidden; }
.mb2movie-feature-art { display:block; min-height:420px; overflow:hidden; text-decoration:none; background:#26333c; }
.mb2movie-feature-art img { width:100%; height:100%; min-height:420px; object-fit:cover; display:block; transition:transform .3s ease; }
.mb2movie-feature-art:hover img,.mb2movie-card-art:hover img { transform:scale(1.035); }
.mb2movie-feature-body { align-self:center; padding:clamp(28px,4.2vw,60px); }
.mb2movie-card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:14px; font:800 10px/1.4 Lato,Arial,sans-serif; text-transform:uppercase; letter-spacing:1.3px; }
.mb2movie-card-meta span { color:#68c8f3; }
.mb2movie-card-meta time { color:#99aab7; }
.mb2movie-feature h3 { font:900 clamp(30px,3.2vw,47px)/1.16 Lato,Arial,sans-serif; letter-spacing:-.032em; margin:17px 0 18px; }
.mb2movie-feature h3 a,.mb2movie-card h3 a { color:#fff; text-decoration:none; }
.mb2movie-feature h3 a:hover,.mb2movie-card h3 a:hover { color:#82d7ff; }
.mb2movie-feature-body > p { font:400 16px/1.75 Lato,Arial,sans-serif; color:#bfccd5; margin:0 0 27px; }
.mb2movie-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:23px; }
.mb2movie-card { min-width:0; background:#1b232c; border:1px solid #29353f; border-radius:9px; overflow:hidden; display:flex; flex-direction:column; }
.mb2movie-reactions .mb2movie-card { background:#1e2731; border-color:#30404c; }
.mb2movie-card-art { display:block; width:100%; aspect-ratio:16/10; overflow:hidden; background:#24313c; }
.mb2movie-card-art img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.mb2movie-art-fallback { display:flex; height:100%; min-height:200px; align-items:center; justify-content:center; flex-direction:column; gap:9px; background:linear-gradient(140deg,#132939,#172027); font:900 15px/1.2 Lato,Arial,sans-serif; letter-spacing:2px; text-align:center; }
.mb2movie-art-fallback em { color:#7bd2fa; font:italic 18px Georgia,serif; letter-spacing:0; }
.mb2movie-card-body { padding:22px 23px 24px; display:flex; flex-direction:column; flex:1; }
.mb2movie-card h3 { font:800 clamp(19px,1.8vw,23px)/1.37 Lato,Arial,sans-serif; letter-spacing:-.016em; margin:11px 0 28px; }
.mb2movie-card-read { margin-top:auto; font:800 11px/1.4 Lato,Arial,sans-serif; text-decoration:none; color:#75cefa!important; text-transform:uppercase; letter-spacing:1px; }
.mb2movie-card-read span { margin-left:5px; }
.mb2movie-empty { padding:32px; border:1px solid #334452; background:#18232d; color:#c5d0d8; border-radius:9px; }
.mb2movie-outro { padding:88px 0; background:linear-gradient(115deg,#112d3d,#0e1720 60%,#0c1118); border-top:1px solid #234b5d; }
.mb2movie-outro-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(220px,.5fr); gap:50px; align-items:center; }
.mb2movie-outro h2 { font:900 clamp(37px,4.4vw,58px)/1.08 Lato,Arial,sans-serif; margin:16px 0; }
.mb2movie-outro p { max-width:620px; color:#bfd0dd; font:400 16px/1.75 Lato,Arial,sans-serif; margin-bottom:25px; }
.mb2movie-outro-mark { color:#fff; font:900 clamp(43px,5vw,76px)/1 Lato,Arial,sans-serif; text-align:right; letter-spacing:-.055em; }
.mb2movie :focus-visible { outline:3px solid #81d8ff; outline-offset:4px; }
@media (max-width:900px) {
 .mb2movie-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
 .mb2movie-feature {grid-template-columns:1fr;}
 .mb2movie-feature-art,.mb2movie-feature-art img {min-height:330px;max-height:430px;}
 .mb2movie-intro-grid {gap:38px;}
 .mb2movie-outro-grid {grid-template-columns:1fr;}
 .mb2movie-outro-mark {display:none;}
}
@media (max-width:650px) {
 .mb2movie .mb2-inner {width:calc(100% - 36px);}
 .mb2movie .mb2movie-hero,.mb2movie-hero-inner {min-height:620px;}
 .mb2movie-hero::before {background:linear-gradient(0deg,#0b0e12 0%,rgba(11,14,18,.92) 30%,rgba(11,14,18,.65) 75%,rgba(11,14,18,.44) 100%);}
 .mb2movie-hero-art img {object-position:62% 20%;}
 .mb2movie-hero-inner {padding-top:25px;padding-bottom:26px;}
 .mb2movie-hero-copy {padding:80px 0 60px;}
 .mb2movie-hero-copy h1 {font-size:clamp(44px,11vw,64px);margin:17px 0 21px;}
 .mb2movie-hero-copy p {font-size:16px;line-height:1.7;}
 .mb2movie-hero-actions {align-items:stretch;}
 .mb2movie .mb2movie-button {min-height:48px;}
 .mb2movie-hero-foot {font-size:9px;letter-spacing:1px;}
 .mb2movie-intro-grid {grid-template-columns:1fr;padding-top:58px;padding-bottom:62px;gap:25px;}
 .mb2movie-intro h2 {font-size:39px;}
 .mb2movie-intro p {font-size:16px;}
 .mb2movie-section {padding-block:59px 65px;}
 .mb2movie-section-header {display:block;margin-bottom:24px;}
 .mb2movie-section-header h2 {font-size:39px;}
 .mb2movie-section-note {display:block;margin-top:13px;}
 .mb2movie-text-link {display:inline-block;margin-top:18px;}
 .mb2movie-grid {grid-template-columns:1fr;gap:17px;}
 .mb2movie-card-art {aspect-ratio:16/9;}
 .mb2movie-feature-art,.mb2movie-feature-art img {min-height:230px;max-height:300px;}
 .mb2movie-feature-body {padding:27px 23px 30px;}
 .mb2movie-feature h3 {font-size:31px;}
 .mb2movie-outro {padding:60px 0;}
 .mb2movie-outro h2 {font-size:41px;}
}
@media (prefers-reduced-motion:reduce) {
 .mb2movie .mb2movie-button,.mb2movie-card-art img,.mb2movie-feature-art img {transition:none;}
 .mb2movie .mb2movie-button:hover {transform:none;}
}
