/*! © 2026 PYRICATO PRODUCTIONS LLC. */
/* Shared surfaces and typography; each composition reflects a different content relationship. */
[data-compose]{position:relative;z-index:1;scroll-margin-top:100px}
[data-compose]:not([data-compose=reveal]){width:min(1180px,calc(100% - 64px));margin:0 auto;padding:clamp(72px,11vw,150px) 0}
[data-compose] p{margin:0;color:#b5bfd2;font:400 clamp(18px,1.55vw,21px)/1.65 var(--body);text-wrap:pretty}
[data-compose] .eyebrow{font:600 12px/1.5 var(--mono);letter-spacing:.16em;color:var(--peri);text-transform:uppercase;margin-bottom:22px}
[data-compose] h2{font:600 clamp(36px,4.9vw,68px)/1.06 var(--display);letter-spacing:-.035em;margin:0;text-wrap:balance}
[data-compose] h3{font:600 clamp(25px,2.5vw,34px)/1.13 var(--display);letter-spacing:-.025em;margin:0 0 20px;text-wrap:balance}
[data-compose-heading]{max-width:900px;margin-bottom:48px}
[data-compose-link]{display:inline-flex;align-items:center;min-height:48px;margin-top:28px;text-underline-offset:6px;color:var(--peri);font:500 17px/1.45 var(--body)}
[data-compose] button{font:500 16px/1.4 var(--body);color:var(--ink);cursor:pointer}
[data-compose] a:focus-visible,[data-compose] button:focus-visible{outline:2px solid var(--peri);outline-offset:6px}

/* A single native-shaped seed opens into a stage of related capabilities. */
[data-compose=reveal]{background:var(--void)}
[data-reveal-stage]{position:relative;padding:80px 32px;background:var(--deep)}
[data-reveal-cover],[data-reveal-surface]{display:none}
[data-reveal-content]{position:relative;max-width:1180px;margin:auto}
[data-reveal-content] [data-compose-heading]{max-width:880px;margin-bottom:28px}
[data-reveal-content] [data-compose-heading] h2{font-size:clamp(34px,4.2vw,56px)}
[data-capability-intro]{max-width:83ch;margin-bottom:38px}
[data-capabilities]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
[data-capability]{min-width:0;border:1px solid #a9b8ff29;border-radius:28px;padding:28px;background:linear-gradient(150deg,#1a2445,#10172b);box-shadow:0 30px 80px -30px #0009}
[data-capability=insight]{background:linear-gradient(150deg,#221e42,#141327)}
[data-capability=identity]{background:linear-gradient(150deg,#132d30,#101a24)}
[data-capability] h3{font-size:clamp(24px,2.1vw,30px)}
[data-capability] p{font-size:18px;line-height:1.6}
[data-compose] [data-compose-resolution]{margin-top:36px;font:500 clamp(22px,2.2vw,30px)/1.4 var(--display);color:var(--ink)}
[data-reveal-mode=motion] [data-reveal-stage]{position:sticky;top:0;height:100svh;padding:0;background:transparent;overflow:clip;isolation:isolate}
[data-reveal-mode=motion] [data-reveal-surface]{display:block;position:absolute;inset:0;background:var(--deep);z-index:-1;will-change:clip-path}
[data-reveal-mode=motion] [data-reveal-cover]{display:flex;position:absolute;left:50%;top:55%;width:min(78vw,380px);aspect-ratio:4/5;transform:translate(-50%,-50%);flex-direction:column;justify-content:space-between;padding:30px;box-sizing:border-box}
[data-reveal-cover] h2{font-size:clamp(30px,3.4vw,40px);line-height:1.08}
[data-reveal-cover] .eyebrow{margin:0}
[data-reveal-cover] button{align-self:flex-start;margin-top:20px;border:1px solid #ffffff40;background:#ffffff0b;padding:12px 18px;border-radius:999px}
[data-reveal-mode=motion] [data-reveal-content]{position:absolute;left:50%;top:50%;width:min(1180px,calc(100% - 64px));transform:translate(-50%,-50%);padding:0;will-change:opacity}
[data-reveal-kind=about] [data-reveal-cover] h2{font-size:clamp(29px,3.3vw,39px)}

/* Diagrams belong to their subject. No repeated brand stamp. */
[data-diagram]{height:108px;display:flex;align-items:center;gap:12px;margin-bottom:28px;position:relative;color:var(--peri)}
[data-diagram] i{display:block;position:relative;border:1px solid currentColor;background:#a9b8ff0c;border-radius:8px}
[data-diagram=flow] i{width:26%;height:24px}
[data-diagram=flow] i:nth-child(2n){height:48px}
[data-diagram=flow] i:nth-child(n+4){display:none}
[data-diagram=flow]:before{content:'';position:absolute;left:0;right:0;height:1px;background:#a9b8ff50}
[data-diagram=insight]{align-items:flex-end;border-bottom:1px solid #a9b8ff33;color:#b9a2ff;padding:0 12px 0}
[data-diagram=insight] i{width:16%;height:34%;border-radius:6px 6px 0 0;background:linear-gradient(#b9a2ff55,#b9a2ff08)}
[data-diagram=insight] i:nth-child(2){height:58%}[data-diagram=insight] i:nth-child(3){height:43%}[data-diagram=insight] i:nth-child(4){height:75%}[data-diagram=insight] i:nth-child(5){height:92%}
[data-diagram=identity]{color:#79d6c4;gap:0;justify-content:center}
[data-diagram=identity] i{width:62px;height:62px;border-radius:18px;margin-left:-14px;transform:rotate(-13deg);background:#163438}
[data-diagram=identity] i:nth-child(2){transform:rotate(0deg);background:#1a4545}[data-diagram=identity] i:nth-child(3){transform:rotate(13deg);background:#226060}[data-diagram=identity] i:nth-child(n+4){display:none}
[data-diagram=connection]{justify-content:center;height:80px;gap:30px}
[data-diagram=connection]:before{content:'';position:absolute;height:1px;left:18%;right:18%;background:linear-gradient(90deg,#a9b8ff20,#a9b8ff,#a9b8ff20)}
[data-diagram=connection] i{width:38px;height:48px;background:#111b3b;transform:rotate(-10deg)}
[data-diagram=connection] i:nth-child(2){height:62px;transform:rotate(0);background:#23366a;box-shadow:0 0 44px #3f6cf533}
[data-diagram=connection] i:nth-child(3){transform:rotate(10deg)}[data-diagram=connection] i:nth-child(n+4){display:none}

/* Audience comparison: two routes visible together. */
[data-audience-pair]{display:grid;grid-template-columns:1fr 1fr;gap:28px}
[data-audience-panel]{border:1px solid #a9b8ff30;border-radius:28px;padding:clamp(26px,4vw,48px);display:flex;flex-direction:column;align-items:flex-start;background:linear-gradient(150deg,#152340,#0d1426)}
[data-audience-panel="1"]{background:linear-gradient(150deg,#272039,#141122);border-color:#bb96da33}
[data-audience-panel] p{max-width:36ch}
[data-audience-panel] [data-compose-link]{margin-top:auto;padding-top:30px}
[data-audience-symbol]{display:flex;gap:7px;height:62px;align-items:center;margin-bottom:36px;color:#91b3ff}
[data-audience-symbol] i{display:block;width:32px;height:38px;background:currentColor;opacity:.7;border-radius:50% 50% 9px 9px}
[data-audience-panel="1"] [data-audience-symbol]{color:#bd8bf2}
[data-audience-panel="1"] [data-audience-symbol] i:nth-child(2){height:48px;opacity:1}
[data-compose=invitation]{padding-block:54px!important}
[data-compose=invitation] a{padding:clamp(28px,5vw,64px);border-top:1px solid #a9b8ff38;border-bottom:1px solid #a9b8ff38;display:flex;align-items:center;justify-content:space-between;gap:32px;text-decoration:none}
[data-compose=invitation] h2{font-size:clamp(52px,8vw,112px)}
[data-invitation-arrow]{font:400 clamp(64px,10vw,130px)/1 var(--display);color:var(--peri);transition:transform .25s}
[data-compose=invitation] a:hover [data-invitation-arrow]{transform:translate(6px,-6px)}
[data-principles]{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
[data-principles] article{border-top:1px solid #a9b8ff40;padding-top:24px;display:grid;gap:30px}
[data-principle-number]{font:500 14px/1 var(--mono);color:var(--peri)}
[data-principles] h3{max-width:14ch;font-size:clamp(26px,2.4vw,32px)}

/* Company overview stays one connected console. */
#operating-system[data-compose=system]{height:auto;min-height:0;padding-top:100px;padding-bottom:140px}
[data-compose=system] [data-compose-heading]{margin:0 auto 28px;text-align:center;max-width:1000px}
[data-compose] [data-system-intro]{max-width:62ch;text-align:center;margin:0 auto 48px}
[data-system-console]{display:grid;grid-template-columns:72px minmax(0,1fr);border:1px solid #a9b8ff40;border-radius:28px;overflow:hidden;max-width:1000px;margin:auto;background:linear-gradient(135deg,#182139,#0c1220);box-shadow:0 36px 130px -50px #3f6cf566}
[data-console-sidebar]{border-right:1px solid #a9b8ff24;padding:28px 20px;display:flex;align-items:center;flex-direction:column;gap:28px;background:#0c1428}
[data-console-sidebar] span{width:24px;height:24px;border:1px solid var(--peri);border-radius:8px;margin-bottom:24px;transform:rotate(15deg)}
[data-console-sidebar] i{width:18px;height:18px;border:1px solid #a9b8ff55;border-radius:5px}
[data-console-sidebar] i:nth-child(3){background:#a9b8ff30;border-color:var(--peri)}
[data-console-body]{padding:clamp(24px,4vw,44px)}
[data-console-body] header{margin-bottom:34px}
[data-console-body] small{font:500 12px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--peri)}
[data-console-body] h3{font-size:clamp(30px,3vw,44px);margin:12px 0}
[data-system-tiles]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
[data-system-tile]{position:relative;min-height:130px;padding:24px;border:1px solid #a9b8ff26;border-radius:16px;background:#111b2e}
[data-system-tile] small{font-size:11px;color:#a9b8cd}
[data-system-tile] b{display:block;font:500 23px/1.3 var(--display);margin-top:10px}
[data-tile-signal]{display:block;width:24px;height:3px;background:var(--peri);border-radius:3px;margin-top:22px;opacity:.7}
[data-system-tile="1"] [data-tile-signal],[data-system-tile="4"] [data-tile-signal]{background:#bd8bf2}
[data-system-tile="2"] [data-tile-signal],[data-system-tile="3"] [data-tile-signal]{background:#6edfc0}
[data-system-action]{text-align:center;margin:40px auto 0}
[data-system-action] .pill{white-space:normal;line-height:1.4}

/* About: a readable argument, with different forms for its different ideas. */
[data-about-composed] .nav{transform:translate(-50%,0);width:max-content;max-width:calc(100% - 32px)}
[data-about-composed] .szjzganqh{font:500 13px/1.4 var(--body);text-decoration:none;white-space:nowrap;padding:8px 12px}
[data-about-title]{font:500 13px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.2em;color:var(--peri);text-align:center;margin:108px 24px 22px}
[data-about-chapters]{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 26px;margin:0 24px 36px}
[data-about-chapters] a{color:#b5bfd2;font:500 15px/1.5 var(--body);text-decoration:none;padding:8px 0;border-bottom:1px solid transparent}
[data-about-chapters] a:hover,[data-about-chapters] a[aria-current]{color:var(--ink);border-color:var(--peri)}
[data-opening-thoughts]{display:grid;grid-template-columns:1fr 1.2fr;gap:28px;margin-top:42px}
[data-opening-thoughts] article{border:1px solid #a9b8ff38;background:linear-gradient(150deg,#1a2546,#11182d);border-radius:28px;padding:clamp(28px,4vw,48px)}
[data-opening-thoughts] p{font:500 clamp(23px,2.3vw,32px)/1.4 var(--display);color:var(--ink)}
[data-opening-thoughts] p+p{margin-top:20px}
[data-system-pieces]{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:center}
[data-system-pieces] article{position:relative;padding:32px 26px;border:1px solid #a9b8ff30;border-radius:28px;background:#141a2e;min-height:220px;display:flex;align-items:center;box-shadow:0 28px 64px -28px #0009}
[data-system-pieces] article:nth-child(1){transform:rotate(-5deg) translateY(12px)}
[data-system-pieces] article:nth-child(2){transform:rotate(-2deg)}
[data-system-pieces] article:nth-child(3){transform:rotate(2deg)}
[data-system-pieces] article:nth-child(4){transform:rotate(5deg) translateY(12px)}
[data-system-pieces] p{font:500 clamp(20px,1.9vw,26px)/1.4 var(--display);color:var(--ink)}
[data-reading-conclusion]{max-width:850px;margin:72px auto 0;text-align:center}
[data-reading-conclusion] p{font:500 clamp(26px,3.2vw,42px)/1.3 var(--display);color:var(--ink)}
[data-compose=about-handoffs]{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(32px,8vw,110px);align-items:center}
[data-handoff-list]{margin:0;padding:0;list-style:none}
[data-handoff-list] li{display:flex;gap:24px;border-top:1px solid #a9b8ff2e;padding:24px 0;align-items:baseline}
[data-handoff-list] li span{font:500 12px var(--mono);color:var(--peri)}
[data-handoff-list] p{font:500 clamp(22px,2.5vw,32px)/1.3 var(--display);color:var(--ink)}
[data-handoff-person]{padding:36px;border:1px solid #a9b8ff33;border-radius:28px;background:var(--deep)}
[data-handoff-person] p{font:500 clamp(28px,3.2vw,42px)/1.25 var(--display);color:var(--ink)}
[data-compose=about-turn]{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:center;border-top:1px solid #a9b8ff33;border-bottom:1px solid #a9b8ff33}
[data-turn-context]{display:grid;gap:24px;max-width:38ch}
[data-turn-statement] p{font:600 clamp(48px,6.7vw,92px)/1.02 var(--display);letter-spacing:-.045em;color:var(--peri)}
[data-compose=about-relations]{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,96px);align-items:center}
[data-relations-thesis] p{font:500 clamp(32px,3.8vw,50px)/1.16 var(--display);color:var(--ink)}
[data-relations-explanation] [data-diagram]{height:140px;margin-bottom:32px}
[data-compose=about-resolution]{text-align:center}
[data-compose=about-resolution] h2{color:var(--peri);margin-bottom:40px}
[data-resolution-copy]{max-width:66ch;margin:auto;display:grid;gap:28px;text-align:left}
[data-resolution-copy] p:first-child{color:var(--ink);font-size:clamp(23px,2.5vw,30px);line-height:1.5}
[data-purpose-pair]{display:grid;grid-template-columns:1fr 1fr;gap:28px}
[data-purpose-pair] article{border-radius:28px;padding:40px;background:#141d32;border:1px solid #a9b8ff33;scroll-margin-top:100px}
[data-purpose-pair] article:last-child{background:#211b32;border-color:#bd8bf244}
[data-purpose-pair] p:not(.eyebrow){font:500 clamp(25px,2.7vw,36px)/1.3 var(--display);color:var(--ink)}
[data-purpose-pair] span{display:block;font:400 18px/1.6 var(--body);color:#b5bfd2;margin-top:24px}
[data-compose=about-belief]{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,80px);align-items:start}
[data-compose=about-belief] h2{font-size:clamp(36px,4.1vw,56px);line-height:1.12}
[data-belief-copy]{display:grid;gap:30px}
[data-belief-example]{border-left:2px solid var(--peri);padding:8px 0 8px 26px}
[data-about-composed] footer{margin-top:50px}

@media(max-width:900px){
 [data-capabilities]{gap:14px}[data-capability]{padding:22px}[data-capability] h3{font-size:24px}
 [data-system-pieces]{grid-template-columns:1fr 1fr;gap:22px}[data-system-pieces] article{min-height:180px;transform:none!important}
 [data-principles]{gap:22px}[data-principles] h3{font-size:26px}
 [data-system-tile]{padding:18px}[data-system-tile] b{font-size:21px}
}
@media(max-width:700px){
 [data-compose]:not([data-compose=reveal]){width:calc(100% - 40px);padding-block:70px}
 [data-compose] p{font-size:18px;line-height:1.65}[data-compose] h2{font-size:38px;line-height:1.1}
 [data-compose-heading]{margin-bottom:32px}
 [data-reveal-stage]{padding:64px 20px}
 [data-reveal-mode=motion] [data-reveal-content]{width:calc(100% - 40px)}
 [data-reveal-cover]{padding:24px!important}[data-reveal-cover] [data-diagram]{display:none}
 [data-reveal-cover] h2,[data-reveal-kind=about] [data-reveal-cover] h2{font-size:29px;line-height:1.1}
 [data-capabilities],[data-audience-pair],[data-purpose-pair],[data-opening-thoughts]{grid-template-columns:1fr;gap:20px}
 [data-capability]{padding:26px}[data-capability] [data-diagram]{height:66px;margin-bottom:22px}
 [data-capability] h3{font-size:28px}[data-capability-intro]{margin-bottom:30px}
 [data-audience-panel]{padding:30px}[data-audience-symbol]{margin-bottom:20px}
 [data-principles]{grid-template-columns:1fr;gap:30px}[data-principles] article{grid-template-columns:28px 1fr;gap:18px}[data-principles] h3{max-width:none}
 [data-principle-number]{padding-top:9px}
 [data-compose=invitation] a{padding:36px 0}[data-compose=invitation] h2{font-size:54px}[data-invitation-arrow]{font-size:64px}
 [data-system-console]{grid-template-columns:1fr;border-radius:24px}[data-console-sidebar]{display:none}
 [data-console-body]{padding:26px 20px}[data-system-tiles]{grid-template-columns:1fr 1fr;gap:10px}
 [data-system-tile]{padding:18px 14px;min-height:124px}[data-system-tile] b{font-size:22px}
 #operating-system[data-compose=system]{padding-block:80px}
 [data-opening-thoughts]{margin-top:30px}[data-opening-thoughts] article{padding:28px}[data-opening-thoughts] p{font:500 24px/1.4 var(--display)}
 [data-system-pieces]{gap:12px}[data-system-pieces] article{border-radius:20px;padding:22px 18px;min-height:190px}[data-system-pieces] p{font:500 21px/1.4 var(--display)}
 [data-reading-conclusion]{margin-top:40px}[data-reading-conclusion] p{font:500 29px/1.3 var(--display)}
 [data-compose=about-handoffs],[data-compose=about-turn],[data-compose=about-relations],[data-compose=about-belief]{grid-template-columns:1fr;gap:36px}
 [data-handoff-list] p{font:500 25px/1.35 var(--display)}[data-handoff-person] p{font:500 32px/1.3 var(--display)}
 [data-turn-statement] p{font:600 55px/1.06 var(--display)}
 [data-relations-thesis] p{font:500 34px/1.2 var(--display)}
 [data-resolution-copy] p:first-child{font-size:25px;line-height:1.5}
 [data-purpose-pair] article{padding:30px}[data-purpose-pair] p:not(.eyebrow){font:500 28px/1.35 var(--display)}
 [data-compose=about-belief] [data-compose-heading]{margin:0}
 [data-about-title]{margin-top:100px}[data-about-chapters]{gap:4px 16px;margin-bottom:20px}[data-about-chapters] a{font-size:14px}
 [data-about-composed] footer .pill{white-space:normal;line-height:1.4}
}
@media(prefers-reduced-motion:reduce){[data-compose] *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ── Elevation ──────────────────────────────────────────────────────────────
   The cards read flat against the star field. Same vocabulary as the system
   console: depth below, a lit top edge, and a lift when you reach for them. */

[data-audience-pair]{perspective:1400px}
[data-audience-panel]{position:relative;isolation:isolate;
  box-shadow:0 30px 90px -44px rgba(63,108,245,.55),0 2px 0 rgba(169,184,255,.08) inset;
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s cubic-bezier(.2,.7,.2,1),
    border-color .45s ease}
/* a light source at the top edge, the way the console is lit */
[data-audience-panel]::before{content:"";position:absolute;inset:0;border-radius:inherit;
  padding:1px;pointer-events:none;z-index:-1;
  background:linear-gradient(160deg,rgba(169,184,255,.55),transparent 42%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;opacity:.75;transition:opacity .45s ease}
[data-audience-panel="1"]::before{background:linear-gradient(160deg,rgba(189,139,242,.55),transparent 42%)}
[data-audience-panel]:hover,[data-audience-panel]:focus-within{
  transform:translateY(-6px);border-color:rgba(169,184,255,.55);
  box-shadow:0 48px 120px -46px rgba(63,108,245,.7),0 2px 0 rgba(169,184,255,.14) inset}
[data-audience-panel="1"]:hover,[data-audience-panel="1"]:focus-within{
  border-color:rgba(189,139,242,.55);
  box-shadow:0 48px 120px -46px rgba(139,92,246,.7),0 2px 0 rgba(189,139,242,.14) inset}
[data-audience-panel]:hover::before,[data-audience-panel]:focus-within::before{opacity:1}
[data-audience-symbol]{transition:transform .45s cubic-bezier(.2,.7,.2,1)}
[data-audience-panel]:hover [data-audience-symbol]{transform:translateY(-3px) scale(1.04)}

/* The three principles become surfaces, each with its own lit core. */
[data-principles] article{position:relative;border-top:0;padding:30px 30px 32px;
  border:1px solid rgba(169,184,255,.22);border-radius:28px;
  background:linear-gradient(150deg,#121a2e,#0b1120);
  box-shadow:0 26px 80px -48px rgba(63,108,245,.5);
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s cubic-bezier(.2,.7,.2,1),
    border-color .45s ease}
[data-principles] article::before{content:"";position:absolute;left:30px;top:0;
  width:7px;height:7px;transform:translateY(-50%);border-radius:50%;background:#fff;
  box-shadow:0 0 10px 2px var(--peri),0 0 26px color-mix(in srgb,var(--peri) 35%,transparent);
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s ease}
[data-principles] article:hover,[data-principles] article:focus-within{
  transform:translateY(-6px);border-color:rgba(169,184,255,.5);
  box-shadow:0 44px 110px -50px rgba(63,108,245,.68)}
[data-principles] article:hover::before{transform:translateY(-50%) scale(1.5);
  box-shadow:0 0 12px 3px var(--gold),0 0 30px color-mix(in srgb,var(--gold) 42%,transparent)}
[data-principle-number]{letter-spacing:.18em}

/* Industry plates sit on the same shelf. */
.tefnmtdyu figure{position:relative;border-radius:22px;overflow:hidden;
  border:1px solid rgba(169,184,255,.2);background:#0b1120;
  box-shadow:0 22px 70px -48px rgba(63,108,245,.5);
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s cubic-bezier(.2,.7,.2,1),
    border-color .45s ease}
.tefnmtdyu figure:hover{transform:translateY(-5px);border-color:rgba(169,184,255,.46);
  box-shadow:0 40px 100px -50px rgba(63,108,245,.66)}

@media (prefers-reduced-motion:reduce){
  [data-audience-panel],[data-principles] article,.tefnmtdyu figure,
  [data-audience-symbol],[data-principles] article::before{transition:none}
  [data-audience-panel]:hover,[data-principles] article:hover,
  .tefnmtdyu figure:hover{transform:none}
}
@media (max-width:760px){
  [data-principles] article{padding:26px 22px 28px;border-radius:22px}
  [data-principles] article::before{left:22px}
}

/* ── About: tighter rhythm, same lift ───────────────────────────────────────
   The home page earns its scroll with a story. About is reading, and it ran
   nearly eight screens on air alone. Halve the gaps, keep the surfaces. */

[data-about-composed] [data-compose]:not([data-compose=reveal]){
  padding:clamp(56px,7vw,112px) 0}
[data-about-composed] [data-compose-heading]{margin-bottom:32px}
[data-about-composed] [data-about-title]{margin-top:84px;margin-bottom:18px}
[data-about-composed] [data-about-chapters]{margin-bottom:26px}
[data-about-composed] #who-we-are{padding-top:24px}
[data-about-composed] [data-compose] h2{font-size:clamp(32px,4vw,56px)}
[data-about-composed] [data-compose] p{font-size:clamp(17px,1.35vw,19px);line-height:1.62}
[data-about-composed] [data-compose] p + p{margin-top:18px}
[data-about-composed] footer{margin-top:28px}

/* Its panels sit on the same shelf as the home cards. */
[data-about-composed] [data-reveal-stage],
[data-about-composed] [data-about-panel],
[data-about-composed] [data-belief],
[data-about-composed] [data-chapter-card]{
  box-shadow:0 30px 90px -46px rgba(63,108,245,.55);
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s cubic-bezier(.2,.7,.2,1),
    border-color .45s ease}
[data-about-composed] [data-about-panel]:hover,
[data-about-composed] [data-belief]:hover,
[data-about-composed] [data-chapter-card]:hover{
  transform:translateY(-5px);
  box-shadow:0 46px 116px -48px rgba(63,108,245,.68)}

@media (prefers-reduced-motion:reduce){
  [data-about-composed] [data-about-panel]:hover,
  [data-about-composed] [data-belief]:hover,
  [data-about-composed] [data-chapter-card]:hover{transform:none}
}
@media (max-width:760px){
  [data-about-composed] [data-compose]:not([data-compose=reveal]){padding:38px 0}
  [data-about-composed] [data-about-title]{margin-top:92px}
}

/* The opening chapter was a screen and three quarters on its own. */
[data-about-composed] [data-reveal-stage]{padding:52px 28px}
[data-about-composed] [data-reveal-content] [data-compose-heading]{margin-bottom:22px}
@media (max-width:760px){[data-about-composed] [data-reveal-stage]{padding:40px 20px}}

/* ── Everything round breathes like the sky ────────────────────────────────
   The star cores and the panel shapes were lit but static against a field
   that moves. Give them the same slow pulse, each on its own clock. */

@keyframes spectre-breathe{
  0%,100%{opacity:.78;filter:brightness(1)}
  50%{opacity:1;filter:brightness(1.35)}
}
@keyframes spectre-core-breathe{
  0%,100%{box-shadow:0 0 8px 1.5px var(--peri),0 0 20px color-mix(in srgb,var(--peri) 28%,transparent)}
  50%{box-shadow:0 0 13px 3px var(--peri),0 0 32px color-mix(in srgb,var(--peri) 45%,transparent)}
}

[data-principles] article::before{animation:spectre-core-breathe 4.2s ease-in-out infinite}
[data-principles] article:nth-child(2)::before{animation-duration:5.1s;animation-delay:-1.3s}
[data-principles] article:nth-child(3)::before{animation-duration:3.7s;animation-delay:-2.4s}
/* hover still wins: the core swells and goes gold */
[data-principles] article:hover::before{animation:none}

[data-audience-symbol] i{animation:spectre-breathe 4.6s ease-in-out infinite}
[data-audience-symbol] i:nth-child(2){animation-duration:5.4s;animation-delay:-1.6s}
[data-audience-symbol] i:nth-child(3){animation-duration:3.9s;animation-delay:-2.8s}

[data-diagram] i{animation:spectre-breathe 5s ease-in-out infinite}
[data-diagram] i:nth-child(2){animation-duration:4.1s;animation-delay:-1.1s}
[data-diagram] i:nth-child(3){animation-duration:5.8s;animation-delay:-2.2s}

/* the same on the about page's own shapes */
[data-about-composed] [data-reveal-content] svg rect,
[data-about-composed] [data-about-panel] i,
[data-about-composed] [data-belief] i{animation:spectre-breathe 4.8s ease-in-out infinite}

@media (prefers-reduced-motion:reduce){
  [data-principles] article::before,[data-audience-symbol] i,[data-diagram] i,
  [data-about-composed] [data-reveal-content] svg rect,
  [data-about-composed] [data-about-panel] i,
  [data-about-composed] [data-belief] i{animation:none}
}

/* On a phone the opening card was centred at 55% of the screen, which left a
   void under the chapter nav and hung the card off the bottom edge. Sit it up. */
@media (max-width:760px){
  [data-reveal-cover]{top:42%}
}


/* The way into the station a star is a picture of. */
.command-enter{
  display:inline-block;margin-right:14px;padding:9px 15px;border-radius:10px;
  font:600 14px/1 Inter,system-ui,sans-serif;text-decoration:none;
  color:#0D1120;background:var(--command-color,#A9B8FF);
  box-shadow:0 0 22px color-mix(in srgb,var(--command-color,#A9B8FF) 35%,transparent);
}
.command-enter:hover{filter:brightness(1.08)}
.command-enter[aria-disabled="true"]{
  background:none;color:#8B95AB;box-shadow:none;cursor:default;
  border:1px solid #273048;
}

/* The sky is behind the scene; it must not change the reveal's positioning. */
[data-about-composed] #sky{z-index:0}
[data-about-composed] main{position:relative;z-index:1}
[data-about-composed] [data-reveal-mode=motion] [data-reveal-stage]{padding:0}
@media(max-width:760px){[data-reveal-mode=motion] [data-reveal-cover]{top:42%}}
