/* Home-specific readiness layer. Uses Fable's existing public-site tokens. */
.home-product{padding:52px 0 24px}
.home-product .product-frame{max-width:1040px;margin:0 auto;border:1px solid var(--hair);border-radius:28px;background:var(--card);box-shadow:var(--float-lg);overflow:hidden}
.home-product .product-intro{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(28px,5vw,76px);align-items:end;padding:clamp(30px,5vw,64px)}
.home-product h2{font-size:clamp(32px,4.2vw,56px);max-width:14ch;text-wrap:balance}
.home-product .product-intro p{max-width:58ch;color:var(--ink-soft);font-size:16px;text-wrap:pretty}
.connected-work{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,.72fr);border-top:1px solid var(--hair);min-height:410px}
.connected-note{padding:clamp(28px,4vw,52px);background:var(--card2)}
.connected-note .note-path{font-family:var(--disp);font-size:10px;letter-spacing:.16em;color:var(--ink-faint);font-weight:700}
.connected-note h3{font-size:clamp(22px,2.5vw,31px);margin-top:18px;max-width:18ch;text-wrap:balance}
.connected-note p{max-width:48ch;margin-top:16px;color:var(--ink-soft)}
.connected-note mark{background:color-mix(in srgb,var(--brand-bright) 24%,transparent);color:inherit;border-radius:4px;padding-inline:3px}
.source-thread{display:flex;align-items:center;gap:12px;margin-top:34px;color:var(--ink-soft);font-size:12.5px}
.source-thread::before{content:"";width:44px;height:1px;background:var(--brand-bright)}
.card-bay{display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,4vw,44px);background:var(--bg)}
.card-state{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px;font-family:var(--disp);font-size:10px;letter-spacing:.12em;color:var(--ink-faint);font-weight:700}
.connected-card{position:relative;width:100%;min-height:250px;border:0;background:transparent;padding:0;cursor:pointer;perspective:1200px;text-align:left;color:inherit}
.card-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .65s var(--ease)}
.connected-card.is-flipped .card-inner{transform:rotateY(180deg)}
.card-face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:28px;border:1px solid var(--hair2);border-radius:22px;background:var(--card);box-shadow:var(--float);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.card-face.back{transform:rotateY(180deg);background:var(--ink);color:var(--bg)}
.card-face .face-name{font-family:var(--disp);font-size:10px;letter-spacing:.16em;font-weight:750;color:var(--ink-faint)}
.card-face.back .face-name{color:color-mix(in srgb,var(--bg) 58%,transparent)}
.card-face strong{font-family:var(--disp);font-size:clamp(18px,2vw,23px);line-height:1.35;text-wrap:pretty}
.card-face small{font-size:11.5px;color:var(--ink-soft)}
.card-face.back small{color:color-mix(in srgb,var(--bg) 72%,transparent)}
.card-source{margin-top:14px;padding-top:14px;border-top:1px solid var(--hair);font-size:11.5px;color:var(--ink-soft)}

.home-system{padding:clamp(74px,9vw,124px) 0}
.home-system .system-layout{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:clamp(44px,8vw,112px);align-items:start}
.home-system h2{font-size:clamp(34px,4.8vw,62px);max-width:10ch;text-wrap:balance}
.home-system .system-copy>p{font-size:17px;max-width:61ch;color:var(--ink-soft)}
.system-line{display:grid;grid-template-columns:repeat(3,1fr);margin-top:42px;border-top:1px solid var(--hair2);border-bottom:1px solid var(--hair2)}
.system-line div{padding:24px 20px 24px 0;border-right:1px solid var(--hair)}
.system-line div+div{padding-left:20px}
.system-line div:last-child{border-right:0}
.system-line b{display:block;font-family:var(--disp);font-size:15px}
.system-line span{display:block;margin-top:7px;color:var(--ink-soft);font-size:12.5px}

.field-gateway{padding:clamp(70px,9vw,116px) 0;background:var(--card2);border-block:1px solid var(--hair)}
.field-gateway .gateway-head{display:flex;justify-content:space-between;gap:36px;align-items:end}
.field-gateway h2{font-size:clamp(34px,5vw,64px);max-width:13ch;text-wrap:balance}
.field-gateway .gateway-head p{max-width:48ch;color:var(--ink-soft)}
.field-ribbon{display:flex;flex-wrap:wrap;gap:10px;margin-top:38px}
.field-ribbon span{display:inline-flex;align-items:center;gap:9px;padding:10px 15px;border:1px solid var(--hair);border-radius:999px;background:var(--card);font-family:var(--disp);font-size:12px;font-weight:650;color:var(--ink-soft)}
.field-ribbon i{width:7px;height:7px;border-radius:50%;background:var(--brand-bright)}
.field-gateway .acts{margin-top:32px}

.home-credibility{padding-top:14px}
.home-credibility .row{border-block:1px solid var(--hair);justify-content:center}
.home-closing .panel{position:relative;overflow:hidden}
.home-closing .panel::after{content:"";position:absolute;width:190px;height:190px;border:1px solid color-mix(in srgb,var(--bg) 18%,transparent);border-radius:50%;right:-64px;top:-78px;pointer-events:none}

@media(max-width:920px){
  .home-product .product-intro,.connected-work,.home-system .system-layout{grid-template-columns:1fr}
  .connected-work{min-height:0}
  .card-bay{min-height:360px}
  .home-system h2{max-width:14ch}
  .field-gateway .gateway-head{align-items:start;flex-direction:column}
}

@media(max-width:620px){
  .home-product{padding-top:28px}
  .home-product .product-frame{border-radius:20px}
  .home-product .product-intro{padding:26px 22px}
  .connected-note,.card-bay{padding:26px 22px}
  .system-line{grid-template-columns:1fr}
  .system-line div,.system-line div+div{padding:18px 0;border-right:0;border-bottom:1px solid var(--hair)}
  .system-line div:last-child{border-bottom:0}
  .field-ribbon{gap:7px}
}

@media(prefers-reduced-motion:reduce){
  .card-inner{transition:none}
}