.foreplay-page{--cream:#fff7ea;--ink:#1e1722;--coral:#ff6464;--mint:#75d4bc;--yellow:#ffd858;--blue:#5f78e8;--lilac:#cbb8ff;background:var(--cream);color:var(--ink)}
.foreplay-page .section{padding:clamp(4rem,8vw,7rem) 0}.foreplay-page .section--canvas{background:#fffaf1}.foreplay-page .section--yellow{background:var(--yellow)}.foreplay-page .section--mint{background:var(--mint)}.foreplay-page .section--coral{background:var(--coral)}.foreplay-page .section--night{background:var(--ink);color:var(--cream)}
.foreplay-hero{background:linear-gradient(132deg,var(--coral) 0 55%,var(--yellow) 55%);padding:clamp(3.5rem,7vw,7rem) 0}.foreplay-hero__grid{display:grid;grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);gap:clamp(2rem,5vw,5rem);align-items:center}.foreplay-hero__copy{position:relative;z-index:1}.foreplay-hero .display-title{font-size:clamp(4rem,8vw,8.4rem);line-height:.81;letter-spacing:-.065em;margin:.3em 0}.foreplay-hero__copy>p:last-of-type{font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.45;max-width:32rem}.foreplay-hero__actions{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;margin-top:2rem}.foreplay-hero__actions>a:not(.button){font-weight:800;color:var(--ink)}
.foreplay-hero__art{margin:0;border:4px solid var(--ink);box-shadow:14px 14px 0 var(--ink);background:var(--cream);transform:rotate(1deg)}.foreplay-hero__art img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}.foreplay-hero__art figcaption,.moods-figure figcaption{padding:1rem 1.15rem;font-weight:750;line-height:1.35}
.foreplay-jump{position:sticky;top:0;z-index:9;background:var(--cream);border-block:3px solid var(--ink)}.foreplay-jump .shell{display:flex;gap:1.1rem;align-items:center;overflow-x:auto;padding-block:.8rem;white-space:nowrap}.foreplay-jump strong{background:var(--ink);color:var(--cream);padding:.4rem .65rem}.foreplay-jump a{font-weight:750;color:var(--ink)}
.foreplay-page .section-head{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(15rem,.7fr);gap:2rem;align-items:end;margin-bottom:2.4rem}.foreplay-page .section-title{font-size:clamp(2.7rem,5.5vw,5.4rem);line-height:.9;letter-spacing:-.045em;margin:.2em 0 0}.foreplay-page .section-head>p{font-size:1.1rem;line-height:1.5;margin:0}.foreplay-answer{max-width:59rem;font-size:clamp(1.12rem,1.6vw,1.35rem);line-height:1.62}.foreplay-answer p{margin:0 0 1.3rem}.foreplay-punch{font-size:clamp(1.25rem,2vw,1.65rem);max-width:60rem;margin:2rem 0 0;padding:1.3rem;border:3px solid currentColor;background:rgba(255,255,255,.08)}
.quick-routes{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}.quick-routes a{display:flex;min-height:18rem;flex-direction:column;padding:1.35rem;border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink);color:var(--ink);text-decoration:none;background:var(--cream);transition:transform .15s ease,box-shadow .15s ease}.quick-routes a:nth-child(2){background:var(--mint)}.quick-routes a:nth-child(3){background:var(--lilac)}.quick-routes a:nth-child(4){background:var(--coral)}.quick-routes a:nth-child(5){background:var(--ink);color:var(--cream)}.quick-routes a:hover,.quick-routes a:focus-visible{transform:translate(-3px,-3px);box-shadow:10px 10px 0 var(--ink)}.quick-routes span{font-weight:900;font-size:.78rem;letter-spacing:.08em}.quick-routes strong{font-size:1.55rem;line-height:1;margin:1.4rem 0 .8rem}.quick-routes p{line-height:1.45;margin:0}.quick-routes b{margin-top:auto;padding-top:1.2rem}
.dial-map{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border:3px solid var(--cream)}.dial-map li{min-height:15rem;padding:1.25rem;border-right:2px solid var(--cream);display:flex;flex-direction:column;justify-content:space-between}.dial-map li:last-child{border-right:0}.dial-map li:nth-child(1){background:var(--coral);color:var(--ink)}.dial-map li:nth-child(2){background:var(--yellow);color:var(--ink)}.dial-map li:nth-child(3){background:var(--mint);color:var(--ink)}.dial-map li:nth-child(4){background:var(--blue)}.dial-map li:nth-child(5){background:var(--lilac);color:var(--ink)}.dial-map span{font-weight:900;border:2px solid currentColor;border-radius:99px;width:2.6rem;height:2.6rem;display:grid;place-items:center}.dial-map h3{font-size:1.8rem;margin:0 0 .4rem}.dial-map p{line-height:1.4;margin:0}
.mixer-section{background:linear-gradient(180deg,var(--cream) 0 70%,var(--mint) 70%)}.foreplay-mixer{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr);gap:2rem;background:#fffaf1;border:4px solid var(--ink);box-shadow:12px 12px 0 var(--ink);padding:clamp(1.2rem,3vw,2.5rem)}.mixer-controls{display:grid;gap:1.25rem}.foreplay-mixer fieldset{border:0;padding:0;margin:0}.foreplay-mixer legend{font-size:1.1rem;font-weight:900;margin-bottom:.7rem}.chip-row{display:flex;flex-wrap:wrap;gap:.55rem}.chip-row label{cursor:pointer}.chip-row input{position:absolute;opacity:0;pointer-events:none}.chip-row span{display:block;padding:.62rem .85rem;border:2px solid var(--ink);background:var(--cream);font-weight:800}.chip-row input:checked+span{background:var(--ink);color:var(--cream);box-shadow:4px 4px 0 var(--coral)}.chip-row input:focus-visible+span{outline:4px solid var(--blue);outline-offset:3px}.mixer-actions{display:flex;grid-column:1;gap:.75rem;align-items:flex-start;flex-wrap:wrap}.mixer-result{grid-column:2;grid-row:1/3;background:var(--yellow);border:3px solid var(--ink);padding:1.5rem;display:flex;flex-direction:column;justify-content:center}.mixer-result h3{font-size:clamp(2rem,4vw,3.6rem);line-height:.95;margin:.25rem 0 1rem}.mixer-result p{line-height:1.5}.mixer-result a{font-weight:900;color:var(--ink)}.mixer-result:focus{outline:4px solid var(--blue);outline-offset:4px}.mixer-noscript{grid-column:1/-1}
.idea-family{display:grid;grid-template-columns:minmax(14rem,.34fr) minmax(0,1fr);border:3px solid var(--ink);margin-bottom:2.2rem;box-shadow:9px 9px 0 var(--ink)}.family-intro{padding:1.5rem;border-right:3px solid var(--ink);display:flex;flex-direction:column}.family-intro--coral{background:var(--coral)}.family-intro--mint{background:var(--mint)}.family-intro--yellow{background:var(--yellow)}.family-intro--blue{background:var(--blue);color:white}.family-intro--lilac{background:var(--lilac)}.family-intro span{display:grid;place-items:center;width:3rem;height:3rem;border:2px solid currentColor;border-radius:50%;font-weight:900}.family-intro h3{font-size:2.2rem;line-height:1;margin:auto 0 .8rem}.family-intro p{line-height:1.45;margin:0}.idea-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:var(--ink);gap:2px}.idea-grid article{background:#fffaf1;padding:1.35rem;min-height:15rem}.idea-grid article>b{display:inline-grid;place-items:center;width:2.35rem;height:2.35rem;border:2px solid var(--ink);border-radius:50%}.idea-grid h4{font-size:1.5rem;line-height:1.05;margin:1.1rem 0 .7rem}.idea-grid p{line-height:1.5}.idea-grid details{margin-top:1rem;border-top:2px solid var(--ink);padding-top:.8rem}.idea-grid summary{font-weight:900;cursor:pointer}.idea-grid a{font-weight:800;color:inherit}
.moods-figure{margin:clamp(3rem,6vw,6rem) 0;border:4px solid var(--ink);box-shadow:12px 12px 0 var(--coral);background:var(--yellow)}.moods-figure img{width:100%;height:auto;display:block}.moods-figure figcaption{font-size:1.1rem}
.foreplay-table table{min-width:950px;background:var(--cream);border:3px solid var(--ink);border-collapse:collapse}.foreplay-table caption{font-weight:900;text-align:left;padding:1rem;background:var(--ink);color:var(--cream)}.foreplay-table th,.foreplay-table td{border:2px solid var(--ink);padding:1rem;text-align:left;vertical-align:top;line-height:1.4}.foreplay-table thead th{background:var(--yellow)}.foreplay-table tbody th{background:var(--cream)}.foreplay-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.32)}.foreplay-table-cards{display:none}
.route-stories{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}.route-stories article{border:3px solid var(--ink);padding:1.25rem;background:var(--cream);box-shadow:6px 6px 0 var(--ink)}.route-stories article:nth-child(2){background:var(--mint)}.route-stories article:nth-child(3){background:var(--lilac)}.route-stories article:nth-child(4){background:var(--yellow)}.route-stories article:nth-child(5){background:var(--coral)}.route-stories span{font-weight:900;font-size:.78rem;letter-spacing:.08em}.route-stories h3{font-size:1.55rem;line-height:1.05}.route-stories ol{padding-left:1.2rem;line-height:1.45}.route-stories p{line-height:1.45}
.foreplay-page .fix-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:3px solid var(--ink)}.foreplay-page .fix-grid article{padding:1.35rem;min-height:11rem;background:rgba(255,255,255,.12);border:1px solid var(--ink)}.foreplay-page .fix-grid h3{font-size:1.45rem;margin:0 0 .6rem}.foreplay-page .fix-grid p{line-height:1.5;margin:0}.foreplay-page .faq-stack{display:grid;gap:.8rem;margin-top:2rem}.foreplay-page .faq-stack details{border:3px solid var(--ink);background:var(--cream)}.foreplay-page .faq-stack summary{font-size:1.2rem;font-weight:900;padding:1.1rem;cursor:pointer;background:var(--yellow)}.foreplay-page .faq-stack details p{padding:0 1.1rem 1.15rem;line-height:1.55}.foreplay-page .faq-stack summary:focus-visible{outline:4px solid var(--blue);outline-offset:3px}
.foreplay-next__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:3px solid var(--cream)}.foreplay-next__grid a{min-height:14rem;padding:1.35rem;color:var(--cream);text-decoration:none;border:1px solid var(--cream);display:flex;flex-direction:column}.foreplay-next__grid a:nth-child(2){background:var(--yellow);color:var(--ink)}.foreplay-next__grid a:nth-child(3){background:var(--coral);color:var(--ink)}.foreplay-next__grid a:nth-child(4){background:var(--mint);color:var(--ink)}.foreplay-next__grid span{font-size:.78rem;font-weight:900;letter-spacing:.09em}.foreplay-next__grid strong{font-size:2rem;line-height:1;margin:.8rem 0}.foreplay-next__grid p{line-height:1.45}.foreplay-next__grid b{margin-top:auto}.foreplay-next__grid a:hover,.foreplay-next__grid a:focus-visible{outline:5px solid var(--yellow);outline-offset:-8px}
@media(max-width:1050px){.quick-routes,.route-stories{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-routes a:last-child,.route-stories article:last-child{grid-column:1/-1}.dial-map{grid-template-columns:repeat(5,minmax(8rem,1fr));overflow-x:auto}.foreplay-mixer{grid-template-columns:1fr}.mixer-result{grid-column:1;grid-row:auto}.route-stories article{min-height:15rem}}
@media(max-width:780px){.foreplay-page .section{padding:3.5rem 0}.foreplay-hero{padding-top:2.5rem;background:linear-gradient(160deg,var(--coral) 0 62%,var(--yellow) 62%)}.foreplay-hero__grid{grid-template-columns:1fr}.foreplay-hero .display-title{font-size:clamp(4.1rem,19vw,6.5rem)}.foreplay-hero__art{box-shadow:8px 8px 0 var(--ink);transform:none}.foreplay-jump{position:static}.foreplay-page .section-head{grid-template-columns:1fr;gap:.7rem}.foreplay-page .section-title{font-size:clamp(2.8rem,13vw,4.5rem)}.quick-routes{grid-template-columns:1fr}.quick-routes a,.quick-routes a:last-child{grid-column:auto;min-height:12rem}.dial-map{grid-template-columns:1fr;overflow:visible}.dial-map li{min-height:auto;border-right:0;border-bottom:2px solid var(--cream);flex-direction:row;align-items:center;gap:1rem}.dial-map li:last-child{border-bottom:0}.foreplay-mixer{padding:1rem;box-shadow:7px 7px 0 var(--ink)}.mixer-actions .button{width:100%}.idea-family{grid-template-columns:1fr;box-shadow:6px 6px 0 var(--ink)}.family-intro{min-height:13rem;border-right:0;border-bottom:3px solid var(--ink)}.idea-grid{grid-template-columns:1fr}.idea-grid article{min-height:auto}.moods-figure{box-shadow:7px 7px 0 var(--coral)}.foreplay-table{display:none}.foreplay-table-cards{display:grid;gap:.75rem}.foreplay-table-cards article{border:3px solid var(--ink);padding:1rem;background:var(--cream);box-shadow:5px 5px 0 var(--ink)}.foreplay-table-cards h3,.foreplay-table-cards p{margin:.2rem 0}.route-stories{grid-template-columns:1fr}.route-stories article,.route-stories article:last-child{grid-column:auto;min-height:auto}.foreplay-page .fix-grid{grid-template-columns:1fr}.foreplay-page .fix-grid article{min-height:auto}.foreplay-next__grid{grid-template-columns:1fr}.foreplay-next__grid a{min-height:11rem}}
@media(prefers-reduced-motion:reduce){.quick-routes a{transition:none}}
