/* TeakOutdoor Claude Final — Round 1–10 foundation, 2026-10-12.
   Additive layer; source of truth: approved Claude Design.
   Preserve existing internal PHP functionality pending template replacement. */
:root{
 --to-blue:#0866FF;--to-blue-hover:#075CE5;--to-soft-blue:#E7F3FF;
 --to-canvas:#F0F2F5;--to-divider:#E4E6EB;--to-divider-strong:#CED0D4;
 --to-text:#050505;--to-text-2:#65676B;--to-muted:#8A8D91;--to-wa:#25D366;
 --to-wa-hover:#1EBE5B;--to-error:#E41E3F;--to-shadow:0 8px 24px rgba(5,5,5,.08);
 --to-ink:var(--to-text);--to-body:var(--to-text-2);
 --to-border:var(--to-divider);--to-border-strong:var(--to-divider-strong);
 --to-surface:var(--to-canvas);--to-image-bg:var(--to-canvas);
 --to-emerald:var(--to-blue);--to-emerald-hover:var(--to-blue-hover);
 --to-green-700:var(--to-blue);--to-green-800:var(--to-blue-hover);
 --to-green-50:var(--to-soft-blue);--to-radius:6px;
 --to-section:80px;--to-focus:2px solid var(--to-blue);
 --to-font-head:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
 --to-font-body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
body{color:var(--to-text);font-family:var(--to-font-body);font-size:16px;line-height:1.5}
a{color:var(--to-blue)}a:hover{color:var(--to-blue-hover)}
h1,h2,h3,h4{font-weight:700;color:var(--to-text)}
h1{font-size:clamp(32px,4vw,56px);line-height:1.14}
h2{font-size:clamp(26px,3vw,36px);line-height:1.23}
h3{font-size:clamp(20px,2vw,24px);line-height:1.25}
.to-kicker,.to-home-eyebrow{color:var(--to-text-2);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.to-lead{color:var(--to-text-2);line-height:1.5}
.to-button,.to-home-solid-cta{min-height:44px;border-radius:6px;font-size:15px;font-weight:600}
.to-button--primary,.to-home-solid-cta{background:var(--to-blue);border-color:var(--to-blue);color:#fff}
.to-button--primary:hover,.to-home-solid-cta:hover{background:var(--to-blue-hover);border-color:var(--to-blue-hover);color:#fff}
.to-button--outline,.to-button--secondary{background:var(--to-soft-blue);border:1px solid transparent;color:var(--to-blue-hover)}
.to-button--outline:hover,.to-button--secondary:hover{box-shadow:inset 0 0 0 1px var(--to-blue);color:var(--to-blue-hover)}
.to-text-link,.to-home-link{color:var(--to-blue);text-decoration:none;font-weight:600}
.to-text-link:hover,.to-home-link:hover{color:var(--to-blue-hover)}
:focus-visible{outline:2px solid var(--to-blue);outline-offset:2px}
@media(max-width:767px){:root{--to-section:48px}h1{line-height:1.19}}
