.slides {
  height: auto;
  overflow: visible;
  scroll-snap-type: none;
  scroll-behavior: auto;
  scrollbar-width: none;
  transform: translate3d(0, 0, 0);
  transition: transform 380ms cubic-bezier(.18, .82, .16, 1);
  will-change: transform;
}
.slides::-webkit-scrollbar { width: 0; height: 0; }
.slide { contain: layout paint; scroll-snap-align: none; scroll-snap-stop: normal; }
.interactive-home { isolation: isolate; background: linear-gradient(180deg, #8bc9ef 0%, #c9e8f7 62%, #edf6f7 100%); color: #111816; }
.sky-photo { position: absolute; z-index: -5; inset: -7% -8%; background: url("hero-v3/sky.png") center / cover no-repeat; filter: saturate(.96) contrast(.95) brightness(1.02); animation: sky-drift 20s ease-in-out infinite alternate; will-change: transform; }
.interactive-home::before { content: ""; position: absolute; z-index: -4; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(245, 251, 253, .12), transparent 26%, transparent 74%, rgba(240, 248, 251, .15)), linear-gradient(180deg, rgba(255,255,255,.07), rgba(229, 243, 248, .08)); }
.cloud-bank { position: absolute; z-index: -3; pointer-events: none; border-radius: 999px; filter: blur(18px); background: radial-gradient(ellipse at 18% 62%, rgba(255,255,255,.98) 0 17%, transparent 46%), radial-gradient(ellipse at 42% 38%, rgba(255,255,255,.95) 0 18%, transparent 48%), radial-gradient(ellipse at 66% 58%, rgba(255,255,255,.92) 0 19%, transparent 50%), radial-gradient(ellipse at 86% 50%, rgba(255,255,255,.88) 0 15%, transparent 45%); will-change: transform; }
.cloud-bank-a { left: -24vw; top: 16vh; width: 44vw; height: 18vw; min-width: 460px; min-height: 200px; opacity: .36; animation: cloud-cross-a 18s linear infinite; }
.cloud-bank-b { right: -26vw; top: 32vh; width: 40vw; height: 16vw; min-width: 420px; min-height: 180px; opacity: .28; transform: scale(.82); animation: cloud-cross-b 24s linear infinite; }
.cloud-bank-c { left: -18vw; bottom: 12vh; width: 36vw; height: 14vw; min-width: 340px; min-height: 150px; opacity: .18; transform: scale(.78); animation: cloud-cross-c 28s linear infinite; }
.home-topbar { position: absolute; z-index: 10; top: 0; left: 2.75vw; right: 2.75vw; height: clamp(72px, 9.6vh, 102px); border-bottom: 1px solid rgba(20, 25, 22, .28); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.home-signature,.home-index { color: inherit; text-decoration: none; }
.home-signature { justify-self: start; display: inline-flex; align-items: center; gap: 13px; font: 700 clamp(22px, 2.1vw, 32px)/1 Georgia, serif; }
.home-signature i { width: 13px; height: 13px; border-radius: 50%; background: #ff5c35; box-shadow: 0 0 0 0 rgba(255, 92, 53, .35); animation: signature-pulse 3.8s ease-out infinite; }
.home-notebook { color: rgba(20, 25, 22, .68); text-transform: uppercase; letter-spacing: .28em; font-size: clamp(8px, .75vw, 12px); font-weight: 700; }
.home-index { justify-self: end; min-width: 118px; height: 52px; padding: 0 20px; border: 1px solid rgba(20, 25, 22, .35); border-radius: 999px; display: inline-flex; align-items: center; justify-content: space-between; gap: 22px; background: rgba(240, 248, 249, .22); backdrop-filter: blur(12px); text-transform: uppercase; letter-spacing: .16em; font-size: 10px; font-weight: 850; transition: background .25s ease, transform .25s ease; }
.home-index:hover { background: rgba(199, 243, 107, .72); transform: translateY(-2px); }
.home-index i,.home-index i::after { display: block; width: 19px; height: 1px; background: currentColor; }
.home-index i { position: relative; }
.home-index i::after { content: ""; position: absolute; top: 6px; left: 0; }
.home-library { position: absolute; z-index: 11; top: clamp(84px, 11vh, 116px); left: 2.75vw; right: 15.5vw; height: clamp(56px, 7.7vh, 78px); display: grid; grid-template-columns: minmax(190px, 250px) minmax(430px, 700px); justify-content: space-between; gap: 5vw; }
.must-read-link { min-width: 0; padding: 10px 16px; border: 1px solid rgba(20, 25, 22, .30); border-radius: 10px; background: rgba(238, 248, 250, .23); backdrop-filter: blur(8px); color: inherit; display: grid; grid-template-columns: 4px 1fr auto; grid-template-rows: auto auto; column-gap: 14px; align-items: center; text-decoration: none; transition: transform .25s ease, background .25s ease, box-shadow .25s ease; }
.must-read-link::before { content: ""; grid-row: 1 / 3; width: 2px; height: 100%; background: #ff5c35; }
.must-read-link small { align-self: end; text-transform: uppercase; letter-spacing: .18em; font-size: 7px; }
.must-read-link strong { align-self: start; text-transform: uppercase; letter-spacing: .09em; font-size: clamp(13px, 1.3vw, 19px); }
.must-read-link span { grid-column: 3; grid-row: 1 / 3; font: 400 25px/1 Georgia, serif; }
.must-read-link:hover { transform: translateY(-3px); background: rgba(255, 248, 235, .74); box-shadow: 0 12px 35px rgba(39, 70, 82, .13); }
.study-links { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(20, 25, 22, .42); border-radius: 999px; overflow: hidden; background: rgba(232, 246, 250, .22); backdrop-filter: blur(12px); }
.study-links a { position: relative; color: inherit; display: grid; place-items: center; border-right: 1px solid rgba(20, 25, 22, .28); text-decoration: none; text-transform: uppercase; letter-spacing: .16em; font-size: clamp(8px, .8vw, 11px); font-weight: 850; transition: background .25s ease, color .25s ease; }
.study-links a:last-child { border-right: 0; }
.study-links a:hover,.study-links a:focus-visible { box-shadow: inset 0 0 0 1px rgba(255, 92, 53, .82); border-radius: 999px; background: rgba(244, 248, 244, .52); outline: none; }
.home-stage { position: absolute; z-index: 2; inset: clamp(158px, 21vh, 212px) 4.2vw 4vh; display: grid; }
.home-stage-centered { place-items: center; }
.hero-copy { min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.hero-copy-centered { width: min(1120px, 88vw); margin: 0 auto; }
.hero-kicker { width: max-content; max-width: 100%; margin: 0 0 clamp(18px, 2.4vh, 28px); border-top: 1px solid #ff5c35; color: #ff5c35; text-transform: uppercase; letter-spacing: .16em; font-size: clamp(8px, .82vw, 12px); line-height: 1.5; font-weight: 850; }
.hero-frame { position: relative; min-height: min(62vh, 680px); padding: clamp(28px, 5vh, 62px) clamp(38px, 4.2vw, 72px) clamp(44px, 6vh, 80px); }
.hero-frame::before { content: ""; position: absolute; left: 0; right: 8%; top: 0; height: 1px; background: rgba(17, 24, 22, .45); }
.hero-frame::after { content: ""; position: absolute; right: 0; top: 0; bottom: 2%; width: 1px; background: rgba(17, 24, 22, .45); }
.hero-bird { position: absolute; left: clamp(8px, .8vw, 18px); top: clamp(-64px, -5.6vh, -48px); width: clamp(72px, 7vw, 96px); color: #111816; z-index: 2; }
.hero-bird svg, .hero-bird img { display: block; width: 100%; height: auto; }
.hero-bird img { background: transparent; }
.hero-copy h1 { max-width: 860px; margin: 0; white-space: nowrap; font: 500 clamp(58px, 7vw, 118px)/.86 Georgia, serif; letter-spacing: -.065em; }
.define-life { width: max-content; margin: 14px 0 0 clamp(220px, 28vw, 430px); color: #111816; transform: rotate(-8deg); font: italic 400 clamp(24px, 2.7vw, 44px)/1 Georgia, serif; }
.define-life span { font-size: .58em; letter-spacing: .02em; }
.define-life::after { content: ""; display: block; width: 110%; height: 12px; margin-top: -4px; border-top: 2px solid currentColor; border-radius: 50%; }
.hero-copy blockquote { max-width: 760px; margin: clamp(26px, 3.6vh, 42px) 0 0 0; padding: 0 0 0 22px; border-left: 2px solid #111816; font: 400 clamp(15px, 1.55vw, 24px)/1.48 Georgia, serif; }
.hero-copy blockquote strong { font-weight: 700; }
.hero-cube-wrap { display:none !important; }
.hero-cube3d { --cube-size: clamp(76px, 8vw, 112px); position: absolute; left: 50%; top: 50%; width: var(--cube-size); height: var(--cube-size); transform-style: preserve-3d; transform: translate(-50%, -50%) rotateX(54deg) rotateY(44deg) rotateZ(45deg); animation: cube-sway 7s ease-in-out infinite; }
.hero-cube3d .face { position: absolute; inset: 0; border: 2px solid rgba(17, 24, 22, .84); background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.24); }
.hero-cube3d .front { transform: translateZ(calc(var(--cube-size) / 2)); }
.hero-cube3d .back { transform: rotateY(180deg) translateZ(calc(var(--cube-size) / 2)); }
.hero-cube3d .right { transform: rotateY(90deg) translateZ(calc(var(--cube-size) / 2)); }
.hero-cube3d .left { transform: rotateY(-90deg) translateZ(calc(var(--cube-size) / 2)); }
.hero-cube3d .top { transform: rotateX(90deg) translateZ(calc(var(--cube-size) / 2)); }
.hero-cube3d .bottom { transform: rotateX(-90deg) translateZ(calc(var(--cube-size) / 2)); }
.hero-cube-shadow { position: absolute; left: 50%; bottom: 8%; width: 54%; height: 18%; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(20, 33, 39, .28) 0%, rgba(20, 33, 39, .12) 45%, transparent 72%); transform: translateX(-50%) rotate(-12deg); filter: blur(10px); animation: shadow-breathe 7s ease-in-out infinite; }
.interactive-home .scroll-cue { border: 0; background: transparent; cursor: pointer; }
@keyframes sky-drift { from { transform: translate3d(-2.2%, -.9%, 0) scale(1.03); } to { transform: translate3d(3.2%, 1.3%, 0) scale(1.08); } }
@keyframes cloud-cross-a { from { transform: translate3d(-10vw, 0, 0) scale(.96); } to { transform: translate3d(124vw, -2.5vh, 0) scale(1.05); } }
@keyframes cloud-cross-b { from { transform: translate3d(12vw, 0, 0) scale(.78); } to { transform: translate3d(-132vw, 5vh, 0) scale(.92); } }
@keyframes cloud-cross-c { from { transform: translate3d(-2vw, 0, 0) scale(.72); } to { transform: translate3d(136vw, -1.5vh, 0) scale(.84); } }
@keyframes signature-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 92, 53, .4); } 70%, 100% { box-shadow: 0 0 0 10px rgba(255, 92, 53, 0); } }
@keyframes cube-sway { 0%, 100% { transform: translate(-50%, -50%) rotateX(54deg) rotateY(44deg) rotateZ(45deg); } 50% { transform: translate(-50%, -54%) rotateX(50deg) rotateY(52deg) rotateZ(45deg); } }
@keyframes shadow-breathe { 0%, 100% { transform: translateX(-50%) rotate(-12deg) scale(1); opacity: .95; } 50% { transform: translateX(-50%) rotate(-12deg) scale(.9); opacity: .72; } }
@media (max-width: 1100px) { .home-library { right: 6vw; grid-template-columns: minmax(170px, 220px) minmax(380px, 620px); } .hero-copy-centered { width: min(1040px, 90vw); } .hero-copy h1 { font-size: clamp(54px, 7vw, 92px); } .define-life { margin-left: clamp(170px, 26vw, 320px); } }
@media (max-width: 820px) { .home-topbar { left: 22px; right: 22px; grid-template-columns: 1fr auto; } .home-notebook { display: none; } .home-library { left: 22px; right: 22px; grid-template-columns: 150px 1fr; gap: 12px; } .home-stage { inset: 166px 22px 24px; } .hero-copy-centered { width: 100%; } .hero-frame { min-height: 58vh; padding: 24px 22px 72px; } .hero-bird { width: 76px; top: -54px; left: 10px; } .hero-copy h1 { white-space: nowrap; max-width: none; font-size: clamp(44px, 9.8vw, 76px); } .define-life { margin-left: clamp(110px, 24vw, 210px); } .hero-copy blockquote { max-width: 80%; } .hero-cube-wrap { width: 150px; height: 150px; } }
@media (max-width: 560px) { .home-topbar { height: 66px; } .home-signature { font-size: 21px; } .home-index { min-width: 92px; height: 43px; padding: 0 14px; } .home-library { top: 77px; height: auto; grid-template-columns: 1fr; } .must-read-link { display: none; } .study-links { height: 46px; } .home-stage { inset: 135px 18px 18px; } .hero-frame { min-height: 56vh; padding: 20px 14px 82px; } .hero-frame::before { right: 0; } .hero-bird { left: 8px; top: -44px; width: 64px; } .hero-copy h1 { max-width: none; white-space: nowrap; font-size: clamp(34px, 10.6vw, 54px); line-height: .9; letter-spacing: -.055em; } .define-life { margin: 10px 0 0 22%; font-size: 24px; } .hero-copy blockquote { max-width: 94%; margin: clamp(24px, 4vh, 34px) 0 0; padding-left: 16px; font-size: 12px; line-height: 1.46; } .hero-cube-wrap { right: 10px; bottom: 8px; width: 108px; height: 108px; } }
@media (prefers-reduced-motion: reduce) { .sky-photo,.cloud-bank,.home-signature i,.hero-cube3d,.hero-cube-shadow { animation: none !important; } }

/* Latest homepage object treatment: same large scale, solid grey material. */
.hero-copy-centered { position: relative; z-index: 4; }
.hero-bird {
  left: clamp(42px, 4.5vw, 78px);
  top: clamp(-70px, -6.2vh, -52px);
  width: clamp(70px, 6.5vw, 92px);
}
.hero-motion.solid-object {
  position: absolute;
  z-index: 2;
  right: -1.2vw;
  bottom: -3vh;
  width: min(48vw, 720px);
  height: min(68vh, 680px);
  pointer-events: auto;
}
.hero-motion.solid-object::after {
  content: "";
  position: absolute;
  left: 20%;
  right: 5%;
  bottom: 3%;
  height: 11%;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(35,42,45,.28), rgba(35,42,45,.10) 48%, transparent 74%);
  filter: blur(12px);
  pointer-events: none;
}
.solid-cuboid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: grab;
  touch-action: none;
  filter: drop-shadow(0 22px 26px rgba(38,45,48,.18));
}
.solid-cuboid:active { cursor: grabbing; }

@media (max-width: 820px) {
  .hero-bird { left: 24px; top: -58px; width: 72px; }
  .hero-motion.solid-object { right: -9vw; bottom: -2vh; width: 60vw; height: 56vh; opacity: .94; }
}
@media (max-width: 560px) {
  .hero-bird { left: 18px; top: -48px; width: 58px; }
  .hero-motion.solid-object { right: -24vw; bottom: -6vh; width: 78vw; height: 43vh; opacity: .82; }
}

.solid-cuboid-fallback {
  --sx: 164px;
  --sy: 206px;
  --sz: 130px;
  position: absolute;
  left: 53%;
  top: 51%;
  width: var(--sx);
  height: var(--sy);
  transform-style: preserve-3d;
  transform: translate(-50%,-50%) rotateX(54deg) rotateY(36deg) rotateZ(-38deg);
  filter: drop-shadow(0 28px 30px rgba(35,42,45,.22));
}
.solid-cuboid-fallback .sf {
  position: absolute;
  display: block;
  background: #7e8386;
  border: 1px solid rgba(36,42,44,.55);
  backface-visibility: visible;
}
.solid-cuboid-fallback .front,
.solid-cuboid-fallback .back { width: var(--sx); height: var(--sy); left: 0; top: 0; }
.solid-cuboid-fallback .front { transform: translateZ(calc(var(--sz)/2)); background:#858a8d; }
.solid-cuboid-fallback .back { transform: rotateY(180deg) translateZ(calc(var(--sz)/2)); background:#6e7376; }
.solid-cuboid-fallback .right,
.solid-cuboid-fallback .left { width: var(--sz); height: var(--sy); top:0; left:calc((var(--sx) - var(--sz))/2); }
.solid-cuboid-fallback .right { transform: rotateY(90deg) translateZ(calc(var(--sx)/2)); background:#777c7f; }
.solid-cuboid-fallback .left { transform: rotateY(-90deg) translateZ(calc(var(--sx)/2)); background:#696e71; }
.solid-cuboid-fallback .top,
.solid-cuboid-fallback .bottom { width: var(--sx); height: var(--sz); left:0; top:calc((var(--sy) - var(--sz))/2); }
.solid-cuboid-fallback .top { transform: rotateX(90deg) translateZ(calc(var(--sy)/2)); background:#999da0; }
.solid-cuboid-fallback .bottom { transform: rotateX(-90deg) translateZ(calc(var(--sy)/2)); background:#64696c; }
.solid-object.webgl-ok .solid-cuboid-fallback { display:none; }
@media (max-width: 820px) {
  .solid-cuboid-fallback { --sx:132px; --sy:166px; --sz:105px; }
}
@media (max-width: 560px) {
  .solid-cuboid-fallback { --sx:100px; --sy:126px; --sz:80px; }
}
.hero-motion.solid-object { perspective: 1100px; }
.solid-cuboid-fallback { --sx: 280px; --sy: 350px; --sz: 220px; left: 52%; top: 50%; }
@media (max-width: 820px) { .solid-cuboid-fallback { --sx:220px; --sy:275px; --sz:175px; } }
@media (max-width: 560px) { .solid-cuboid-fallback { --sx:150px; --sy:188px; --sz:120px; } }

/* SVG fallback mirrors the solid grey WebGL object for non-WebGL previews. */
.hero-bird { top: clamp(-88px, -7.8vh, -68px); }
.solid-cuboid-fallback {
  position:absolute;
  left:50%;
  top:50%;
  width:min(38vw,560px);
  height:auto;
  transform:translate(-50%,-50%) rotate(-4deg);
  overflow:visible;
  filter:drop-shadow(0 20px 26px rgba(35,42,45,.14));
}
.solid-cuboid-fallback .solid-face { stroke:#565b5e; stroke-width:1.4; }
.solid-cuboid-fallback .solid-top { fill:#9a9ea0; }
.solid-cuboid-fallback .solid-left { fill:#73787b; }
.solid-cuboid-fallback .solid-right { fill:#858a8d; }
.solid-cuboid-fallback .solid-shadow { fill:rgba(42,48,50,.20); filter:blur(7px); }
@media (max-width:820px){ .solid-cuboid-fallback{width:min(46vw,420px)} }
@media (max-width:560px){ .solid-cuboid-fallback{width:min(60vw,310px)} }


/* Final hero correction: no cube; bird sits above the A without touching the red kicker. */
.hero-motion.solid-object, .solid-cuboid, .solid-cuboid-fallback { display:none !important; }
.hero-frame { padding-top: clamp(92px, 9.2vh, 118px); }
.hero-bird {
  left: clamp(40px, 4.3vw, 72px) !important;
  top: clamp(16px, 2.0vh, 24px) !important;
  width: clamp(68px, 6.2vw, 90px) !important;
  z-index: 3;
}
@media (max-width:820px){
  .hero-frame { padding-top: 82px; }
  .hero-bird { left:24px !important; top:14px !important; width:70px !important; }
}
@media (max-width:560px){
  .hero-frame { padding-top: 68px; }
  .hero-bird { left:14px !important; top:10px !important; width:58px !important; }
}

/* Final centered hero composition — no overlap. */
.hero-copy-centered {
  width: min(1180px, 90vw) !important;
  margin: 0 auto !important;
}
.hero-kicker {
  margin: 0 auto clamp(18px, 2.4vh, 28px) !important;
  text-align: center;
}
.hero-frame {
  min-height: min(60vh, 650px) !important;
  padding: clamp(30px, 4.5vh, 54px) clamp(28px, 4vw, 64px) clamp(42px, 5vh, 68px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
.hero-frame::before {
  left: 8% !important;
  right: 8% !important;
}
.hero-frame::after {
  display: none !important;
}
.hero-bird {
  position: static !important;
  left: auto !important;
  top: auto !important;
  width: clamp(68px, 6vw, 88px) !important;
  margin: 0 0 clamp(18px, 2.4vh, 28px) !important;
  flex: 0 0 auto;
}
.hero-copy h1 {
  margin: 0 auto !important;
  text-align: center !important;
}
.define-life {
  margin: 14px auto 0 !important;
  transform: rotate(-5deg) !important;
}
.hero-copy blockquote {
  max-width: 800px !important;
  margin: clamp(28px, 3.6vh, 42px) auto 0 !important;
  padding: 0 !important;
  border-left: 0 !important;
  text-align: center !important;
}
@media (max-width:820px){
  .hero-frame { padding: 28px 20px 54px !important; }
  .hero-bird { width: 68px !important; margin-bottom: 18px !important; }
  .hero-copy blockquote { max-width: 88% !important; }
}
@media (max-width:560px){
  .hero-frame { padding: 22px 12px 46px !important; }
  .hero-bird { width: 58px !important; margin-bottom: 14px !important; }
  .hero-copy blockquote { max-width: 96% !important; }
}
