:root{--navy:#17252a;--deep:#101a1f;--blue:#32a9dd;--blue2:#68c8ee;--ice:#edf7fb;--paper:#f5f7f8;--white:#fff;--ink:#17252a;--muted:#627078;--line:#cbd8dd;--accent:#32a9dd;--danger:#b42334;--max:1500px;--pad:clamp(1.25rem,4vw,4.25rem);--sans:Montserrat,"Segoe UI",Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}html{min-height:100%;overflow-x:hidden}body{margin:0;min-height:100dvh;overflow-x:hidden;color:var(--ink);background:linear-gradient(#17252a09 1px,transparent 1px),linear-gradient(90deg,#17252a09 1px,transparent 1px),var(--paper);background-size:32px 32px;font-family:var(--sans)}button,a{font:inherit}button{color:inherit}:focus-visible{outline:3px solid var(--blue2);outline-offset:4px}.skip-link{position:fixed;left:.5rem;top:-5rem;z-index:100;padding:.75rem 1rem;background:var(--blue);color:var(--deep)}.skip-link:focus{top:.5rem}#app,.shell{min-height:100dvh}.shell{display:flex;flex-direction:column}
.topbar{min-height:82px;padding:.7rem var(--pad);position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:1rem;color:var(--white);background:#17252af7;border-bottom:1px solid #ffffff24;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:1rem;min-width:0}.brand a{flex:0 0 auto}.brand img{display:block;width:112px;height:auto}.brand strong{padding-left:1rem;border-left:1px solid #ffffff40;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-actions{display:flex;align-items:center;gap:1rem;flex-shrink:0}.link{color:var(--white);text-decoration:none;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.link:hover{color:var(--blue2)}
.page{flex:1;width:min(100%,var(--max));margin:0 auto;padding:clamp(3.5rem,8vw,7rem) var(--pad)}.page.play{width:min(46rem,100%);padding-top:clamp(2rem,5vw,4rem);display:flex;flex-direction:column}h1,h2,p{margin-top:0}h1{max-width:980px;margin-bottom:1.25rem;font-size:clamp(3rem,8vw,7rem);line-height:.92;letter-spacing:-.06em}.lede{max-width:780px;margin-bottom:clamp(2rem,5vw,4rem);color:var(--muted);font-size:clamp(1.05rem,2vw,1.45rem);line-height:1.55}.status{margin:2rem 0;color:var(--muted)}.status.error{color:var(--danger)}
.continue{margin:0 0 2rem;padding:1.25rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--ice);border-left:5px solid var(--blue)}.continue p{margin:0}.set-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--navy)}.set-list li{min-width:0}.set-list a{position:relative;isolation:isolate;min-height:19rem;height:100%;padding:clamp(1.5rem,4vw,3.5rem);display:flex;flex-direction:column;color:var(--white);background:var(--navy);text-decoration:none;overflow:hidden;transition:background .25s ease}.set-list a::before{content:"";position:absolute;inset:0 0 auto;z-index:-1;height:6px;background:var(--set-accent,var(--blue));transform:scaleX(.16);transform-origin:left;transition:transform .3s ease}.set-list a::after{content:"\2192";position:absolute;right:1.5rem;bottom:1.25rem;color:var(--blue2);font-size:2rem;transition:transform .25s ease}.set-list a:hover,.set-list a:focus-visible{background:#20353d}.set-list a:hover::before,.set-list a:focus-visible::before{transform:scaleX(1)}.set-list a:hover::after,.set-list a:focus-visible::after{transform:translateX(.35rem)}.set-list h2{margin:.75rem 0 1rem;font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.045em}.set-list p{max-width:30rem;color:#cbd8dc;line-height:1.55}.meta{margin-top:auto;padding-top:2rem;display:flex;flex-wrap:wrap;gap:.5rem}.pill{padding:.45rem .65rem;border:1px solid currentColor;color:inherit;font-size:.65rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;opacity:.78}
.actions{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.75rem}.btn{min-height:48px;padding:.85rem 1.1rem;border:1px solid var(--blue);background:var(--blue);color:#06151b;cursor:pointer;text-decoration:none;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;transition:background .2s ease,border-color .2s ease,transform .2s ease}.btn:hover{background:#84d7f6;border-color:#84d7f6;transform:translateY(-2px)}.btn.secondary{color:var(--ink);background:transparent;border-color:var(--line)}.btn.secondary:hover{background:var(--white);border-color:var(--blue)}.btn:disabled{opacity:.38;cursor:not-allowed;transform:none}
.progress{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:1rem;margin-bottom:1.5rem}.progress>span{font:700 .75rem/1 var(--sans);letter-spacing:.1em}.bar{height:3px;overflow:hidden;background:var(--line)}.bar span{display:block;width:var(--p);height:100%;background:var(--blue);transition:width .3s ease}.stage{position:relative;min-height:min(35rem,calc(100dvh - 15rem));perspective:1400px;animation:deal .5s cubic-bezier(.2,.8,.2,1) both}.stage::before,.stage::after{content:"";position:absolute;inset:0;border:1px solid #88a0aa;background:#dbe8ec;pointer-events:none}.stage::before{transform:translate(12px,12px) rotate(1.3deg)}.stage::after{transform:translate(6px,6px) rotate(-.7deg);background:#e7f0f3}.flip{position:absolute;inset:0;z-index:2;width:100%;min-height:100%;padding:0;border:0;background:transparent;cursor:pointer;transform-style:preserve-3d;transition:transform .62s cubic-bezier(.2,.75,.25,1),filter .2s ease}.flip:hover{filter:brightness(1.04)}.flip.is-flipped{transform:rotateY(180deg)}.face{position:absolute;inset:0;padding:clamp(2rem,6vw,4.5rem);display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left;overflow:auto;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-top:7px solid var(--accent);box-shadow:0 22px 55px #0c1f2633}.face.front{color:var(--white);background:var(--navy)}.face.back{color:var(--ink);background:var(--white);transform:rotateY(180deg);border:1px solid var(--line);border-top:7px solid var(--accent)}.kicker{color:var(--blue2);font-size:.7rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.face.back .kicker{color:#1687b8}.face p{margin:auto 0;font-size:clamp(1.65rem,5vw,3rem);line-height:1.22;letter-spacing:-.035em}.hint{align-self:flex-end;color:inherit;font-size:.67rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.65}.controls{margin-top:1.5rem;display:grid;grid-template-columns:1fr auto 1fr;gap:.75rem;align-items:center}.controls>:last-child{justify-self:end}.controls .center{display:flex;gap:.5rem;align-items:center}
.scan{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.scan li{border-bottom:1px solid var(--line)}.scan button{width:100%;padding:1.25rem 0;border:0;background:transparent;text-align:left;cursor:pointer}.scan button:hover{color:#137da9}.scan b{display:block;margin-bottom:.4rem;color:#1687b8;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}.scan span{font-size:clamp(1rem,2vw,1.25rem);line-height:1.45}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes deal{from{opacity:0;transform:translateY(24px) rotate(1.5deg) scale(.975)}to{opacity:1;transform:none}}
@media(max-width:760px){.topbar{min-height:70px}.brand img{width:88px}.brand strong{display:none}.topbar-actions{gap:.75rem}h1{font-size:clamp(2.8rem,15vw,4.6rem)}.set-list{grid-template-columns:1fr}.set-list a{min-height:15rem}.stage{min-height:min(31rem,calc(100dvh - 14rem))}.face{padding:2rem}.controls{grid-template-columns:1fr 1fr}.controls .center{grid-column:1/-1;grid-row:1;justify-content:center}}
@media(max-width:420px){.link{font-size:.62rem}.page{padding-left:1rem;padding-right:1rem}.controls .btn{width:100%;padding-inline:.65rem}.controls>:last-child{justify-self:stretch}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.flip{transform:none!important}.flip .face.back{transform:none}.flip:not(.is-flipped) .face.back,.flip.is-flipped .face.front{visibility:hidden}}

/* Conversation-deck experience */
.home-hero{max-width:1120px;margin-bottom:clamp(4rem,9vw,8rem)}
.eyebrow{margin:0 0 1.25rem;color:#1687b8;font-size:.7rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.home-hero h1{max-width:1100px}
.home-hero .lede{max-width:920px;margin-bottom:0}
.how{display:grid;grid-template-columns:minmax(15rem,.7fr) 1.5fr;gap:clamp(2rem,6vw,7rem);padding:clamp(2.5rem,5vw,4.5rem) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-heading h2,.collection-heading h2{margin:0;font-size:clamp(2.2rem,4vw,4.25rem);line-height:1;letter-spacing:-.05em}
.how ol{counter-reset:steps;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:4px solid var(--blue)}
.how li{position:relative;min-height:12rem;padding:2rem 1.5rem;border-right:1px solid var(--line);background:#fff}
.how li:last-child{border-right:0}
.how li::before{counter-increment:steps;content:"0" counter(steps);display:block;margin-bottom:2rem;color:var(--blue);font-weight:800}
.how b{display:block;margin-bottom:.65rem;font-size:1.05rem}
.how span{color:var(--muted);font-size:.9rem;line-height:1.55}
.collection-heading{display:grid;grid-template-columns:1.2fr .8fr;align-items:end;gap:clamp(2rem,8vw,8rem);margin:clamp(4.5rem,9vw,8rem) 0 3rem}
.collection-heading>p{margin:0;color:var(--muted);font-size:1.05rem;line-height:1.6}

.set-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,4vw,4.5rem);background:transparent}
.set-list li{position:relative;padding:0 12px 14px}
.set-list li::before,.set-list li::after{content:"";position:absolute;inset:8px 6px 6px 18px;border:1px solid #91a7af;background:#dbe8ec;transform:rotate(1deg);transition:transform .28s ease}
.set-list li::after{inset:4px 10px 10px 8px;background:#e9f1f3;transform:rotate(-.7deg)}
.set-list a{z-index:2;min-height:25rem;padding:clamp(1.7rem,3.5vw,3rem);border-top:7px solid var(--set-accent,var(--blue));box-shadow:0 18px 36px #132d3720;transition:transform .28s ease,box-shadow .28s ease,background .28s ease}
.set-list a::before{display:none}
.set-list li:hover::before{transform:translate(6px,8px) rotate(2deg)}
.set-list li:hover::after{transform:translate(2px,3px) rotate(-1.4deg)}
.set-list a:hover,.set-list a:focus-visible{background:#20353d;transform:translateY(-8px) rotate(-.35deg);box-shadow:0 28px 55px #132d3735}
.deck-number{color:var(--blue2);font-size:.72rem;font-weight:800;letter-spacing:.14em}
.set-list h2{margin:auto 0 1rem}
.deck-question{color:#fff!important;font-size:clamp(1.05rem,2vw,1.3rem);font-weight:700;line-height:1.4}
.deck-summary{margin-bottom:0;font-size:.9rem}
.set-list .meta{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid #ffffff35}
.set-list a::after{display:none}
.deck-cta{margin-top:1.25rem;color:var(--blue2);font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.deck-cta span{display:inline-block;transition:transform .2s ease}.set-list a:hover .deck-cta span,.set-list a:focus-visible .deck-cta span{transform:translateX(.35rem)}

.set-intro{display:grid;grid-template-columns:1fr minmax(18rem,.65fr);gap:clamp(3rem,9vw,10rem);align-items:center}
.set-copy h1{margin-bottom:1.25rem}
.set-copy .lede{margin-bottom:1.25rem;color:var(--ink);font-weight:700}
.set-summary{max-width:680px;color:var(--muted);font-size:1.05rem;line-height:1.6}
.set-outcome{max-width:680px;margin:2rem 0 0;padding:1.25rem 1.5rem;background:var(--ice);border-left:5px solid var(--accent);line-height:1.55}
.deck-pack{position:relative;aspect-ratio:5/7;max-width:25rem;width:100%;margin:2rem auto}
.pack-card{position:absolute;inset:0;border:1px solid #8ba1aa;background:#dbe8ec}
.back-card{transform:translate(24px,22px) rotate(3deg)}.middle-card{transform:translate(12px,10px) rotate(-2deg);background:#eef4f6}
.pack-card.cover{padding:clamp(2rem,5vw,3.5rem);display:flex;flex-direction:column;color:#fff;background:var(--navy);border-top:8px solid var(--set-accent,var(--blue));box-shadow:0 28px 55px #112a3433;transform:rotate(-1deg)}
.cover span,.cover small{font-size:.65rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.cover span{color:var(--blue2)}.cover strong{margin:auto 0;font-size:clamp(2.4rem,5vw,4.25rem);line-height:.93;letter-spacing:-.06em}.cover small{align-self:flex-end;color:#c7d5d9}
.facilitator-note{margin-top:clamp(5rem,10vw,9rem);padding-top:2.5rem;border-top:1px solid var(--line)}
.facilitator-note>div{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.facilitator-note>div p{margin:0;padding:1.5rem;background:#fff;color:var(--muted);line-height:1.55}.facilitator-note b{display:block;margin-bottom:.6rem;color:var(--ink)}

/* Applying filters to a preserve-3d parent reveals the mirrored face in Chromium. */
.flip:hover{filter:none}

@media(max-width:900px){.how,.set-intro{grid-template-columns:1fr}.how ol{grid-template-columns:1fr}.how li{min-height:0;border-right:0;border-bottom:1px solid var(--line)}.how li:last-child{border-bottom:0}.collection-heading{grid-template-columns:1fr}.deck-pack{max-width:21rem}.facilitator-note>div{grid-template-columns:1fr}}
@media(max-width:760px){.set-list{grid-template-columns:1fr;gap:2.5rem}.set-list a{min-height:22rem}.collection-heading{margin-bottom:2rem}.set-intro{gap:1rem}.deck-pack{width:calc(100% - 2rem)}}
.collection-heading.ai-collection{padding-top:clamp(4rem,8vw,7rem);border-top:1px solid var(--line)}
.face .card-title{display:block;margin:auto 0 1rem;color:var(--blue2);font-size:clamp(1.15rem,2vw,1.5rem);letter-spacing:-.02em}
.face .card-title+p{margin:0 auto auto 0}
