/* Official owner-supplied identity. These tokens are scoped to ATHAR, not the personal site. */
body[data-page="athar"] {
  --athar-bg:#031416; --athar-bg-elevated:#082326;
  --athar-teal:#12B8AB; --athar-teal-soft:#09B9A9; --athar-gold:#D9B44A;
  --athar-gray:#A7BCBF; --athar-text:#E5F0EE; --athar-line:rgba(18,184,171,.24);
  --athar-ink:var(--athar-text); --athar-deep:var(--athar-bg); --athar-cream:var(--athar-text);
  --athar-mist:#B4D1CE; --athar-coral:var(--athar-gold);
  --athar-shadow:0 28px 80px rgba(0,0,0,.28);
  background:var(--athar-bg); color:#173b38;
}
/* Keep inherited personal-site shell/Ask ink unchanged; dark identity is main-only. */
body[data-page="athar"] main {isolation:isolate;color:var(--athar-text)}
body[data-page="athar"] main :is(a,button,input,summary):focus-visible {outline:3px solid var(--athar-gold);outline-offset:6px}
.brand-text-equivalent {position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
body[data-page="athar"] .athar-wrap {width:min(1300px,calc(100% - 96px))}
body[data-page="athar"] .athar-cinema {min-height:0;background:var(--athar-bg);color:var(--athar-text);overflow:hidden;--scene-duration:7.4s}
body[data-page="athar"] .athar-cinema::after {z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 60%,var(--athar-bg) 100%)}
body[data-page="athar"] .athar-cinema-scene {z-index:-1;pointer-events:none}
.brand-atmosphere {position:absolute;inset:0;background:radial-gradient(ellipse at 75% 18%,rgba(18,184,171,.14),transparent 40%),radial-gradient(ellipse at 58% 36%,rgba(113,133,141,.12),transparent 34%),linear-gradient(160deg,#031416,#09262A 59%,#031416)}
.brand-coast {position:absolute;inset:38% -10% auto;height:18%;background:linear-gradient(176deg,transparent 38%,rgba(113,133,141,.16) 39%,rgba(3,20,22,.88) 41%,transparent 49%);filter:blur(2px);opacity:.65}
.brand-water {position:absolute;inset:46% -10% -14%;background:radial-gradient(ellipse at 71% 0%,rgba(18,184,171,.16),transparent 50%),repeating-radial-gradient(ellipse at 70% -8%,transparent 0 22px,rgba(113,133,141,.08) 23px,transparent 24px 45px),linear-gradient(180deg,rgba(8,47,51,.45),#031416 85%);transform:perspective(550px) rotateX(18deg);transform-origin:top;opacity:.7}
.brand-environment {position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke-linecap:round;stroke-width:1}
.current-lines {stroke:#12B8AB;opacity:.19}
.air-lines {stroke:#71858D;opacity:.24}
.acoustic-line {stroke:#12B8AB;opacity:.13}
.evidence-line {stroke:#D9B44A;opacity:.28;stroke-dasharray:1500;stroke-dashoffset:0}
.evidence-gap {stroke:#12B8AB;opacity:.28;stroke-dasharray:4 10}
.environment-points {fill:#D9B44A;opacity:.6}
body[data-page="athar"] .athar-cinema-grid,
body[data-page="athar"] .athar-cinema-ar .athar-cinema-grid {
  min-height:min(850px,calc(100svh - 78px));display:grid;direction:inherit;
  grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);grid-template-rows:1fr auto auto;
  gap:0 3.5rem;align-items:center;padding-block:3rem 1.5rem;z-index:auto;
}
body[data-page="athar"] .athar-cinema-copy,
body[data-page="athar"] .athar-cinema-ar .athar-cinema-copy {grid-column:1;grid-row:1;max-width:580px;padding:0;position:relative;z-index:3}
body[data-page="athar"] .athar-cinema h1 {font:400 clamp(3.1rem,4.4vw,5rem)/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.045em;color:var(--athar-text);max-width:13ch;margin:1.4rem 0 1.8rem;text-wrap:balance}
body[data-page="athar"] .athar-cinema-ar h1 {font-family:"Segoe UI",Tahoma,sans-serif;max-width:14ch;font-size:clamp(2.8rem,4vw,4.7rem);line-height:1.35;letter-spacing:0}
body[data-page="athar"] .athar-public-label {display:block;padding:0;border:0;background:none;backdrop-filter:none;color:var(--athar-teal);font-size:.68rem;font-weight:650;letter-spacing:.13em;min-height:0}
body[data-page="athar"] .athar-cinema-lead {font:400 clamp(1.3rem,1.8vw,1.7rem)/1.4 Georgia,serif;color:#C5DEDA}
body[data-page="athar"] .athar-cinema-ar .athar-cinema-lead {font-family:"Segoe UI",Tahoma,sans-serif;line-height:1.65}
body[data-page="athar"] .athar-cinema-support {max-width:42ch;margin:1rem 0 1.4rem;color:var(--athar-gray);font-size:.98rem;line-height:1.75}
body[data-page="athar"] .athar-status {padding:.5rem .75rem;min-height:34px;background:rgba(217,180,74,.06);border-color:rgba(217,180,74,.46);color:var(--athar-gold);font-size:.65rem;letter-spacing:.07em;backdrop-filter:none}
.athar-brand-stage {position:relative;grid-column:2;grid-row:1;width:100%;max-width:640px;aspect-ratio:1;justify-self:center;direction:ltr}
.athar-official-lockup {position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;opacity:1;mix-blend-mode:lighten}
.brand-symbol-reveal {position:absolute;inset:0 9% 18%;display:grid;place-items:center;opacity:0;transform-origin:50% 68%}
.brand-symbol {width:100%;height:100%;overflow:visible}
.brand-drop {position:absolute;left:50%;top:30%;width:23px;height:32px;opacity:0;border-radius:52% 48% 48% 52%/62% 62% 38% 38%;background:radial-gradient(ellipse at 32% 24%,#D5EBE4 0,rgba(213,235,228,.75) 5%,transparent 23%),linear-gradient(120deg,rgba(18,184,171,.7),rgba(9,60,63,.5));box-shadow:inset 2px 2px 3px rgba(222,246,236,.5),inset -3px -4px 5px rgba(0,0,0,.55);transform:translateX(-50%)}
.brand-ripples {position:absolute;inset:64% 0 auto;height:22%;perspective:500px}
.brand-ripples i {position:absolute;inset:0 10%;border:1px solid rgba(18,184,171,.55);border-radius:50%;opacity:0;transform:scale(.12)}
body[data-page="athar"] .athar-motion-control {position:relative;grid-column:2;grid-row:1;align-self:start;justify-self:end;inset:auto;z-index:4;display:flex;min-height:44px;margin:0;padding:.35rem .8rem;border:1px solid var(--athar-line);background:rgba(3,20,22,.6);color:var(--athar-gray);font-size:.75rem}
body[data-page="athar"] .athar-motion-control input {accent-color:var(--athar-teal);width:18px;height:18px}
body[data-page="athar"] .athar-sequence {grid-row:3;grid-column:1/-1;border:0;border-top:1px solid var(--athar-line);background:none;backdrop-filter:none;position:relative;gap:0;direction:inherit}
body[data-page="athar"] .athar-sequence li {position:relative;min-height:58px;color:var(--athar-gray);font-size:.65rem;font-weight:500;letter-spacing:.08em;border:0;padding-top:1.3rem;text-align:center}
body[data-page="athar"] .athar-sequence li::before {content:"";position:absolute;top:-3px;left:calc(50% - 3px);width:5px;height:5px;border-radius:50%;background:var(--athar-teal);box-shadow:0 0 0 5px var(--athar-bg)}
body[data-page="athar"] .athar-sequence li:last-child {color:var(--athar-gold)}
body[data-page="athar"] .athar-sequence li:last-child::before {background:var(--athar-gold)}
/* Motion is progressive enhancement: without JavaScript the official identity is resolved. */
.athar-cinema[data-motion="playing"] .brand-symbol-reveal {animation:brand-symbol-reveal var(--scene-duration) both}
.athar-cinema[data-motion="playing"] .brand-part-1 {stroke-dasharray:1;animation:brand-outline var(--scene-duration) both}
.athar-cinema[data-motion="playing"] .brand-part-2 {animation:brand-fill var(--scene-duration) both}
.athar-cinema[data-motion="playing"] .brand-part-3 {animation:brand-gold var(--scene-duration) both}
.athar-cinema[data-motion="playing"] :is(.brand-part-4,.brand-part-5) {animation:brand-ring var(--scene-duration) both}
.athar-cinema[data-motion="playing"] .brand-drop {animation:brand-drop var(--scene-duration) cubic-bezier(.4,0,.7,1) both}
.athar-cinema[data-motion="playing"] .brand-ripples i {animation:brand-impact var(--scene-duration) both}
.athar-cinema[data-motion="playing"] .brand-ripples i:nth-child(2) {animation-delay:.15s}
.athar-cinema[data-motion="playing"] .brand-ripples i:nth-child(3) {animation-delay:.3s}
.athar-cinema[data-motion="playing"] .athar-official-lockup {animation:brand-resolve var(--scene-duration) both}
.athar-cinema[data-motion="playing"] .evidence-line {animation:brand-evidence var(--scene-duration) both}
.athar-cinema[data-motion="playing"] :is(.air-lines,.acoustic-line,.environment-points) {animation:brand-context var(--scene-duration) both}
body[data-page="athar"]:has(.motion-toggle:checked) main *,body[data-page="athar"]:has(.motion-toggle:checked) main *::before,body[data-page="athar"]:has(.motion-toggle:checked) main *::after {animation-play-state:paused!important}
@keyframes brand-symbol-reveal {0%,7%{opacity:0;transform:scale(1)}12%,29%{opacity:1;transform:scale(1)}37%{opacity:0;transform:scale(.07) translateY(8%)}100%{opacity:0;transform:scale(.07)}}
@keyframes brand-outline {0%,7%{stroke-dashoffset:1}25%,100%{stroke-dashoffset:0}}
@keyframes brand-fill {0%,16%{opacity:0}27%,100%{opacity:1}}
@keyframes brand-gold {0%,23%{opacity:0}30%,100%{opacity:1}}
@keyframes brand-ring {0%,26%{opacity:0}34%,100%{opacity:1}}
@keyframes brand-drop {0%,32%{opacity:0;top:32%;transform:translateX(-50%) scale(.4)}36%{opacity:1;top:34%;transform:translateX(-50%) scale(1)}48%{opacity:1;top:67%;transform:translateX(-50%) scale(.9,1.12)}50%{opacity:0;top:68%;transform:translateX(-50%) scale(1.5,.15)}100%{opacity:0;top:68%}}
@keyframes brand-impact {0%,47%{opacity:0;transform:scale(.06)}50%{opacity:.7;transform:scale(.1)}72%{opacity:.2;transform:scale(1)}84%,100%{opacity:0;transform:scale(1.55)}}
@keyframes brand-evidence {0%,49%{stroke-dashoffset:1500;opacity:0}59%{opacity:.55}82%,100%{stroke-dashoffset:0;opacity:.28}}
@keyframes brand-context {0%,52%{opacity:0}82%,100%{opacity:.24}}
@keyframes brand-resolve {0%,71%{opacity:0;transform:translateY(8px)}95%,100%{opacity:1;transform:translateY(0)}}
@media(min-width:1600px){body[data-page="athar"] .athar-cinema-grid{padding-block:4rem 2rem;gap:0 5rem}.athar-brand-stage{max-width:620px}}
@media(max-width:1100px){body[data-page="athar"] .athar-wrap{width:calc(100% - 56px)}body[data-page="athar"] .athar-cinema-grid,body[data-page="athar"] .athar-cinema-ar .athar-cinema-grid{gap:0 1.6rem;min-height:700px}body[data-page="athar"] .athar-cinema h1{font-size:3.2rem}body[data-page="athar"] .athar-cinema-ar h1{font-size:2.85rem}.athar-brand-stage{align-self:center}}
@media(max-width:760px){
 body[data-page="athar"] .athar-wrap{width:calc(100% - 40px)}
 body[data-page="athar"] .athar-cinema-grid,body[data-page="athar"] .athar-cinema-ar .athar-cinema-grid{grid-template-columns:1fr;grid-template-rows:auto auto auto auto;gap:0;min-height:0;padding-block:.6rem 1.1rem}
 .athar-brand-stage{grid-column:1;grid-row:1;width:min(100%,340px);max-width:none;aspect-ratio:1;}
 body[data-page="athar"] .athar-cinema-copy,body[data-page="athar"] .athar-cinema-ar .athar-cinema-copy{grid-column:1;grid-row:2;padding:0;max-width:540px;justify-self:center;width:100%}
 body[data-page="athar"] .athar-cinema h1{font-size:clamp(2.2rem,7.8vw,3.2rem);line-height:1.12;max-width:17ch;margin:.8rem 0 1rem}
 body[data-page="athar"] .athar-cinema-ar h1{font-size:clamp(2rem,7.4vw,2.9rem);line-height:1.4;max-width:18ch}
 body[data-page="athar"] .athar-public-label{font-size:.59rem;letter-spacing:.09em}
 body[data-page="athar"] .athar-cinema-lead{font-size:1.2rem}
 body[data-page="athar"] .athar-cinema-support{font-size:.9rem;line-height:1.65;max-width:none;margin:.6rem 0 1rem}
 body[data-page="athar"] .athar-status{font-size:.6rem;letter-spacing:.045em}
 body[data-page="athar"] .athar-motion-control{grid-column:1;grid-row:3;justify-self:end;margin:.75rem 0 1rem;font-size:.7rem}
 body[data-page="athar"] .athar-sequence{grid-row:4;grid-template-columns:repeat(3,1fr);row-gap:1rem}
 body[data-page="athar"] .athar-sequence li{font-size:.58rem;min-height:40px;padding-top:.8rem}
 .brand-water{inset:20% -10% 0;opacity:.45}.brand-coast{top:17%}.brand-environment{opacity:.4}
}
@media(prefers-reduced-motion:reduce){
 body[data-page="athar"] main{scroll-behavior:auto}
 .athar-cinema:not([data-motion="playing"]) :is(.brand-symbol-reveal,.brand-drop,.brand-ripples){display:none}
 .athar-cinema:not([data-motion="playing"]) .athar-official-lockup{opacity:1;transform:none;animation:none!important}
 body[data-page="athar"] .athar-motion-control{display:flex}
 /* Explicit visitor opt-in only; initial/reloaded reduced-motion remains static. */
 .athar-cinema[data-motion="playing"] .brand-symbol-reveal{animation:brand-symbol-reveal var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] .brand-part-1{animation:brand-outline var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] .brand-part-2{animation:brand-fill var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] .brand-part-3{animation:brand-gold var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] :is(.brand-part-4,.brand-part-5){animation:brand-ring var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] .brand-drop{animation:brand-drop var(--scene-duration) cubic-bezier(.4,0,.7,1) both!important}
 .athar-cinema[data-motion="playing"] .brand-ripples i{animation:brand-impact var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] .brand-ripples i:nth-child(2){animation-delay:.15s!important}
 .athar-cinema[data-motion="playing"] .brand-ripples i:nth-child(3){animation-delay:.3s!important}
 .athar-cinema[data-motion="playing"] .athar-official-lockup{animation:brand-resolve var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] .evidence-line{animation:brand-evidence var(--scene-duration) both!important}
 .athar-cinema[data-motion="playing"] :is(.air-lines,.acoustic-line,.environment-points){animation:brand-context var(--scene-duration) both!important}
}
