/* Editorial direction from the Claude design handoff (11 October 2026), now the site standard.
   Every V2 page sets body.ed; loads after pf-brand.css.
   Fullscreen menu, video lightbox, oversized DM Sans headlines with upright copper accents.
   No parallax, no animated reveals, no hover scaling. */

/* ---- headline system ---- */
body.ed h1,body.ed h2{font-family:var(--sans);font-weight:450;letter-spacing:-.05em;line-height:1.04}
body.ed h2{font-size:clamp(44px,5.2vw,78px)}
body.ed .section{padding:120px 0}
body.ed .head{max-width:1040px;margin-bottom:64px}
body.ed .label{font-size:11px;letter-spacing:.15em}
body.ed .cols h3,body.ed .ind-card h3,body.ed .plan h3,body.ed .faq summary{font-family:var(--sans);letter-spacing:-.03em}
body.ed .cols h3,body.ed .ind-card h3{font-weight:450;font-size:28px;line-height:1.15}
body.ed .plan h3{font-weight:450;font-size:32px;line-height:1.12}

/* ---- header: graphite bar, ivory logo, booking action, Explore ---- */
.ed-head{background:var(--graphite);color:var(--ivory);border-bottom:1px solid #f4f1e82e}
.ed-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:96px}
.ed-head .logo img{width:220px;height:auto}
.ed-actions{display:flex;align-items:center;gap:30px}
.ed-head .button{background:transparent;color:var(--ivory);border-color:#f4f1e85c;padding:12px 18px;font-size:14px}
.ed-head .button:hover{background:var(--copper);color:var(--graphite);border-color:var(--copper)}
.menu-toggle{display:flex;align-items:center;gap:16px;min-height:44px;padding:0 0 0 12px;border:0;background:transparent;color:var(--ivory);font:500 14px/1 var(--sans);cursor:pointer}
.menu-toggle .menu-glyph{font-size:26px;font-weight:300;line-height:1}
.menu-toggle:hover{color:var(--copper)}
.nojs-navigation{display:flex;flex-wrap:wrap;gap:16px;padding:14px 0;font-size:14px}

/* ---- dialogs: fullscreen menu and film lightbox ---- */
body:has(dialog[open]),body.modal-open{overflow:hidden}
dialog.fullscreen-menu,dialog.film-lightbox{background:var(--graphite);color:var(--ivory);border:0}
dialog.fullscreen-menu::backdrop,dialog.film-lightbox::backdrop{background:#101615d9;backdrop-filter:blur(12px)}
dialog.fullscreen-menu{position:fixed;inset:0;margin:0;width:100%;max-width:100%;height:100dvh;max-height:100dvh;padding:26px clamp(22px,4.2vw,80px);overflow-y:auto;overscroll-behavior:contain}
.overlay-top{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:24px;border-bottom:1px solid #f4f1e82e}
.overlay-top img{width:220px;height:auto}
.overlay-close{display:flex;align-items:center;gap:12px;min-height:44px;padding:10px 0 10px 16px;border:0;background:transparent;color:var(--ivory);font:500 14px/1 var(--sans);cursor:pointer}
.overlay-close>span{font-size:26px;line-height:1}
.overlay-close:hover{color:var(--copper)}
.fullscreen-menu .menu-eyebrow{color:var(--copper);font:500 11px/1.4 var(--sans);letter-spacing:.14em;margin:32px 0 14px}
.fullscreen-menu nav a{display:flex;align-items:center;font:400 clamp(36px,4.6vw,72px)/1.16 var(--sans);letter-spacing:-.04em;border-bottom:1px solid #f4f1e82e;padding:12px 0;color:var(--ivory);text-decoration:none}
.fullscreen-menu nav a:hover,.fullscreen-menu nav a:focus-visible{color:var(--copper)}
.fullscreen-menu nav a>span{width:70px;flex-shrink:0;color:var(--copper);font:500 12px/1 var(--sans);letter-spacing:0}
.fullscreen-menu nav a>em{margin-left:auto;font:400 32px/1 var(--sans);font-style:normal}
.menu-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;margin:32px 0 20px}
.menu-footer p{margin:0;font:400 24px/1.3 var(--sans);color:#b8bcb6}
.menu-footer .links{display:flex;flex-wrap:wrap;align-items:center;gap:26px;font-size:15px}
.menu-footer .links a:not(.button){color:var(--ivory)}
.menu-footer .links a:not(.button):hover{color:var(--copper)}

dialog.film-lightbox{width:min(1180px,96vw);max-width:96vw;padding:20px;max-height:94dvh}
.film-lightbox .overlay-top{font:500 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;padding-bottom:16px}
.lb-frame{position:relative;aspect-ratio:16/9;max-height:70dvh;margin-top:20px;background:#111}
.lb-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lightbox-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:14px;color:#b8bcb6;font-size:13px}
.lightbox-caption p{margin:0}
.lightbox-caption a{color:var(--ivory);white-space:nowrap}

/* ---- hero: oversized short headline, copper accent ---- */
body.ed .hero{min-height:700px}
body.ed .hero-panel{padding-top:88px;padding-bottom:80px}
body.ed .hero h1{font-size:clamp(76px,7.9vw,124px);line-height:.96;letter-spacing:-.065em;margin-bottom:34px;max-width:none}
body.ed .hero-sub{font-size:22px;line-height:1.45;max-width:460px}

/* ---- cinematic film showcase with the circular lightbox trigger ---- */
.showcase{position:relative;height:720px;overflow:hidden;background:var(--graphite);color:var(--ivory)}
.showcase>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.showcase:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#101b18ed,transparent 80%),linear-gradient(90deg,#101b1877,transparent);pointer-events:none}
.showcase .work-heading{position:absolute;z-index:2;left:max(40px,calc((100vw - 1180px)/2));bottom:110px;max-width:760px;pointer-events:none}
.showcase .work-heading .label{color:var(--ivory)}
.showcase .work-heading h2{font-size:clamp(60px,6.8vw,104px);line-height:1.02}
.showcase .film-caption{position:absolute;z-index:2;left:max(40px,calc((100vw - 1180px)/2));right:max(40px,calc((100vw - 1180px)/2));bottom:30px;border-top:1px solid #f4f1e847;padding-top:20px;font:500 11px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;pointer-events:none}
.film-play{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:flex-end;padding-right:15%;border:0;background:none;color:var(--ivory);cursor:pointer}
.play-circle{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:130px;height:130px;border:1px solid #f4f1e877;border-radius:50%;background:#242a2930;backdrop-filter:blur(7px);color:var(--ivory)}
.play-circle:after{content:'';position:absolute;inset:-13px;border:1px solid #ffffff24;border-radius:50%;pointer-events:none}
.play-circle>span:first-child{font-size:22px;line-height:1;padding-left:3px}
.play-circle>span:last-child{font:500 11px/1.4 var(--sans)}
.film-play:hover .play-circle,.film-play:focus-visible .play-circle{background:var(--copper);color:var(--graphite);border-color:var(--copper)}
.more-films{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--graphite)}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb .film-play{justify-content:center;padding:0;background:linear-gradient(0deg,#101b1866,transparent)}
.thumb .play-circle{width:96px;height:96px}

/* ---- process as three-column rows ---- */
body.ed #how .cols{display:block;border-top:0}
body.ed #how .cols article{display:grid;grid-template-columns:60px .95fr 1.1fr;gap:30px;align-items:baseline;padding:30px 0;border-left:0;border-top:1px solid var(--line-dark)}
body.ed #how .cols article:last-child{border-bottom:1px solid var(--line-dark)}
body.ed #how .num{margin:0;font-size:20px;letter-spacing:0}
body.ed #how .cols h3{margin:0;font-size:30px}
body.ed #how .cols p{margin:0;font-size:17px}

/* ---- closing: copper ground, graphite type, dark action ---- */
.ed-closing{background:var(--copper);color:var(--graphite);padding:116px 0}
.ed-closing .closing h2{color:var(--graphite);font-size:clamp(55px,6.8vw,104px);line-height:1.02;margin-bottom:30px}
.ed-closing .label{color:var(--graphite)}
.ed-closing .label:after{background:var(--graphite)}
.ed-closing p{color:var(--graphite);font-size:19px;max-width:560px}
.ed-closing .button{background:var(--graphite);color:var(--ivory);border-color:var(--graphite)}
.ed-closing .button:hover{background:#36403e;color:var(--ivory)}
.ed-closing .amp{opacity:.25}

@media(max-width:1100px){
 body.ed .hero{min-height:0}
 body.ed .hero h1{font-size:clamp(64px,8.4vw,100px)}
 .showcase{height:640px}
 body.ed #how .cols article{grid-template-columns:44px .85fr 1.1fr;gap:20px}
}
@media(max-width:760px){
 body.ed .section{padding:76px 0}
 body.ed .head{margin-bottom:40px}
 body.ed h2{font-size:clamp(39px,8.8vw,58px)}
 body.ed .hero h1{font-size:clamp(62px,15vw,96px)}
 body.ed .hero-sub{font-size:19px}
 .ed-head .wrap{min-height:80px}
 .ed-head .logo img{width:min(200px,52vw)}
 .ed-actions{gap:10px}
 .ed-actions .button{display:none}
 .overlay-top img{width:170px}
 .fullscreen-menu nav a{font-size:clamp(30px,8vw,46px);padding:18px 0}
 .fullscreen-menu nav a>span{width:38px;font-size:10px}
 .fullscreen-menu nav a>em{font-size:24px}
 .menu-footer{flex-direction:column;align-items:flex-start;gap:20px}
 .menu-footer p{font-size:21px}
 .showcase{height:620px}
 .showcase .work-heading{left:20px;right:20px;bottom:110px}
 .showcase .work-heading h2{font-size:clamp(50px,12vw,78px)}
 .showcase .film-caption{left:20px;right:20px;bottom:24px;font-size:10px}
 .film-play{justify-content:flex-end;align-items:flex-start;padding:110px 30px 0 0}
 .thumb .film-play{align-items:center;padding:0}
 .play-circle{width:90px;height:90px;gap:8px}
 .play-circle>span:first-child{font-size:19px}
 .play-circle>span:last-child{font-size:10px}
 .play-circle:after{inset:-9px}
 .more-films{grid-template-columns:1fr}
 dialog.film-lightbox{padding:14px}
 .lb-frame{margin-top:14px}
 .lightbox-caption{font-size:12px;align-items:flex-start;flex-direction:column;gap:8px}
 body.ed #how .cols article{grid-template-columns:30px 1fr;gap:12px;padding:24px 0}
 body.ed #how .cols p{grid-column:2}
 body.ed #how .cols h3{font-size:25px}
 .ed-closing{padding:76px 0}
 .ed-closing .closing h2{font-size:clamp(44px,10vw,64px)}
}
@media(prefers-reduced-motion:reduce){.button,.menu-toggle,.overlay-close{transition:none}}
body.ed .faq h2,body.ed .split h2,body.ed .more-films h2{font-size:clamp(40px,4.4vw,64px)}
body.ed .ind-card h3{font-size:24px}
@media(max-width:760px){body.ed .faq h2,body.ed .split h2,body.ed .more-films h2{font-size:clamp(36px,8.8vw,52px)}}

/* ---- three closing sections, each with its own character ---- */
/* More work: graphite, the Memorial film, and a contact sheet of real shoot photos */
.ed-more .more-films{grid-template-columns:.9fr 1.1fr;gap:56px}
.ed-more .more-films p:not(.label){color:var(--on-graphite);font-size:18px;margin-top:20px}
.ed-more .thumb{border:1px solid var(--line-dark)}
.contact-sheet{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:64px;padding-top:40px;border-top:1px solid var(--line-dark)}
.contact-sheet figure{margin:0}
.contact-sheet img{width:100%;aspect-ratio:4/3;height:auto;object-fit:cover}
.contact-sheet figcaption{margin-top:12px;font:500 11px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--on-graphite)}
.ed-more .more{margin-top:32px}

/* Real human origin: a centered statement */
.ed-origin{text-align:center;padding:150px 0}
.ed-origin .label:after{margin-inline:auto}
body.ed .ed-origin h2{font-size:clamp(56px,7.2vw,112px);line-height:1;letter-spacing:-.055em;max-width:1100px;margin:0 auto}
.ed-origin h2 em{color:var(--deep-copper)}
.ed-origin .lede{max-width:620px;margin:36px auto 0;font-size:20px;color:var(--muted)}
.nots{list-style:none;padding:0;margin:64px auto 0;max-width:960px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;text-align:left}
.nots li{border-top:2px solid var(--copper);padding-top:20px;font-size:16px;color:var(--muted)}
.nots strong{display:block;font:450 26px/1.2 var(--sans);letter-spacing:-.03em;color:var(--graphite);margin-bottom:6px}
.ed-origin .more{margin-top:48px}

/* FAQ: stone ground, numbered question cards */
.ed-faq .faq>div:last-child{counter-reset:q}
.ed-faq details{background:var(--ivory);border:1px solid var(--line);padding:0 26px;margin-bottom:12px}
.ed-faq details:last-child{border-bottom:1px solid var(--line)}
.ed-faq details[open]{border-color:var(--graphite)}
.ed-faq summary{justify-content:flex-start;gap:20px}
.ed-faq summary:before{counter-increment:q;content:counter(q,decimal-leading-zero);font:500 13px/1.6 var(--sans);color:var(--deep-copper);flex:0 0 26px}
.ed-faq summary:after{margin-left:auto}
.ed-faq details p{margin-left:46px}
.faq-aside{margin-top:28px;font-size:17px;color:var(--muted);max-width:300px}

@media(max-width:1020px){
 .ed-more .more-films{grid-template-columns:1fr;gap:32px}
 .contact-sheet{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
 .ed-origin{padding:96px 0}
 body.ed .ed-origin h2{font-size:clamp(44px,11vw,72px)}
 .ed-origin .lede{font-size:18px}
 .nots{grid-template-columns:1fr;gap:22px;margin-top:44px}
 .contact-sheet{grid-template-columns:1fr;margin-top:44px}
 .ed-faq details{padding:0 18px}
 .ed-faq details p{margin-left:0}
}


/* Typography: DM Sans throughout, upright accents in copper (supersedes earlier serif and slab rules above) */
body.ed h1,body.ed h1 em{font-family:var(--sans);font-weight:600;font-style:normal;letter-spacing:-.045em}
body.ed h2,body.ed h3{font-family:var(--sans);font-weight:500;font-style:normal;letter-spacing:-.04em}
body.ed h1 em,body.ed h2 em,body.ed h3 em{font-family:inherit;font-weight:inherit;font-style:normal;letter-spacing:inherit}
body.ed h2 em{color:var(--deep-copper)}
body.ed .dark h2 em,body.ed .showcase h2 em,body.ed .hero h1 em{color:var(--copper)}
body.ed .ed-closing h2 em{color:var(--graphite)}
body.ed .hero h1{font-size:clamp(64px,6.6vw,104px);line-height:1;letter-spacing:-.05em}
body.ed .cols h3,body.ed .ind-card h3,body.ed .plan h3{font-weight:500}
.menu-footer p{font-style:normal}

/* Callout face in the preview: DM Serif Display for highlighted phrases and the menu tagline */
body.ed h1 em,body.ed h2 em,body.ed h3 em{font-family:var(--accent);font-weight:400;font-style:normal;letter-spacing:-.015em}
.menu-footer p{font-family:var(--accent)}

/* ---- site-wide application ---- */
/* Hero: the oversized headline is for the short home headline (.hero.xl); longer headlines use a calmer size */
body.ed .hero:not(.xl) h1{font-size:clamp(40px,4.4vw,62px);line-height:1.06;letter-spacing:-.035em}
@media(max-width:760px){body.ed .hero:not(.xl) h1{font-size:clamp(34px,9.6vw,44px)}}
body.ed .hero:not(.xl){min-height:620px}
/* Inline films: centered play circle that opens the lightbox */
.film .film-play,.thumb .film-play{justify-content:center;align-items:center;padding:0;background:linear-gradient(0deg,#101b1866,transparent)}
.film .play-circle{width:110px;height:110px}
@media(max-width:760px){.film .play-circle{width:84px;height:84px}}
/* FAQ cards read on any ground */
.ed-faq:not(.stone) details{background:var(--stone);border-color:var(--stone)}
.ed-faq:not(.stone) details[open]{border-color:var(--graphite)}
/* Headings in note boxes and proof boxes follow the DM Sans scale */
body.ed .note-box h3,body.ed .proof-box h4,body.ed .offer-main h3,body.ed .also h3,body.ed .anatomy-head h3,body.ed .dg-head h3,body.ed .work-item h3{font-family:var(--sans);font-weight:500;letter-spacing:-.03em}

.ed-closing a:not(.button){color:var(--graphite);text-decoration:underline}
/* Refined logo: three bars inside the copper frame corner, with the wordmark */
.ed-head .logo img{width:250px;height:auto}
.overlay-top img{width:240px;height:auto}
.site-foot .foot img{width:260px;height:auto}
@media(max-width:760px){.ed-head .logo img{width:min(220px,56vw)}.overlay-top img{width:200px}}