/* Alternating editorial palettes, starting with blue on beige after V01. */
#opening{padding-bottom:0}
#the-route,#for-partners{--ink:#354F83;--accent:#354F83;--muted:#556381;--line:#354F8355;--surface:#E4D9BF;--media:#D9CEB5;background:#EBE2CD;color:var(--ink)}
#the-route>.track-transition{top:0;height:calc(var(--chapter-lead) - var(--section));color:#354F83}
#the-route .production-steps{border-color:var(--line);background:rgb(53 79 131 / 3%)}
#the-route .production-steps article+article{border-color:var(--line)}
#the-route .benefit-number{color:#354F83}
#the-film,#the-story-unfolds,#the-opportunity,#lets-talk{--ink:#EBE2CD;--accent:#EBE2CD;--muted:#D9D0BB;--line:#EBE2CD55;--surface:#435B8A;--media:#516792;background:transparent;color:var(--ink)}
#the-film h2,#the-film .copy,#the-story-unfolds h2,#the-story-unfolds h3,#the-story-unfolds .copy,#the-opportunity h2,#lets-talk h2,#lets-talk .copy{color:var(--ink)}
#the-film .placeholder:hover,#the-story-unfolds .placeholder:hover,#the-opportunity .placeholder:hover,#lets-talk .placeholder:hover{background:#5B709C}
#for-partners .placeholder:hover{background:#C9BFA9}
#for-partners .tabs button{color:#354F83;box-shadow:inset 0 0 0 1px #354F83}
#for-partners .tabs button[aria-selected=true]{background:#354F83;color:#EBE2CD}
#for-partners .format-frame{background:var(--media);color:var(--ink)}
#for-partners .format-frame svg{color:var(--muted)}
/* The screening's blue atmosphere gradually gives way to a beige offer area. */
#deliverables{background:linear-gradient(to bottom,transparent 0,transparent 15svh,rgb(235 226 205 / .02) 25svh,rgb(235 226 205 / .07) 40svh,rgb(235 226 205 / .16) 55svh,rgb(235 226 205 / .28) 70svh,rgb(235 226 205 / .43) 85svh,rgb(235 226 205 / .6) 100svh,rgb(235 226 205 / .77) 115svh,rgb(235 226 205 / .91) 130svh,rgb(235 226 205 / .98) 140svh,#EBE2CD 150svh,#EBE2CD 100%)}
#quotation,#liqen{background:#EBE2CD}
#deliverables .offer-frame,#quotation .offer-frame,#liqen .offer-frame{--ink:#EBE2CD;--accent:#EBE2CD;--muted:#D9D0BB;--line:#EBE2CD55;--surface:#435B8A;--media:#516792;background:#354F83;color:var(--ink);border-color:var(--line)}
#deliverables .offer-frame .deliverable-label,#deliverables .offer-frame .deliverable-metrics dd{color:#FFDE59}
#deliverables .offer-frame .deliverable-unit,#deliverables .offer-frame .deliverables-note,.quotation-frame .quotation-panel{background:rgb(235 226 205 / 6%);color:#EBE2CD;border-color:var(--line)}
#deliverables .offer-frame .optional-disclosure>.disclosure-toggle,#deliverables .offer-frame .optional-disclosure>.disclosure-toggle:hover{background:transparent;color:#EBE2CD;box-shadow:inset 0 0 0 1px var(--line)}
#deliverables .offer-frame .optional-disclosure>.disclosure-toggle>span:first-child,#deliverables .offer-frame .optional-disclosure>.disclosure-toggle>.disclosure-icon{color:#EBE2CD}
.chapter-disclosure>.chapter-disclosure-toggle,.chapter-disclosure>.chapter-disclosure-toggle:hover{background:#354F83;color:#EBE2CD;box-shadow:inset 0 0 0 1px #354F8355}
.studio-frame .text-link{color:#EBE2CD;box-shadow:inset 0 0 0 1px #EBE2CD}
.studio-frame .text-link:hover{background:#EBE2CD;color:#354F83}
.studio-frame .placeholder:hover{background:#5B709C}
/* The closing track stays on beige; contact returns to the blue atmosphere. */
#lets-talk{background:linear-gradient(to bottom,#EBE2CD 0,#EBE2CD calc(var(--chapter-lead) - var(--section)),transparent calc(var(--chapter-lead) - var(--section)),transparent 100%)}
#lets-talk .track-transition{color:#354F83}
#lets-talk .closing-grid{padding-top:var(--section)}
#lets-talk .development-note{color:var(--muted)}
#lets-talk footer a{color:#EBE2CD}
.project-presentation-download{margin-top:var(--section)}
#the-opportunity .opportunity-visual{margin-bottom:0}

/* Clean reading surface: native scrolling remains available. */
.progress-track{display:none!important}
html,body{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}

/* Light inset cards and a symmetrical, scroll-drawn outline system. */
#deliverables .offer-frame,#quotation .offer-frame,#liqen .offer-frame{--ink:#354F83;--accent:#354F83;--muted:#556381;--line:#354F8355;--surface:#DFD5BF;--media:#D5CAB1;background:#E4DCC9;color:var(--ink);transform:none;opacity:1;will-change:auto}
#deliverables .offer-frame .deliverable-label,#deliverables .offer-frame .deliverable-metrics dd{color:#354F83}
#deliverables .offer-frame .deliverable-unit,#deliverables .offer-frame .deliverables-note,.quotation-frame .quotation-panel{background:rgb(53 79 131 / 3%);color:#354F83;border-color:var(--line)}
#deliverables .offer-frame .optional-disclosure>.disclosure-toggle,#deliverables .offer-frame .optional-disclosure>.disclosure-toggle:hover{color:#354F83;background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
#deliverables .offer-frame .optional-disclosure>.disclosure-toggle>span:first-child,#deliverables .offer-frame .optional-disclosure>.disclosure-toggle>.disclosure-icon{color:#354F83}
.chapter-disclosure>.chapter-disclosure-toggle,.chapter-disclosure>.chapter-disclosure-toggle:hover{background:#E4DCC9;color:#354F83;--line:#354F8355;box-shadow:inset 0 0 0 1px var(--line)}
.studio-frame .text-link{color:#354F83;box-shadow:inset 0 0 0 1px #354F83}
.studio-frame .text-link:hover{background:#354F83;color:#EBE2CD}
.studio-frame .placeholder:hover{background:#C9BFA9}
@media(min-width:901px){#the-opportunity .opportunity-head>.section-head{grid-column:8/-1}}
.project-presentation-download{margin-top:calc(var(--section)*1.65);--link-entry:0}
.project-presentation-download>.project-presentation-link{opacity:var(--link-entry);transform:translate3d(0,calc((1 - var(--link-entry))*38px),0);will-change:opacity,transform}
/* V01 shrinks to 84%: place the first dot at its visible lower edge. */
#the-route>.track-transition{top:calc(-8svh + 32px);height:calc(var(--chapter-lead) - var(--section) + 8svh - 32px);z-index:2}
.trace-frame{position:relative;--trace-progress:0;--trace-content:0;border-color:transparent!important}
.trace-frame.trace-control{box-shadow:none!important}
.trace-outline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;border-radius:inherit;z-index:2}
.trace-outline path{fill:none;stroke:#354F8355;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--trace-progress));stroke-linecap:round}
.trace-copy{opacity:var(--trace-content);transform:translate3d(0,calc((1 - var(--trace-content))*12px),0);will-change:opacity,transform}
@media(prefers-reduced-motion:reduce){.trace-frame{--trace-progress:1!important;--trace-content:1!important}.trace-copy,.project-presentation-download>.project-presentation-link{opacity:1;transform:none;will-change:auto}}
body.motion-off .trace-frame{--trace-progress:1!important;--trace-content:1!important}body.motion-off .trace-copy,body.motion-off .project-presentation-download>.project-presentation-link{opacity:1;transform:none;will-change:auto}
@media print{.trace-frame{border-color:#354F8355!important}.trace-outline{display:none}.trace-copy,.project-presentation-download>.project-presentation-link{opacity:1;transform:none}}

/* Content is immediately readable: no generic upward entrance or opacity reveal. */
.reveal,.reveal.is-visible,.scroll-arrival,.chapter-bookend .scroll-arrival{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;transition:none!important}

/* Contact is a light inset frame on the same beige page surface. */
#lets-talk{--ink:#354F83;--accent:#354F83;--muted:#556381;--line:#354F8355;--surface:#DFD5BF;--media:#D5CAB1;background:#EBE2CD;color:var(--ink)}
#lets-talk .contact-frame{--ink:#354F83;--accent:#354F83;--muted:#556381;--line:#354F8355;--surface:#DFD5BF;--media:#D5CAB1;background:#E4DCC9;color:var(--ink);transform:none;opacity:1;will-change:auto}
#lets-talk .closing-grid{padding-top:0}
#lets-talk footer a{color:#354F83}
#lets-talk .placeholder:hover{background:#C9BFA9}

#the-opportunity .opportunity-head>.section-head{display:block;text-align:left}
#the-opportunity .connection-subtitle{margin:0;text-align:left}

/* Inside traced frames, reveal type symmetrically without upward travel or fading. */
.trace-copy{opacity:1;transform:none;clip-path:inset(0 calc((1 - var(--trace-content))*50%) 0 calc((1 - var(--trace-content))*50%));will-change:clip-path}
@media(prefers-reduced-motion:reduce){.trace-copy{clip-path:none}}body.motion-off .trace-copy{clip-path:none}
@media print{.trace-copy{clip-path:none}}

/* Equal space on either side of the V08 / V12 palette boundary. */
#for-partners{padding-bottom:var(--section)}
#the-opportunity{padding-top:var(--section)}

/* Later, brisk top-to-bottom curtains; interior fills fade independently. */
.trace-copy{clip-path:inset(0 0 calc((1 - var(--copy-reveal,0))*100%) 0);opacity:1;transform:none}
.trace-filled{background:transparent!important;isolation:isolate}
.trace-fill{position:absolute;inset:0;border-radius:inherit;opacity:var(--fill-reveal,0);pointer-events:none;z-index:-1}
#deliverables .has-trace-divider{position:relative;border-left-color:transparent!important}
.trace-divider{position:absolute;top:0;bottom:0;left:-1px;width:1px;background:#354F8355;transform:scaleY(var(--divider-reveal,0));transform-origin:center top;pointer-events:none}
#lets-talk .contact-frame{padding-bottom:16.8px}
#lets-talk .contact-people a{font-size:18px;line-height:1.3}
@media(prefers-reduced-motion:reduce){.trace-copy{clip-path:none}.trace-fill{opacity:1}.trace-divider{transform:none}}
body.motion-off .trace-copy{clip-path:none}body.motion-off .trace-fill{opacity:1}body.motion-off .trace-divider{transform:none}
@media print{.trace-copy{clip-path:none}.trace-fill{opacity:1}.trace-divider{transform:none}}

#deliverables .trace-copy{clip-path:inset(0 0 calc((1 - var(--copy-reveal,0))*100%) 0)!important}
@media(prefers-reduced-motion:reduce){#deliverables .trace-copy{clip-path:none!important}}body.motion-off #deliverables .trace-copy{clip-path:none!important}
@media print{#deliverables .trace-copy{clip-path:none!important}}

/* Shorter handover after Maria’s project link; reach beige earlier. */
#deliverables{padding-top:105svh;background:linear-gradient(to bottom,transparent 0,transparent 8svh,rgb(235 226 205 / .04) 16svh,rgb(235 226 205 / .12) 27svh,rgb(235 226 205 / .25) 40svh,rgb(235 226 205 / .43) 53svh,rgb(235 226 205 / .64) 66svh,rgb(235 226 205 / .82) 79svh,rgb(235 226 205 / .94) 92svh,#EBE2CD 105svh,#EBE2CD 100%)}

/* A brief central pause for Maria’s project, followed by a quick handover. */
.project-presentation-download{position:relative;height:75svh;--link-alpha:0;--link-y:22px}
.project-presentation-download>.project-presentation-link{position:sticky;top:50svh;opacity:var(--link-alpha);transform:translate3d(0,calc(-50% + var(--link-y)),0);transition:none}
#deliverables{padding-top:30svh;background:linear-gradient(to bottom,transparent 0,rgb(235 226 205 / .10) 4svh,rgb(235 226 205 / .35) 11svh,rgb(235 226 205 / .72) 20svh,#EBE2CD 30svh,#EBE2CD 100%)}
/* All three labels echo the Maria download capsule, with identical type. */
#title-deliverables,#production-quotation-control-title,#studio-control-title{display:inline-block;width:auto;background:#FFDE59;color:#354F83;border:1px solid #354F83;border-radius:5px;padding:5px 10px;font-family:Aileron,Arial,sans-serif!important;font-size:18px!important;font-weight:400!important;line-height:1.3!important;letter-spacing:0!important;text-transform:uppercase!important}
#deliverables .offer-frame>.section-head{text-align:center}
#lets-talk .placeholder[data-asset^="V11"]{aspect-ratio:3/2}
#lets-talk .closing-copy{height:auto}
#lets-talk .closing-copy .opportunity-download{margin-top:28px;padding-top:0}
@media(prefers-reduced-motion:reduce){.project-presentation-download{height:auto}.project-presentation-download>.project-presentation-link{position:relative;top:auto;opacity:1;transform:none}}
body.motion-off .project-presentation-download{height:auto}body.motion-off .project-presentation-download>.project-presentation-link{position:relative;top:auto;opacity:1;transform:none}
@media print{.project-presentation-download{height:auto}.project-presentation-download>.project-presentation-link{position:relative;top:auto;opacity:1;transform:none}}

/* Mirror the measured V08-to-boundary gap above V12. */
#the-opportunity{padding-top:var(--v12-top-gap,var(--section))}

/* A gentler handover into the beige offer area. */
#deliverables{padding-top:55svh;background:linear-gradient(to bottom,transparent 0,rgb(235 226 205 / .025) 5svh,rgb(235 226 205 / .10) 12svh,rgb(235 226 205 / .25) 21svh,rgb(235 226 205 / .46) 30svh,rgb(235 226 205 / .69) 39svh,rgb(235 226 205 / .88) 48svh,#EBE2CD 55svh,#EBE2CD 100%)}
/* Flat yellow editorial labels: no blue outline or rounded corners. */
#title-deliverables,#production-quotation-control-title,#studio-control-title,#deliverables #more-media-title{display:inline-block;width:auto;background:#FFDE59;color:#354F83;border:0;border-radius:0;padding:5px 10px;font-family:Aileron,Arial,sans-serif!important;font-size:18px!important;font-weight:400!important;line-height:1.3!important;letter-spacing:0!important;text-transform:uppercase!important}
/* Equal breathing space before the contacts and before the download. */
#lets-talk{--contact-breath:calc(var(--space) + 32px)}
#lets-talk .closing-copy>.section-head{margin-bottom:0}
#lets-talk .contact-people{margin-top:var(--contact-breath)}
#lets-talk .closing-copy .opportunity-download{margin-top:var(--contact-breath);padding-top:0}
#lets-talk .closing-grid{align-items:start}
#lets-talk .closing-grid>div:last-child{align-self:start;align-items:flex-start}

/* A balanced fade straddles the boundary: beige starts during the link pause. */
#the-opportunity{background:linear-gradient(to bottom,transparent 0,transparent calc(100% - 55svh),rgb(235 226 205 / .025) calc(100% - 44svh),rgb(235 226 205 / .10) calc(100% - 33svh),rgb(235 226 205 / .22) calc(100% - 22svh),rgb(235 226 205 / .36) calc(100% - 11svh),rgb(235 226 205 / .5) 100%)}
#deliverables{background:linear-gradient(to bottom,rgb(235 226 205 / .5) 0,rgb(235 226 205 / .64) 11svh,rgb(235 226 205 / .78) 22svh,rgb(235 226 205 / .90) 33svh,rgb(235 226 205 / .975) 44svh,#EBE2CD 55svh,#EBE2CD 100%)}
/* Static panels; only disclosure-body keeps its existing unfold transition. */
#deliverables .offer-frame,#quotation .offer-frame,#liqen .offer-frame,#lets-talk .contact-frame{transform:none;opacity:1;will-change:auto;border:1px solid #354F8355}
#deliverables .placeholder,#deliverables .placeholder svg,#quotation .placeholder,#quotation .placeholder svg,#liqen .placeholder,#liqen .placeholder svg{transition:none;animation:none;transform:none}
#deliverables .offer-frame>.section-head{margin-bottom:var(--space)}
#deliverables .optional-disclosure>.disclosure-toggle,#deliverables .optional-disclosure>.disclosure-toggle:hover{background:rgb(53 79 131 / 3%)}
/* Same height and horizontal inset as Film / Stills / Socials. */
.project-presentation-link,.project-presentation-link:visited{padding:12px 18px;line-height:1.5;font-size:18px;border:0;box-shadow:inset 0 0 0 1px #354F83}
/* V11 fills its column from the top inset to the download button baseline. */
@media(min-width:901px){
 #lets-talk .closing-grid{align-items:stretch}
 #lets-talk .closing-copy{height:auto}
 #lets-talk .closing-grid>div:last-child{position:relative;align-self:stretch;align-items:stretch;min-height:0}
 #lets-talk .placeholder[data-asset^="V11"]{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
}
@media(max-width:900px){#lets-talk .placeholder[data-asset^="V11"]{aspect-ratio:4/5}}

#deliverables .offer-frame .optional-disclosure>.disclosure-toggle,#deliverables .offer-frame .optional-disclosure>.disclosure-toggle:hover{background:rgb(53 79 131 / 3%)}
.project-presentation-link,.project-presentation-link:visited{line-height:1.3}
#deliverables .offer-frame>.section-head{margin-bottom:calc(var(--space) + 1px)}

/* One shared inset around the partner chapter and either side of its lower boundary. */
#for-partners{padding-top:var(--section);padding-bottom:var(--section)}
#for-partners .format-demo{margin-bottom:calc(-1 * var(--v08-tail,0px))}
#the-opportunity{padding-top:var(--section)}

/* Square final image and simple blue underlined email links. */
#lets-talk .closing-grid>div:last-child{align-self:start;display:block}
#lets-talk .placeholder[data-asset^="V11"]{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1/1}
#lets-talk .contact-people a,#lets-talk .contact-people a:hover{background:transparent;color:#354F83;border:0;border-bottom:1px solid #354F83;border-radius:0;padding:0 0 4px;text-decoration:none}

/* A concise studio panel: one body paragraph and the portfolio link. */
#liqen .studio-frame{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space)}
#liqen .studio-frame .studio-description{max-width:1040px;width:100%;margin:0;font-size:var(--body);line-height:1.3;letter-spacing:0}
#liqen .studio-frame .portfolio-link{margin:0;align-self:center}
#deliverables #more-media-title{background:transparent}

/* Option A: one budget overview followed by a compact, traceable breakdown. */
#quotation .quotation-frame{display:block}
#quotation .cost-intro{max-width:100%;margin:0 auto var(--space);text-align:center;font-size:var(--body);line-height:1.3}
.cost-overview{width:100%;max-width:840px;margin:0 auto var(--space);border-collapse:collapse;font-size:var(--body);font-variant-numeric:tabular-nums}
.cost-overview caption{text-align:left;font-size:var(--meta);letter-spacing:.035em;text-transform:uppercase;padding-bottom:12px;color:var(--muted)}
.cost-overview th,.cost-overview td{padding:12px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.cost-overview td{text-align:right;white-space:nowrap}
.cost-overview th span{display:inline-block;margin-left:8px;font-size:var(--meta);color:var(--muted)}
.cost-overview .cost-grand-total{background:rgb(53 79 131 / 6%);font-size:25.2px}
.cost-overview .cost-grand-total th,.cost-overview .cost-grand-total td{padding-top:16px;padding-bottom:16px}
.cost-breakdown{display:grid;gap:var(--offer-gap)}
.cost-phase{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.cost-phase-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;background:rgb(53 79 131 / 4%);padding:14px 16px;border-bottom:1px solid var(--line)}
.cost-phase-heading h3,.cost-phase-heading p{font-size:19.8px;line-height:1.2;margin:0;color:#354F83}
.cost-phase-heading p{font-variant-numeric:tabular-nums;white-space:nowrap}
.cost-detail{width:100%;table-layout:fixed;border-collapse:collapse;font-size:15.3px;line-height:1.3;font-variant-numeric:tabular-nums}
.cost-detail th,.cost-detail td{text-align:left;padding:9px 16px;border-bottom:1px solid var(--line);vertical-align:top;font-weight:400!important}
.cost-detail th:first-child{width:44%}.cost-detail th:nth-child(2){width:36%}.cost-detail th:last-child{width:20%}
.cost-detail thead th{font-size:var(--meta);letter-spacing:.035em;text-transform:uppercase;color:var(--muted)}
.cost-detail td:nth-child(2){color:var(--muted)}
.cost-detail th:last-child,.cost-detail td:last-child{text-align:right;white-space:nowrap}
.cost-detail tbody tr:last-child>*{border-bottom:0}
#quotation .cost-terms{max-width:1040px;margin:var(--space) auto 0;text-align:center;font-size:var(--body);line-height:1.3}
@media(max-width:900px){.cost-overview th,.cost-overview td{padding:10px}.cost-overview .cost-grand-total{font-size:19.8px}.cost-detail{font-size:13.5px}.cost-detail th,.cost-detail td{padding:9px 10px}.cost-detail th:first-child{width:43%}.cost-detail th:nth-child(2){width:34%}.cost-detail th:last-child{width:23%}.cost-overview th span{display:block;margin:4px 0 0}.cost-phase-heading h3,.cost-phase-heading p{font-size:18px}}

/* Centered overview and a complete rounded outline around the total row. */
.cost-overview-wrap{max-width:840px;margin:0 auto var(--space)}
.cost-overview{max-width:none;margin:0;border-collapse:separate;border-spacing:0}
.cost-overview caption{text-align:center}
.cost-overview .cost-grand-total th,.cost-overview .cost-grand-total td{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cost-overview tr:has(+ .cost-grand-total)>*{border-bottom:0}
.cost-overview .cost-grand-total th{border-left:1px solid var(--line);border-radius:var(--radius) 0 0 var(--radius)}
.cost-overview .cost-grand-total td{border-right:1px solid var(--line);border-radius:0 var(--radius) var(--radius) 0}

#liqen .studio-frame .studio-description{max-width:760px;width:100%;margin-left:auto;margin-right:auto}

/* Supplied LIQEN artwork, kept at the previous lettering cap height. */
.v01-overlay .intro-credit{display:flex;flex-direction:column;align-items:center;gap:.35em}
.v01-overlay .intro-liqen-logo{display:block;width:auto;height:.72em;max-width:100%;object-fit:contain}
#studio-control-title{background:transparent;border:0;padding:5px 0;line-height:1!important}
#studio-control-title .studio-toggle-logo{display:block;height:14.4px;width:auto;max-width:100%;object-fit:contain}

.v01-overlay .intro-liqen-logo,#studio-control-title .studio-toggle-logo{height:20px;width:auto}

#lets-talk .placeholder[data-asset^="V11"]{border-radius:0}

#format-frame .store-poster-preview{display:none}
#format-frame.more>svg:not(.store-poster-preview){display:none}
#format-frame.more>.store-poster-preview{display:block}
#format-frame.more{aspect-ratio:5/4}
.format-demo .tabs{flex-wrap:wrap}

/* Plain labels for assets and production cost. */
#title-deliverables,#production-quotation-control-title{background:transparent}
