/* Cinematic V4 — photographs in every scroll chapter; refined gold + blue identity.
   The production V3 remains unchanged. */
:root { --cin-gold:#eab976; --cin-gold-light:#f6d5a8; --copper:#eab976; --copper-soft:#f7e3ca; }
body{background:#061728;}
/* Retain the blue official logo; warm accents belong to editorial typography and motion only. */
.cine-chapter h1 em,.cine-chapter h2 em{color:var(--cin-gold);text-shadow:0 3px 48px rgba(239,164,64,.12)}
.cine-kicker{color:#f4c994}.cin-dot{background:var(--cin-gold);box-shadow:0 0 19px #f2bb7777}
.cine-primary{background:var(--cin-gold);border-color:var(--cin-gold);color:#081f33}
.cine-primary:hover{background:var(--cin-gold-light);border-color:var(--cin-gold-light)}
.cine-rail-link:hover,.cine-rail-link.is-active{color:#ffe0b2}
.cine-rail-line i{background:linear-gradient(90deg,#56c6fd,#f3b762)}
.cine-route-line{stroke:#f2bf73;stroke-width:1.65;filter:drop-shadow(0 0 8px #edac4e75)}
.cine-route-point{fill:#f5c487}.cine-route-ghost{stroke:#e8ba7450}
.cine-hud-label{color:#e0e5ed}.cine-scroll-label b{color:var(--cin-gold)}
.cine-chapter-count b{color:#ffe2bc;opacity:.21}
/* Fourth shot is now photographic instead of three consecutive dark-blue scrolls. */
.cine-shot-finale{background:#0a2538}
.cine-shot-finale .finale-photo{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:63% 58%;transform:scale(1.075);filter:brightness(.91) saturate(.89) contrast(1.05)}
.cine-shot-finale .finale-grid{opacity:.12;mix-blend-mode:screen}
.cine-shot-finale .finale-lines{opacity:.37;filter:drop-shadow(0 0 12px #ebba7455);mix-blend-mode:screen}
.cine-shot-finale .finale-nodes circle{fill:#ebbf84}
.cine-light{background:linear-gradient(90deg,rgba(2,14,27,.9) 0%,rgba(3,18,31,.69) 28%,rgba(3,18,31,.18) 73%,rgba(2,16,27,.15) 100%),linear-gradient(0deg,rgba(2,14,28,.83),transparent 24%,transparent 62%,rgba(3,17,28,.27))}
.cine-shot-dispatch{filter:saturate(.92) brightness(.85)}.cine-shot-loading{filter:saturate(.97) brightness(.91)}
/* Depth and transition quality: no hard color change between 4th frame and services. */
.services{background:radial-gradient(ellipse 63% 54% at 78% 23%,#234365 0%,transparent 63%),linear-gradient(180deg,#071a2c 0%,#0a2b46 52%,#071b2f 100%)}
.services .section-head h2,.brief h2,.business h2{color:#fbfcff}
.services .muted-heading,.business .muted-heading{color:#c9d6e0}
.services .eyebrow.dark,.brief .eyebrow.dark,.contact .eyebrow{color:#e9b87b}
.services .section-head h2:after{content:"";display:block;width:75px;height:2px;margin-top:28px;background:linear-gradient(90deg,#e9af60,#4bbaff)}
.signal-main-line{stroke:url(#sg);filter:drop-shadow(0 0 10px #47caff9c)}
.service-map{border-color:#d3af6750}.service-map figcaption{letter-spacing:.11em}
.services .service-detail .service-no{color:#eab975}
.services .service-detail summary:hover h3{color:#ffddac}
/* Between chapters, the signal-journey interlude stays animated; gold complements blue. */
.cine-interlude-image{background:radial-gradient(ellipse 74% 70% at 74% 60%,#2a5873 0%,#0c3c60 33%,#061c31 77%)}
.interlude-glow{background:radial-gradient(ellipse at 78% 64%,#eaba5940,transparent 52%),radial-gradient(ellipse at 94% 75%,#248cce30,transparent 42%)}
.interlude-road{background:linear-gradient(90deg,transparent,#f2bf71,#fff4d9,#46b6fa,transparent);box-shadow:0 0 20px #eab9767f}
.interlude-pin{background:#ffd79d;border-color:#c08d49;box-shadow:0 0 0 12px #efb66a20,0 0 30px #f4c57b66}
.cine-interlude h2 em{color:#eebc79}
.cine-interlude-copy>a{border-color:#eab976}.cine-interlude-copy>a span{color:#eab976}
/* Existing CTA mechanics remain, now with warm chosen-state and readable contrast. */
.brief .brief-controls .choice-group button[aria-pressed="true"],.brief-controls .choice-group button[aria-pressed="true"]{background:#e9bb7e!important;border-color:#e9bb7e!important;color:#09263d!important}
.brief-result>.button{background:#e8ba79;border-color:#e8ba79;color:#06233b}.brief-result>.button:hover{background:#f8dbaf}
.brief-mini{border-color:#b8976844}.brief-mini .brief-symbol{width:108px;height:76px;min-width:108px;color:#eaba77;padding:6px;border:1px solid #deb16d50;background:linear-gradient(140deg,#153d53,#081e34)}
.brief-mini strong{color:#f9fcff}
/* Restore the founder portrait as a major editorial image, like original Cinematic. */
.contact{background:radial-gradient(ellipse 72% 94% at 9% 80%,#1c4562 0%,transparent 71%),linear-gradient(180deg,#071b30,#082439 100%);padding:130px 0 140px}
.contact-grid{grid-template-columns:minmax(320px,445px) minmax(0,1fr);gap:clamp(38px,6vw,112px);align-items:center}
.portrait-frame{width:100%;max-width:445px;overflow:visible;border-radius:2px;box-shadow:0 32px 90px #0006}
.portrait-frame:before{inset:-14px;border-color:#eab97666;transform:translate(12px,10px)}
.portrait-frame>img{width:100%;height:auto;aspect-ratio:4/4.8;max-height:560px;object-fit:cover;object-position:50% 21%;filter:saturate(.99) contrast(1.04)}
.portrait-caption{padding:21px 0 0;max-width:none}.portrait-caption span{color:#f0c68b!important;font-size:10px;letter-spacing:.17em}
.portrait-caption p{font-size:18px;margin-top:5px!important}
.contact h2 em{color:#ecc082}
.contact-options>a b{color:#f4c580}.contact-options>a:hover strong{color:#fff2ce}
.business{background:linear-gradient(180deg,#071a2b,#061827)}
.business .eyebrow.dark{color:#e7b779}
.footer-glow{background:radial-gradient(ellipse at 80% -10%,#245e7750,transparent 58%)}
/* Keep mobile chapter photos readable and portrait prominent, never overwhelming. */
@media(max-width:1100px){.contact-grid{grid-template-columns:minmax(280px,40%) minmax(0,1fr);gap:38px}.portrait-frame{max-width:100%}}
@media(max-width:800px){.contact-grid{grid-template-columns:minmax(250px,42%) minmax(0,1fr);gap:30px}.portrait-frame{max-width:100%}.portrait-frame>img{height:auto;aspect-ratio:4/5}.brief-mini .brief-symbol{width:88px;min-width:88px}}
@media(max-width:600px){
 .cine-shot-finale .finale-photo{object-position:63% center;filter:brightness(.76) saturate(.9)}
 .cine-light{background:linear-gradient(90deg,#04182bea 0%,#04182bb5 33%,#04182b3d 100%),linear-gradient(0deg,#041827ad,transparent 34%)}
 .contact{padding:85px 0 98px}.contact-grid{display:flex;flex-direction:column;align-items:stretch;gap:42px}
 .portrait-frame{width:min(79vw,350px);max-width:350px;margin:0 auto 0 6px;justify-self:unset}
 .portrait-frame>img{height:auto;aspect-ratio:4/4.8;object-position:center 25%}
 .portrait-caption{max-width:100%}.portrait-caption p{font-size:16px}
 .contact h2{font-size:clamp(42px,11.2vw,62px)}
 .brief-mini .brief-symbol{width:72px;min-width:72px;height:60px}
}
/* Reduced motion and JS-disabled: original V3 fallback must show fourth image too. */
.motion-reduced .cine-chapter:nth-child(4),html:not(.js) .cine-chapter:nth-child(4){background-image:linear-gradient(90deg,#051827e8,#07233b88),url('assets/18c9a9521eb8f9c9.webp')!important;background-position:center center!important;background-size:cover!important}
@media(prefers-reduced-motion:reduce){.cine-chapter:nth-child(4){background-image:linear-gradient(90deg,#051827e8,#07233b88),url('assets/18c9a9521eb8f9c9.webp')!important}}

.portrait-frame{background:transparent;box-shadow:none}
.portrait-frame>img{border:1px solid #e8bd7a55;box-shadow:0 32px 90px #0006}
.portrait-caption{border-left:2px solid #eaba77;padding:8px 0 7px 16px;margin-top:20px;background:transparent!important}