/* Card wall hero (3 Oct 2026): the homepage opener. A wall of the things Garilla makes parts round the
   headline; scrolling closes it, tilts it and travels across it through the five stages. It replaces the
   deck hero. Classes are prefixed cw- so the site's shared rules can't reach them. Boards and the
   reasoning: prototypes/card-wall/README.md. */
body.home-page{padding-top:0!important}
.card-wall{position:relative;width:100vw;margin-left:calc(50% - 50vw);height:520svh}
.cw-window{position:sticky;top:0;height:100svh;min-height:600px;overflow:hidden;background:#ece7db;color:#1a1712}
.cw-stage{position:absolute;inset:0;overflow:hidden}
.cw-cam{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;will-change:transform}

/* The cards. Sizes are wall units; the camera scales the whole wall. */
.cw-card{position:absolute;overflow:hidden;background:#e4ddcd;font:14px/1.5 "Helvetica Neue",Helvetica,Arial,sans-serif;color:#1a1712}
.cw-card div,.cw-card span{line-height:inherit}
.cw-ph{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none!important;object-fit:cover}
.cw-tag{position:absolute;left:0;right:0;bottom:0;padding:7px 9px 6px;background:rgba(245,242,236,.94);font:10px/1.25 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.2px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-tag b{font-weight:700}
.cw-mono{font:10px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.6px;text-transform:uppercase}
.cw-au{color:#8a6a2b}
.cw-mute{color:#70695e}
.cw-paper{background:#f5f2ec;border:1px solid #d8d0bf;padding:26px 26px 22px}
.cw-col{display:flex;flex-direction:column;justify-content:space-between;height:100%}
.cw-say{font-size:13px;line-height:1.55;max-width:290px}
.cw-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,18,15,.62),rgba(20,18,15,0) 48%)}
.cw-play{position:absolute;left:50%;top:44%;width:56px;height:56px;margin:-28px 0 0 -28px;border:1.5px solid rgba(245,242,236,.9);border-radius:50%;display:flex;align-items:center;justify-content:center}
.cw-play svg{display:block;margin-left:4px}
.cw-scrub{position:absolute;left:14px;right:14px;bottom:40px;height:2px;background:rgba(245,242,236,.35)}
.cw-scrub i{position:absolute;inset:0;background:#c8a96e;transform-origin:0 50%;transform:scaleX(.3)}
.cw-segs{position:absolute;left:10px;right:10px;top:10px;display:flex;gap:4px}
.cw-segs i{flex:1;height:2px;background:rgba(245,242,236,.4)}
.cw-segs i:first-child{background:#f5f2ec}
.cw-reelcap{position:absolute;left:12px;right:12px;bottom:36px;color:#f5f2ec;font-size:12px;line-height:1.35}
.cw-grid{position:absolute;inset:0 0 26px;padding:3px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;background:#f5f2ec}
.cw-grid img{display:block;width:100%;height:100%;max-width:none!important;object-fit:cover}
.cw-slide{position:absolute;inset:0 0 26px;background:#f5f2ec;display:flex}
.cw-slide-t{flex:1;padding:26px 22px 20px 26px;display:flex;flex-direction:column;justify-content:space-between}
.cw-slide-h{font-size:30px;line-height:1.04;letter-spacing:-.035em}
.cw-slide-p{position:relative;width:46%;overflow:hidden}
.cw-web{position:absolute;inset:0 0 26px;background:#f5f2ec}
.cw-chrome{height:26px;background:#e4ddcd;display:flex;align-items:center;gap:6px;padding:0 10px}
.cw-chrome i{width:8px;height:8px;border-radius:50%;background:#c9c0ad}
.cw-chrome span{margin-left:10px;flex:1;height:15px;border-radius:4px;background:#f5f2ec;font:9px/15px ui-monospace,SFMono-Regular,Menlo,monospace;color:#70695e;padding-left:8px}
.cw-webnav{margin:12px 16px 0;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d8d0bf;padding-bottom:9px}
.cw-webnav b{font-weight:850;font-size:15px;letter-spacing:-.6px}
.cw-webnav b span{color:#9c7a34}
.cw-webnav em{display:flex;gap:8px}
.cw-webnav em i{width:22px;height:3px;background:#c9c0ad}
.cw-webh{margin:4px 16px 0;font-size:24px;line-height:1.02;letter-spacing:-.04em}
.cw-webh em{font-family:Georgia,"Times New Roman",serif;color:#9c7a34}
.cw-webimgs{position:absolute;left:16px;right:16px;bottom:12px;height:104px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.cw-webimgs img{display:block;width:100%;height:100%;max-width:none!important;object-fit:cover}
.cw-sheet{position:absolute;inset:0 0 26px;background:#141210;padding:18px 16px}
.cw-frames{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 8px}
.cw-frames span{position:relative;display:block}
.cw-frames img{display:block;width:100%;aspect-ratio:3/2;max-width:none!important;object-fit:cover}
.cw-frames em{position:absolute;left:0;bottom:-13px;font:normal 8px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#c8a96e}
.cw-ring{position:absolute;left:182px;top:1px;overflow:visible}
.cw-br{position:absolute;width:22px;height:22px;border:0 solid rgba(245,242,236,.92)}
.cw-cross{position:absolute;left:50%;top:46%;width:18px;height:18px;margin:-9px 0 0 -9px}
.cw-cross:before,.cw-cross:after{content:"";position:absolute;background:rgba(245,242,236,.85)}
.cw-cross:before{left:0;right:0;top:50%;height:1px}
.cw-cross:after{top:0;bottom:0;left:50%;width:1px}
.cw-calgrid{display:grid;grid-template-columns:74px repeat(6,minmax(0,1fr));row-gap:14px;align-items:center}
.cw-calgrid .cw-mono{font-size:9px}
.cw-calgrid>span{display:flex;justify-content:center}
.cw-dot{display:block;width:16px;height:16px;border-radius:50%;border:1px solid #d8d0bf}
.cw-dot.on{border:0;background:#9c7a34;transform:scale(0)}
.cw-plan svg,.cw-chartsvg{display:block;overflow:visible}
.cw-wipe{position:absolute;top:0;bottom:26px;width:2px;margin-left:-1px;background:#c8a96e}
.cw-gl{position:absolute;top:10px;color:#f5f2ec;font:9px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.6px;text-transform:uppercase}
.cw-mat{position:absolute;inset:0;background:#f5f2ec;border:1px solid #d8d0bf;padding:14px 14px 34px}
.cw-mat>span{position:relative;display:block;width:100%;height:100%;overflow:hidden}
.cw-mat>em{position:absolute;left:14px;bottom:11px;font:normal 9px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.6px;text-transform:uppercase}
.cw-q{font:italic 25px/1.28 Georgia,"Times New Roman",serif}

/* The copy at rest, centred in the gap the wall opens for it */
.cw-copy{position:absolute;left:6%;right:6%;top:50%;z-index:2;text-align:center;transform:translateY(-50%)}
.cw-copy-in{will-change:transform,opacity}
.cw-eyebrow{margin:0 0 22px;font:10px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:2px;text-transform:uppercase;color:#5f584d}
.cw-copy h1{margin:0 0 22px!important;max-width:none!important;font:400 clamp(52px,6vw,94px)/1.02 "Helvetica Neue",Helvetica,Arial,sans-serif!important;letter-spacing:-.045em!important;color:#1a1712!important;text-wrap:balance}
.cw-copy h1 em{font-family:Georgia,"Times New Roman",serif;color:#9c7a34}
.cw-intro{max-width:610px;margin:0 auto 12px;font-size:14px;line-height:1.85!important;color:#4d463c}
.cw-partner{max-width:535px;margin:0 auto 24px;font-size:12px;line-height:1.7!important;color:#5f584d}
.cw-cta{display:inline-flex;align-items:center;gap:22px;padding:17px 23px;border-radius:10px;background:#1a1712;color:#f5f2ec!important;font-size:14px;font-weight:600;line-height:1.4;text-decoration:none}
.cw-cta .cta-pointer{flex:none;width:24px;height:24px}
.cw-hint{display:flex;align-items:center;gap:14px;width:max-content;margin:22px auto 0;text-align:left;font:10px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1px;text-transform:uppercase;color:#5f584d}
.cw-hint>span{width:1px;height:30px;background:#5f584d}
.cw-hint p{margin:0;line-height:1.6!important}
.cw-hint small{font-size:8px}

/* The close: the wall opens a slot and the line arrives in it */
.cw-fin{position:absolute;left:6%;right:6%;top:50%;z-index:2;text-align:center;transform:translateY(-50%);opacity:0;pointer-events:none}
.cw-fin .cw-kick{margin:0 0 12px;font:10px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:2px;text-transform:uppercase;color:#5f584d}
.cw-fin .cw-last{display:inline-block;font:italic 400 clamp(38px,4.4vw,60px)/1.02 Georgia,"Times New Roman",serif;letter-spacing:-.5px;color:#9c7a34}

/* The lower third that names each stage as the camera passes it */
.cw-story{position:absolute;left:0;right:0;bottom:0;z-index:2;height:var(--cw-cap,168px);padding:22px 5% 0;background:rgba(245,242,236,.97);border-top:1px solid #d8d0bf;opacity:0;pointer-events:none}
.cw-steps{display:flex;gap:18px;margin:0;padding:0;list-style:none;font:10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.8px;color:#70695e}
.cw-steps li{padding-bottom:7px;line-height:1!important;border-bottom:1px solid transparent}
.cw-steps li.done{color:#8a6a2b}
.cw-steps li.now{color:#1a1712;border-bottom-color:#1a1712}
.cw-beat{position:absolute;left:5%;right:5%;top:58px;max-width:640px;opacity:0}
.cw-beat h2{margin:0 0 8px!important;font:400 30px/1.08 "Helvetica Neue",Helvetica,Arial,sans-serif!important;letter-spacing:-1px!important;color:#1a1712}
.cw-beat h2 span{margin-right:14px;font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1.8px;color:#8a6a2b;vertical-align:middle}
.cw-beat p{margin:0;max-width:540px;font-size:14px;line-height:1.6!important;color:#4d463c}

.cw-progress{position:absolute;left:0;right:0;bottom:0;z-index:3;height:2px;background:rgba(26,23,18,.08)}
.cw-progress i{display:block;height:100%;background:#9c7a34;transform:scaleX(0);transform-origin:left}
.cw-motion{position:absolute;right:24px;bottom:22px;z-index:3;min-height:36px;padding:9px 13px;border:1px solid #d8d0bf;border-radius:0;background:#f5f2ec;color:#1a1712;font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;cursor:pointer}
.cw-motion:hover{border-color:#9c7a34}
.cw-motion:focus-visible,.cw-cta:focus-visible{outline:2px solid #9c7a34;outline-offset:4px}

.cw-still .card-wall{height:auto}
.cw-still .cw-window{position:relative}
.cw-still .cw-hint,.cw-still .cw-story,.cw-still .cw-progress,.cw-still .cw-fin{display:none}

/* Carried over from deck-hero.css, which the hero shared with the process section below it. */
.process-overview{position:relative;background:#f5f2ec;z-index:1;padding-top:70px!important}

@media (max-width:700px){
  .cw-copy{left:6%;right:6%}
  .cw-copy h1{font-size:46px!important;line-height:1.04!important;letter-spacing:-.05em!important}
  .cw-copy h1 em{display:block;margin-top:4px}
  .cw-eyebrow{margin-bottom:16px;font-size:8px;letter-spacing:1px}
  .cw-intro{font-size:12px;line-height:1.8!important}
  .cw-partner{margin-bottom:20px;font-size:11px}
  .cw-cta{gap:14px;max-width:100%;padding:15px 18px;font-size:13px}
  .cw-cta .cta-pointer{width:22px;height:22px}
  .cw-hint{display:none}
  .cw-story{padding:16px 6% 0}
  .cw-steps{gap:12px}
  .cw-beat{left:6%;right:6%;top:44px}
  .cw-beat h2{font-size:22px!important}
  .cw-beat p{font-size:12.5px;line-height:1.55!important}
  .cw-fin .cw-last{font-size:34px}
  .cw-motion{right:12px;bottom:12px}
}
