/* Contact section (7-oct-2026). Uses each page's own tokens, so it follows light and dark. */
.contact-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,64px);align-items:start}
.contact-intro p{color:var(--muted);font-size:1.08rem;max-width:30em;margin:.2em 0 1.1em}
.contact-ways{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.contact-ways li{display:flex;gap:12px;align-items:center;font-weight:700}
.contact-ways .ic{flex:none;width:40px;height:40px;border-radius:50%;background:var(--sage);color:var(--teal);display:grid;place-items:center}
.contact-ways .ic svg{width:19px;height:19px}
.contact-ways a{color:var(--ink);text-underline-offset:3px}
.contact-ways small{display:block;font-weight:500;color:var(--muted);font-size:.85rem}
.cform{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(18px,3vw,28px);box-shadow:var(--shadow);display:grid;gap:14px}
.cform .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:end}
.cform .row2.r-topic{grid-template-columns:.8fr 1.2fr}
.cform label{display:grid;gap:6px;font-weight:700;font-size:.92rem}
.cform label small{font-weight:500;color:var(--muted)}
.cform select{text-overflow:ellipsis}
.cform input,.cform select,.cform textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:.75em .9em;width:100%;min-height:48px}
.cform textarea{min-height:130px;resize:vertical;line-height:1.5}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 22%,transparent)}
.cform .trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cform .btn{width:100%;border:0;cursor:pointer;font:inherit;font-weight:800}
.cform .btn[disabled]{opacity:.6;cursor:wait}
.cform .cmsg{margin:0;font-size:.95rem;min-height:1.2em}
.cform .cmsg.err{color:var(--orange)}
.cform .fine{margin:0;text-align:center}
.cdone{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(22px,3vw,32px);text-align:center;box-shadow:var(--shadow)}
.cdone .ok{width:56px;height:56px;border-radius:50%;background:var(--sage);color:var(--teal);display:grid;place-items:center;margin:0 auto 12px;font-size:1.6rem;font-weight:800}
.cdone h3{margin:.2em 0 .3em;font-size:1.35rem}
.cdone p{margin:0;color:var(--muted)}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr}.cform .row2,.cform .row2.r-topic{grid-template-columns:1fr}}

/* The Parent Stage Assessment on the home (8-oct-2026): the outline button next to the
   trial, and the section that invites to it. Same tokens as each page. */
.btn-alt{display:inline-flex;align-items:center;justify-content:center;gap:.5em;border:2px solid var(--teal);color:var(--teal);background:transparent;border-radius:999px;font-weight:800;text-decoration:none;padding:.95em 1.5em;white-space:nowrap}
.btn-alt:hover{background:var(--sage)}
.btn-alt.small{font-size:.85rem;padding:.7em 1.1em}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.assess-band{background:var(--sage)}
.assess-box{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(20px,4vw,48px);align-items:center}
.assess-box p{color:var(--muted);font-size:1.08rem;max-width:34em;margin:.2em 0 0}
.assess-box ul{list-style:none;margin:1em 0 0;padding:0;display:grid;gap:8px}
.assess-box li{display:grid;grid-template-columns:24px 1fr;gap:10px;font-weight:600}
.assess-box li::before{content:"✓";color:var(--teal);font-weight:800}
.assess-card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(18px,3vw,28px);box-shadow:var(--shadow);display:grid;gap:12px;text-align:center}
.assess-card .ladder-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.assess-card .ladder-mini span{border-radius:10px;padding:10px 4px;font-size:.78rem;font-weight:700;background:var(--bg);border:1px solid var(--line)}
.assess-card .ladder-mini span.here{background:var(--sand);border:2px solid var(--btn)}
.assess-card .btn{width:100%}
@media (max-width:760px){.assess-box{grid-template-columns:1fr}}

/* "Free · 4 minutes · No sign-up" on every way into the assessment (Pablo, 8-oct). */
.btn-alt.two{flex-direction:column;gap:2px;line-height:1.15;padding-block:.7em}
.btn-alt.two small{font-size:.72rem;font-weight:600;opacity:.85;letter-spacing:.01em}
.trio{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.trio span{font-size:.8rem;font-weight:800;color:var(--teal);background:var(--sage);border-radius:999px;padding:.35em .8em}
.trio span::before{content:"✓ ";font-weight:800}

/* "What our team takes care of": cards that turn over (8-oct-2026, tiles.js). The turn is a
   2D squeeze (scaleX to 0 and back) that swaps the faces at the middle: a 3D rotation with
   hidden backfaces sometimes left both faces invisible for a moment in Chrome. */
.flip-tiles .fcard{min-height:120px}
.flip-tiles .finner{position:relative;width:100%;height:100%}
.flip-tiles .finner.spin{animation:fturn .34s ease-in-out}
@keyframes fturn{0%{transform:scaleX(1)}50%{transform:scaleX(.02)}100%{transform:scaleX(1)}}
.flip-tiles .fface{position:absolute;inset:0;border-radius:20px;border:1px solid var(--line);background:var(--card);display:flex;flex-direction:column;gap:10px;padding:20px 22px 22px;text-align:left;font:inherit;color:var(--ink)}
.flip-tiles .fcard:not(.open) .fback,.flip-tiles .fcard.open .ffront{visibility:hidden}
.flip-tiles .ffront{cursor:pointer;justify-content:center;transition:border-color .2s,box-shadow .2s}
.flip-tiles .ffront:hover{border-color:var(--teal);box-shadow:var(--shadow)}
.flip-tiles .ffront svg{flex:none;color:var(--teal);width:34px;height:34px}
.flip-tiles .ffront .ft{font-weight:700;font-size:1.1rem;line-height:1.25}
.flip-tiles .ffront .fhint{font-size:.82rem;font-weight:700;color:var(--orange)}
.flip-tiles .fback{cursor:pointer;background:var(--sage);border-color:var(--teal)}
.flip-tiles .fback .bt{font-size:1rem}
.flip-tiles .fback p{margin:0;font-size:.95rem;line-height:1.45;color:var(--ink)}
.flip-tiles .fact{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.flip-tiles .fact .btn{box-shadow:none}
.flip-tiles .fturn{all:unset;cursor:pointer;font-size:.85rem;font-weight:700;color:var(--teal)}
.flip-tiles .fturn:focus-visible,.flip-tiles .ffront:focus-visible{outline:3px solid var(--btn);outline-offset:3px}
@media (max-width:760px){
  .flip-tiles{grid-template-columns:1fr 1fr!important;align-items:start}
  .flip-tiles .fcard{min-height:0;transition:height .3s ease}
  .flip-tiles .fcard.open{grid-column:1/-1}
  .flip-tiles .fface{padding:14px 14px 16px}
  .flip-tiles .ffront svg{width:28px;height:28px}
  .flip-tiles .ffront .ft{font-size:1rem}
  .flip-tiles .ffront .fte{font-size:.86rem}
  .flip-tiles .ffront{justify-content:flex-start}
}
.flip-tiles .ffront .fte{font-size:.95rem;font-weight:500;color:var(--muted);line-height:1.35}
.flip-tiles .ffront .fhint{margin-top:auto;padding-top:4px}
@media (prefers-reduced-motion:reduce){.flip-tiles .finner.spin{animation:none}}
