/* /contact/ | page styles, prefixed .contact-* | logical properties only | no text under 13px */
.hero-note .icon{inline-size:18px;block-size:18px;flex:none;color:var(--gold-ink)}
.contact-big{font:var(--fw-semibold) var(--fs-20)/1.3 var(--font-serif);color:var(--ink);overflow-wrap:anywhere}
.contact-big.ltr{direction:ltr;text-align:start}
:root[dir="rtl"] .contact-big.ltr{text-align:right}
.contact-grid{align-items:start}
.contact-dl{margin:0;display:grid;gap:14px}
.contact-dl div{display:grid;gap:2px}
.contact-dl dt{font-size:var(--fs-13);font-weight:var(--fw-semibold);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
:root[dir="rtl"] .contact-dl dt{text-transform:none;letter-spacing:0}
.contact-dl dd{margin:0;font:var(--fw-semibold) var(--fs-20)/1.3 var(--font-serif);color:var(--ink);overflow-wrap:anywhere}
.contact-dl dd.ltr{direction:ltr;text-align:start}
:root[dir="rtl"] .contact-dl dd.ltr{text-align:right}
.contact-error{margin:var(--s-3) 0 0;padding:10px 12px;border-radius:var(--r-sm);background:var(--danger-bg);border:1px solid var(--danger-line);color:var(--danger-ink);font-size:var(--fs-14)}
.contact-error[hidden]{display:none}
#ct-result .actions .btn{flex:0 1 auto}
/* honeypot: off-screen, never display:none (some bots skip those), never a style attribute (CSP) */
.ct-hp{position:absolute;inset-inline-start:-10000px;inline-size:1px;block-size:1px;overflow:hidden}
.contact-grid form[hidden]{display:none}
.ct-q{margin:var(--s-4) 0 var(--s-2);font-weight:var(--fw-semibold);color:var(--ink)}
.ct-chips{display:flex;flex-wrap:wrap;gap:8px}
.ct-chip{min-block-size:44px}
/* QA 2026-10-10: on a 375px phone no chip runs past the edge (the last language chip was cut): the row wraps inside its box and a chip never grows past it */
.ct-chips{min-inline-size:0;max-inline-size:100%;justify-content:flex-start}
.ct-chip{flex:0 1 auto;min-inline-size:0;max-inline-size:100%;white-space:normal;text-align:center}
#write-fold>div,.ct-folds details>div{min-inline-size:0;max-inline-size:100%}
@media (max-width:480px){.ct-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,8.5rem),1fr))}.ct-chip{justify-content:center}}
.ct-folds details+details{margin-block-start:var(--s-2)}
/* phones: the WhatsApp button comes first and is big */
@media (max-width:640px){.hero .actions{flex-direction:column;align-items:stretch}.hero .actions .btn{inline-size:100%;min-block-size:56px;justify-content:center}}


/* sales pass 2026-10-07: the three free starts under the WhatsApp button (sp-*) | tokens only */
.sp-starts{margin:var(--s-4) 0 0}
.sp-q{margin:0 0 var(--s-2);font-weight:var(--fw-semibold);color:var(--ink-2)}
.sp-chips{display:flex;flex-wrap:wrap;gap:8px}
.sp-chip{display:inline-flex;align-items:center;gap:8px;min-block-size:44px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--primary);background:var(--card);color:var(--primary-ink);font-weight:var(--fw-semibold);text-decoration:none}
.sp-chip .icon{inline-size:18px;block-size:18px;flex:none}
.sp-chip:hover{background:var(--primary-soft)}
.sp-chip:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
@media (max-width:640px){.sp-chips{flex-direction:column}.sp-chip{justify-content:center}}
/* genz 2026-10-08: the chat-style start (ct-chat, ct-thread, ct-b) | tokens only | logical properties only | transform and opacity only */
.ct-chat{margin:var(--s-4) 0 0;padding:var(--s-4);background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-1)}
.ct-chat .ct-q{margin:0 0 var(--s-2)}
.ct-thread{display:grid;gap:var(--s-2);margin-block-start:var(--s-3)}
.ct-thread:not(:has(.ct-b:not([hidden]))){display:none}
.ct-b{margin:0;max-inline-size:88%;padding:10px 14px;border-radius:var(--r-md);font-size:var(--fs-15);line-height:1.4}
.ct-b[hidden]{display:none}
.ct-b-you{justify-self:end;background:var(--primary);color:var(--on-primary);border-end-end-radius:4px}
.ct-b-bot{justify-self:start;background:var(--card-2);border:1px solid var(--border);color:var(--ink);border-end-start-radius:4px}
.ct-typing{display:inline-flex;gap:4px;align-items:center}
.ct-typing i{display:block;inline-size:7px;block-size:7px;border-radius:50%;background:var(--muted)}
@keyframes ct-pop{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ct-dot{0%,80%,100%{opacity:.3;transform:none}40%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion:no-preference){
  .ct-b{animation:ct-pop .3s ease both}
  .ct-typing i{animation:ct-dot 1s ease-in-out infinite}
  .ct-typing i:nth-child(2){animation-delay:.15s}
  .ct-typing i:nth-child(3){animation-delay:.3s}
}
