.philosophy{--phil-accent:#111;--phil-secondary:#777;--phil-contrast:#fff;position:relative;height:300svh;border-top:1px solid var(--line);background:var(--bg);color:var(--ink)}
.dark .philosophy{--phil-accent:#d6ff71;--phil-secondary:#b8a1ff;--phil-contrast:#101510;background:#0b0f0c}.funky .philosophy{--phil-accent:#f44889;--phil-secondary:#8361da;--phil-contrast:#21154e;background:#fff4e9}
.philosophy-pin{position:sticky;top:0;height:100svh;min-height:650px;overflow:hidden;display:flex;flex-direction:column;padding:42px 0 28px}
.philosophy-heading{display:flex;justify-content:space-between;gap:24px;margin:0 5%;align-items:center;z-index:2}.philosophy-heading h2{font-size:10px!important;font-weight:700;letter-spacing:2px!important;line-height:1.5!important;margin:0!important}.philosophy-heading>span{font:9px/1.5 monospace;letter-spacing:1px;color:var(--muted)}
.philosophy-window{overflow:hidden;flex:1;min-height:0;width:100%}.philosophy-track{display:flex;height:100%;width:300%;will-change:transform;transform:translate3d(var(--philosophy-x,0px),0,0)}
.principle{flex:0 0 33.333333%;width:33.333333%;min-width:0;display:grid;grid-template-columns:1.08fr 1fr;gap:4%;align-items:center;padding:35px 1.666667%;position:relative;isolation:isolate}
.principle-copy{position:relative;z-index:2;max-width:660px}.principle-tag{display:inline-block;font:9px/1.5 monospace;letter-spacing:1.5px;color:var(--phil-accent);border:1px solid var(--line);border-radius:4px;padding:8px 11px;margin-bottom:32px}
.principle h3{font-size:clamp(56px,6.8vw,105px);line-height:.99;letter-spacing:-.075em;margin:0 0 30px;font-weight:800;white-space:normal}.principle h3 em{font-style:normal;color:var(--phil-accent)}.white .principle h3 em{font-family:Georgia,serif;font-weight:400;font-style:italic}.funky .principle h3 em{font-style:italic}
.principle-copy>p{font-size:clamp(16px,1.7vw,22px);line-height:1.55;color:var(--muted);max-width:480px;margin:0}
.principle-art{position:relative;width:100%;aspect-ratio:1;max-height:520px;pointer-events:none;transform:translateY(calc(var(--panel-offset,0)*20px));color:var(--phil-accent)}
.art-caption{position:absolute;bottom:0;width:100%;text-align:center;font:8px/1.5 monospace;letter-spacing:1.4px;color:var(--muted)}
.why-orbit{position:absolute;border:1px solid var(--phil-accent);border-radius:50%;inset:14%;opacity:.45}.orbit-one{transform:rotate(calc(var(--panel-progress,0)*130deg)) scaleX(.55)}.orbit-two{transform:rotate(calc(65deg + var(--panel-progress,0)*-100deg)) scaleX(.55)}.orbit-three{transform:rotate(calc(-65deg + var(--panel-progress,0)*90deg)) scaleX(.55)}.why-core{position:absolute;inset:33%;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 28% 22%,#f4ffe2,var(--phil-accent) 46%,#548b3c);box-shadow:inset -10px -18px 30px #0004,0 0 65px #b7ff5510;color:var(--phil-contrast);font-size:clamp(64px,8vw,130px);font-weight:400;letter-spacing:-.08em;transform:rotate(calc(-14deg + var(--panel-progress,0)*28deg))}.orbit-point{position:absolute;width:8%;height:8%;border-radius:50%;background:var(--phil-secondary)}.point-one{top:11%;left:25%;transform:translate(calc(var(--panel-progress,0)*140px),calc(var(--panel-progress,0)*20px))}.point-two{bottom:16%;right:14%;width:4%;height:4%;background:var(--phil-accent);transform:translate(calc(var(--panel-progress,0)*-80px),calc(var(--panel-progress,0)*-40px))}
.clarity-grid{position:absolute;inset:18% 14% 14%;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;transform:rotate(calc(10deg - var(--panel-progress,0)*16deg))}
.clarity-cell{display:grid;place-items:center;border:1px solid var(--phil-accent);border-radius:14px;background:var(--phil-accent);color:var(--phil-contrast);font-size:clamp(17px,2.6vw,38px);font-weight:700;transform:translate(calc(var(--dx)*(1 - var(--panel-progress,0))),calc(var(--dy)*(1 - var(--panel-progress,0)))) rotate(calc(var(--rot)*(1 - var(--panel-progress,0))))}.clarity-cell:nth-child(3n){background:transparent;color:var(--phil-accent)}.clarity-cell:nth-child(5){background:var(--phil-secondary);border-color:var(--phil-secondary)}
.human-rings{position:absolute;inset:9%;width:82%;height:82%;color:var(--phil-secondary);transform:rotate(calc(-24deg + var(--panel-progress,0)*75deg)) scale(calc(.8 + var(--panel-progress,0)*.2))}.human-spark{position:absolute;inset:32%;display:grid;place-items:center;font-size:clamp(90px,15vw,210px);line-height:1;color:var(--phil-accent);transform:rotate(calc(var(--panel-progress,0)*-95deg))}
.philosophy-footer{display:flex;align-items:center;justify-content:space-between;gap:30px;margin:0 5%;padding-top:18px;border-top:1px solid var(--line);font:9px/1.5 monospace;letter-spacing:1px;color:var(--muted)}.philosophy-navigation{display:flex;gap:16px}.philosophy-navigation button{background:transparent;border:0;color:var(--muted);font:10px monospace;display:flex;gap:9px;align-items:center;padding:8px;cursor:pointer}.philosophy-navigation i{display:block;width:40px;height:2px;background:var(--line);position:relative}.philosophy-navigation i::after{content:'';position:absolute;inset:0;background:var(--phil-accent);transform:scaleX(0);transform-origin:left;transition:transform .3s}.philosophy-navigation button[aria-current="step"]{color:var(--phil-accent)}.philosophy-navigation button[aria-current="step"] i::after{transform:scaleX(1)}.philosophy-navigation button:focus-visible{outline:1px solid var(--phil-accent);outline-offset:4px}
@media(max-width:850px){.philosophy-pin{padding-top:32px;min-height:690px}.philosophy-heading>span{display:none}.principle{grid-template-columns:1fr;gap:5px;align-content:start;padding-top:35px;padding-bottom:10px}.principle h3{font-size:clamp(48px,8vw,68px);margin-bottom:20px}.principle-tag{margin-bottom:20px;font-size:8px}.principle-copy>p{font-size:15px;max-width:520px}.principle-art{width:min(66vw,340px);margin:5px auto 0;max-height:290px}.philosophy-instruction{font-size:7px;max-width:100px}.philosophy-navigation{gap:3px}.philosophy-navigation i{width:22px}.philosophy-footer{gap:10px}.art-caption{font-size:7px}.why-core{font-size:65px}.human-spark{font-size:120px}.clarity-cell{font-size:22px}}
@media(max-height:750px) and (min-width:851px){.philosophy-pin{min-height:600px;padding-top:28px;padding-bottom:22px}.principle h3{font-size:70px}.principle-art{max-height:400px}.principle-tag{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.philosophy{height:auto!important}.philosophy-pin{height:auto;min-height:0;position:relative;padding-top:40px}.philosophy-window{overflow:visible}.philosophy-track{display:block;width:100%;transform:none!important}.principle{width:100%;padding:60px 5%;border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr}.principle-art{--panel-progress:.8!important;transform:none}.philosophy-footer,.philosophy-heading>span{display:none}.principle h3{font-size:clamp(42px,6vw,80px)}.clarity-cell,.why-core,.human-rings,.human-spark,.why-orbit,.orbit-point{transform:none!important}}
@media(prefers-reduced-motion:reduce) and (max-width:850px){.principle{grid-template-columns:1fr}.principle-art{margin-top:20px}}
