/**
 * MACHINE — Shared Design System
 * Single source of truth for all colours, shadows, and radii.
 * Used across: homepage, static pages, product pages.
 * Font: Quicksand | Palette: #F3F5F9 bg, #1E293B heading, #475569 muted, #FF9900 accent
 */

/* ── Design Tokens (CSS Custom Properties) ───────────────────────── */
:root {
  /* Brand */
  --brand:          #FF9900;
  --brand-dark:     #e68900;
  --brand-light:    rgba(255,153,0,.1);
  --brand-glow:     rgba(255,153,0,.35);

  /* Page backgrounds */
  --bg-page:        #F3F5F9;
  --bg-white:       #ffffff;
  --bg-card:        #ffffff;

  /* Typography */
  --text-heading:   #1E293B;
  --text-muted:     #475569;
  --text-soft:      #6B7280;
  --text-medium:    #4B5563;
  --text-dim:       #94a3b8;
  --text-accent:    #0369a1;

  /* Borders */
  --border:         #e5e7eb;
  --border-light:   #f1f5f9;
  --border-page:    #f3f4f6;

  /* Claymorphism */
  --shadow-clay:    15px 15px 30px #d1d9e6, -15px -15px 30px #fff,
                    inset 4px 4px 10px rgba(255,255,255,.8), inset -4px -4px 10px rgba(0,0,0,.03);
  --shadow-clay-hover: 20px 20px 40px #d1d9e6, -20px -20px 40px #fff,
                    inset 4px 4px 10px rgba(255,255,255,.8), inset -4px -4px 10px rgba(0,0,0,.03);
  --shadow-btn:     8px 8px 20px var(--brand-glow), -6px -6px 16px rgba(255,255,255,.8),
                    inset 3px 3px 8px rgba(255,255,255,.45), inset -3px -3px 8px rgba(0,0,0,.12);
  --shadow-btn-hover: 10px 10px 28px rgba(255,153,0,.4), -8px -8px 20px rgba(255,255,255,.9),
                    inset 3px 3px 8px rgba(255,255,255,.45), inset -3px -3px 8px rgba(0,0,0,.12);

  /* Radius */
  --radius-clay:    36px;
  --radius-xl:      1.5rem;   /* 24px */
  --radius-lg:      1rem;     /* 16px */
  --radius-md:      12px;
  --radius-sm:      8px;
  --radius-pill:    9999px;

  /* Header */
  --header-bg:      rgba(255,255,255,.92);
  --header-border:  rgba(0,0,0,.06);
  --header-height:  56px;

  /* Footer */
  --footer-bg:      #ffffff;
  --footer-text:    #475569;
  --footer-heading: #94a3b8;
  --footer-hover:   #FF9900;
  --footer-border:  #f1f5f9;

  /* Nav */
  --nav-text:       #475569;
  --nav-active:     #FF9900;
  --nav-active-bg:  rgba(255,153,0,.08);
  --nav-hover-bg:   rgba(0,0,0,.04);

  /* Logo */
  --logo-icon-bg:   #FF9900;
  --logo-text:      #1E293B;

  /* Disclosure box */
  --disclosure-bg:  #FFFBEB;
  --disclosure-border: #FDE68A;
  --disclosure-text:  #92400E;

  /* Font */
  --font-base: 'Quicksand', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ── Reset ───────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; overflow-x: hidden; font-size: 16px; }
body {
  background-color: var(--bg-page); color: var(--text-heading);
  font-family: var(--font-base);
  -webkit-font-smoothing: antialiased; overflow-x: hidden; line-height: 1.6;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; touch-action: manipulation; }
button { touch-action: manipulation; cursor: pointer; border: none; background: none; }
ul { list-style: none; }
*::selection { background: var(--brand); color: #fff; }

/* ── Typography ──────────────────────────────────────────────────── */
.text-sm   { font-size: .875rem; }
.text-base { font-size: 1rem; }
.text-lg   { font-size: 1.125rem; }
.text-xl   { font-size: 1.25rem; }
.text-2xl  { font-size: 1.5rem; }
.text-3xl  { font-size: 1.875rem; }
.text-4xl  { font-size: 2.25rem; }
.text-5xl  { font-size: 3rem; }
@media(min-width:768px)  { .md\:text-5xl { font-size: 3rem; } }
@media(min-width:1024px) { .lg\:text-6xl { font-size: 3.75rem; } }

.font-medium    { font-weight: 500; }
.font-semibold  { font-weight: 600; }
.font-bold      { font-weight: 700; }
.font-extrabold { font-weight: 800; }
.font-black     { font-weight: 900; }

.text-accent      { color: var(--text-accent); }
.text-amazon      { color: #B45309; }
.text-muted       { color: var(--text-muted); }
.text-heading     { color: var(--text-heading); }
.text-gray-medium { color: var(--text-medium); }
.text-gray-soft   { color: var(--text-soft); }

.text-center { text-align: center; }
.text-left   { text-align: left; }
.leading-tight   { line-height: 1.25; }
.leading-relaxed { line-height: 1.625; }
.tracking-tight  { letter-spacing: -.025em; }
.tracking-wide   { letter-spacing: .05em; }
.uppercase { text-transform: uppercase; }

/* ── Layout ──────────────────────────────────────────────────────── */
.container    { max-width: 80rem; margin: 0 auto; padding: 0 1.5rem; }
.container-md { max-width: 56rem; margin: 0 auto; padding: 0 1.5rem; }
.container-lg { max-width: 64rem; margin: 0 auto; padding: 0 1.5rem; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0; }

/* ── Grid ────────────────────────────────────────────────────────── */
.grid    { display: grid; }
.grid-2  { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.grid-3  { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
@media(max-width:767px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }

/* ── Flex ────────────────────────────────────────────────────────── */
.flex           { display: flex; }
.flex-col       { flex-direction: column; }
.items-center   { align-items: center; }
.items-start    { align-items: flex-start; }
.justify-center { justify-content: center; }
.justify-between{ justify-content: space-between; }
.gap-2  { gap: .5rem; }
.gap-3  { gap: .75rem; }
.gap-4  { gap: 1rem; }
.gap-6  { gap: 1.5rem; }
.gap-8  { gap: 2rem; }
.flex-wrap { flex-wrap: wrap; }
.shrink-0  { flex-shrink: 0; }

/* ── Spacing ─────────────────────────────────────────────────────── */
.py-3  { padding-top: .75rem; padding-bottom: .75rem; }
.py-4  { padding-top: 1rem; padding-bottom: 1rem; }
.py-6  { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8  { padding-top: 2rem; padding-bottom: 2rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.py-24 { padding-top: 6rem; padding-bottom: 6rem; }
.px-4  { padding-left: 1rem; padding-right: 1rem; }
.px-5  { padding-left: 1.25rem; padding-right: 1.25rem; }
.px-6  { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-8  { padding-left: 2rem; padding-right: 2rem; }
.px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }
.px-12 { padding-left: 3rem; padding-right: 3rem; }
.p-4   { padding: 1rem; }
.p-6   { padding: 1.5rem; }
.p-8   { padding: 2rem; }
.p-10  { padding: 2.5rem; }
.p-12  { padding: 3rem; }
.mb-1  { margin-bottom: .25rem; }
.mb-2  { margin-bottom: .5rem; }
.mb-3  { margin-bottom: .75rem; }
.mb-4  { margin-bottom: 1rem; }
.mb-6  { margin-bottom: 1.5rem; }
.mb-8  { margin-bottom: 2rem; }
.mb-10 { margin-bottom: 2.5rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }
.mb-20 { margin-bottom: 5rem; }
.mt-1  { margin-top: .25rem; }
.mt-4  { margin-top: 1rem; }
.mt-6  { margin-top: 1.5rem; }
.mt-8  { margin-top: 2rem; }
.mt-16 { margin-top: 4rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.mx-4  { margin-left: 1rem; margin-right: 1rem; }

/* ── Position ────────────────────────────────────────────────────── */
.relative { position: relative; }
.absolute { position: absolute; }
.fixed    { position: fixed; }
.inset-0  { top:0;right:0;bottom:0;left:0; }
.z-0  { z-index: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-50 { z-index: 50; }
.z-bg { z-index: -1; }

/* ── Borders & Radius ────────────────────────────────────────────── */
.rounded-full  { border-radius: var(--radius-pill); }
.rounded-2xl   { border-radius: var(--radius-lg); }
.rounded-3xl   { border-radius: var(--radius-xl); }
.rounded-4xl   { border-radius: var(--radius-clay); }
.border        { border: 1px solid var(--border); }
.border-t      { border-top: 1px solid var(--border); }
.border-b-2    { border-bottom: 2px solid var(--border-page); }
.border-white  { border-color: rgba(255,255,255,0.8); }
.border-accent { border: 6px solid var(--text-accent); }
.overflow-hidden { overflow: hidden; }
.overflow-x-auto { overflow-x: auto; }

/* ── Backgrounds ─────────────────────────────────────────────────── */
.bg-white    { background-color: #fff; }
.bg-white-50 { background: rgba(255,255,255,0.5); }
.bg-white-60 { background: rgba(255,255,255,0.6); }
.bg-white-80 { background: rgba(255,255,255,0.8); }
.bg-page     { background-color: #F3F5F9; }
.bg-red-50   { background-color: #fef2f2; }
.bg-red-100  { background-color: #fee2e2; }
.bg-blue-50  { background-color: #eff6ff; }
.bg-blue-50-half { background-color: rgba(239,246,255,0.5); }
.bg-pastel-blue   { background-color: #E3F2FD; }
.bg-pastel-pink   { background-color: #FCE7F3; }
.bg-pastel-mint   { background-color: #D1FAE5; }
.bg-pastel-purple { background-color: #F3E8FF; }
.bg-pastel-yellow { background-color: #FEF3C7; }
.bg-pastel-blue-40 { background-color: rgba(227,242,253,0.4); }

.grad-pink-blue   { background: linear-gradient(to right, #FCE7F3, #E3F2FD); }
.grad-blue-purple { background: linear-gradient(135deg, #E3F2FD, #F3E8FF); }
.grad-pink-purple { background: linear-gradient(135deg, #FCE7F3, #F3E8FF); }

/* ── Display ─────────────────────────────────────────────────────── */
.inline-block { display: inline-block; }
.block { display: block; }
.inline-flex { display: inline-flex; }
.hidden { display: none; }
.w-full { width: 100%; }
.w-max  { width: max-content; }
.max-w-sm  { max-width: 24rem; }
.max-w-3xl { max-width: 48rem; }
.max-w-4xl { max-width: 56rem; }
.max-w-5xl { max-width: 64rem; }
.max-w-7xl { max-width: 80rem; }
.min-w-700 { min-width: 700px; }
.pointer-events-none { pointer-events: none; }
.cursor-pointer { cursor: pointer; }
.list-none { list-style: none; }

/* ── Icons ───────────────────────────────────────────────────────── */
.icon-sm  { width: 1rem;   height: 1rem; }
.icon-md  { width: 1.25rem;height: 1.25rem; }
.icon-lg  { width: 1.5rem; height: 1.5rem; }
.icon-xl  { width: 2rem;   height: 2rem; }
.icon-2xl { width: 2.5rem; height: 2.5rem; }
.icon-4xl { width: 4rem;   height: 4rem; }
.icon-10  { width: 2.5rem; height: 2.5rem; }
.icon-12  { width: 3rem;   height: 3rem; }
.icon-48  { width: 12rem;  height: 12rem; }
.fill-current { fill: currentColor; }
.icon { display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
.icon-fill { display:inline-block;vertical-align:middle;fill:currentColor;stroke:none; }

/* ── Claymorphism ────────────────────────────────────────────────── */
.clay {
  background: var(--bg-card); border-radius: var(--radius-clay);
  box-shadow: var(--shadow-clay);
  transition: transform .3s cubic-bezier(.25,.8,.25,1), box-shadow .3s cubic-bezier(.25,.8,.25,1);
  will-change: transform;
}
@media(hover:hover){
  .clay:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-clay-hover);
  }
}

/* ── Buttons ─────────────────────────────────────────────────────── */
.btn-amazon {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--brand); border-radius: var(--radius-pill); color: #111; font-weight: 800;
  font-size: 1.125rem; padding: 1.1rem 2.5rem; gap: .75rem;
  box-shadow: var(--shadow-btn);
  transition: transform .2s ease, box-shadow .2s ease;
  text-decoration: none; letter-spacing: -.01em;
}
@media(hover:hover){
  .btn-amazon:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow: var(--shadow-btn-hover);
  }
}
@media(max-width:640px){ .btn-amazon { width: 100%; font-size: 1.05rem; padding: 1.1rem 1.5rem; } }

/* ── Glass ───────────────────────────────────────────────────────── */
.glass {
  background: rgba(255,255,255,.7); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border: 2px solid rgba(255,255,255,.9); border-radius: 999px;
}

/* ── Image Box ───────────────────────────────────────────────────── */
.img-box {
  background: var(--bg-card); border-radius: var(--radius-clay);
  display: flex; align-items: center; justify-content: center;
  padding: 1.5rem; overflow: hidden;
}
.img-box img { width: 100%; height: 100%; object-fit: contain; transition: transform .5s ease; will-change: transform; }
@media(hover:hover){ .img-box:hover img { transform: scale(1.05); } }

/* ── Blobs ───────────────────────────────────────────────────────── */
.blob { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; will-change: transform; contain: strict; }

/* ── Details / Accordion ─────────────────────────────────────────── */
details summary { list-style: none; }
details summary::-webkit-details-marker { display: none; }
details[open] .chevron { transform: rotate(180deg); }
.chevron { transition: transform .25s ease; flex-shrink: 0; }

/* ── Tables ──────────────────────────────────────────────────────── */
table { width: 100%; border-collapse: collapse; }
th, td { padding: 1.25rem 1.5rem; text-align: left; }
tbody tr:not(:last-child) td { border-bottom: 1px solid #f3f4f6; }
tbody tr:hover { background: #f9fafb; }
@media(max-width:767px){ th, td { padding: .875rem 1rem; font-size: .9rem; } }

/* ── Animations ──────────────────────────────────────────────────── */
@keyframes float { 0%,100%{transform:translateY(0) rotate(0deg)} 50%{transform:translateY(-15px) rotate(2deg)} }
@keyframes bounce-subtle { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
@keyframes ping { 75%,100%{transform:scale(2);opacity:0} }
.anim-float-slow { animation: float 8s ease-in-out infinite; will-change: transform; }
.anim-float-fast { animation: float 5s ease-in-out infinite reverse; will-change: transform; }
.anim-bounce     { animation: bounce-subtle 3s ease-in-out infinite; will-change: transform; }
.anim-ping       { animation: ping 1.5s cubic-bezier(0,0,.2,1) infinite; will-change: transform, opacity; }
@media(prefers-reduced-motion:reduce){ .anim-float-slow,.anim-float-fast,.anim-bounce,.anim-ping{animation:none;will-change:auto} }

/* ── Scrollbar ───────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #F3F5F9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; border: 2px solid #F3F5F9; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ── Grids (component) ───────────────────────────────────────────── */
.hero-grid { display:grid;grid-template-columns:1fr;gap:3rem;align-items:center; }
@media(min-width:1024px){ .hero-grid{grid-template-columns:1fr 1fr} .hero-grid>div:last-child{order:0} }
@media(max-width:1023px){ .hero-grid>div:last-child{order:-1} .hero-grid>div:first-child{order:0} }

.testimonial-grid { display:grid;grid-template-columns:1fr;gap:1.5rem; }
@media(min-width:768px){ .testimonial-grid{grid-template-columns:1fr 1fr} .testimonial-stagger{margin-top:2rem} }
@media(min-width:1024px){ .testimonial-grid{grid-template-columns:repeat(4,1fr)} }

.pain-grid { display:grid;grid-template-columns:1fr;gap:1rem; }
@media(min-width:768px){ .pain-grid{grid-template-columns:1fr 1fr} }
@media(min-width:1024px){ .pain-grid{grid-template-columns:repeat(3,1fr)} }

.explain-grid { display:grid;grid-template-columns:1fr;gap:1.5rem;margin-bottom:3rem; }
@media(min-width:768px){ .explain-grid{grid-template-columns:1fr 1fr} }
@media(min-width:1024px){ .explain-grid{grid-template-columns:repeat(3,1fr)} }

.gallery-grid { display:grid;grid-template-columns:1fr;gap:1rem; }
@media(min-width:768px){ .gallery-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:260px} .gallery-grid .g-large{grid-column:span 2;grid-row:span 2} .gallery-grid .g-wide{grid-column:span 2} }
@media(min-width:1024px){ .gallery-grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:280px} }
@media(max-width:767px){ .gallery-grid .img-box{min-height:220px} }

.two-col { display:grid;grid-template-columns:1fr;gap:2rem; }
@media(min-width:1024px){ .two-col{grid-template-columns:1fr 1fr} }

.specs-row { display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem; }
@media(min-width:1024px){ .specs-row{flex-direction:row;align-items:center;justify-content:space-between} }
.specs-row span { max-width:100%;white-space:normal;word-break:break-word; }

/* ── Urgency Bar ─────────────────────────────────────────────────── */
.urgency-bar {
  margin:1rem;padding:.75rem 1.5rem;background:rgba(255,255,255,.75);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:2px solid rgba(255,255,255,.9);border-radius:999px;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:.5rem .75rem;font-size:.875rem;font-weight:700;color:#1E293B;
  position:relative;z-index:50;
}
@media(max-width:640px){ .urgency-bar{border-radius:1.5rem;margin:.75rem;padding:.75rem 1rem;font-size:.8rem} }
.urgency-dot-wrap { position:relative;display:inline-flex;width:.75rem;height:.75rem; }
.urgency-dot-ping { position:absolute;inset:0;border-radius:50%;background:#fca5a5;animation:ping 1.5s cubic-bezier(0,0,.2,1) infinite;opacity:.75; }
.urgency-dot      { position:relative;width:.75rem;height:.75rem;border-radius:50%;background:#dc2626; }

/* ── Star Badge ──────────────────────────────────────────────────── */
.star-badge {
  position:absolute;bottom:-1.5rem;left:50%;transform:translateX(-50%);
  background:rgba(255,255,255,.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:2px solid rgba(255,255,255,.9);border-radius:999px;
  padding:.875rem 1.5rem;display:flex;align-items:center;gap:.75rem;
  box-shadow:0 8px 32px rgba(0,0,0,.1);animation:float 5s ease-in-out infinite reverse;
  z-index:20;white-space:nowrap;
}
@media(min-width:1024px){ .star-badge{left:auto;right:-1.5rem;transform:none;bottom:-1.5rem} }

/* ── Scroll Progress & CTA ───────────────────────────────────────── */
#scroll-progress { position:fixed;top:0;left:0;height:3px;width:0%;background:linear-gradient(90deg,#FF9900,#ec4899);z-index:9999;transition:width .1s linear; }
#scroll-top { position:fixed;bottom:5rem;right:1.5rem;width:3rem;height:3rem;border-radius:50%;background:#FF9900;color:#111;border:none;display:none;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(255,153,0,.4);z-index:9998;cursor:pointer;transition:transform .2s ease,opacity .2s ease; }
#scroll-top:hover { transform:scale(1.1); }
#scroll-top.visible { display:flex; }
#sticky-cta { position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid #e5e7eb;padding:.75rem 1rem;z-index:9997;display:none;justify-content:center;align-items:center; }
#sticky-cta.visible { display:flex; }
@media(min-width:1024px){ #sticky-cta{display:none!important} }

/* ── Header ──────────────────────────────────────────────────────── */
.lp-header{position:sticky;top:0;z-index:1000;background:var(--header-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--header-border);padding:.625rem 1.5rem;transition:box-shadow .2s ease}
.lp-header.scrolled{box-shadow:0 2px 20px rgba(0,0,0,.08)}
.lp-header__inner{max-width:80rem;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.lp-logo{display:flex;align-items:center;gap:.5rem;text-decoration:none;flex-shrink:0}
.lp-logo svg{border-radius:var(--radius-sm)}
.lp-logo span{font-size:1.125rem;font-weight:800;color:var(--logo-text);letter-spacing:-.025em}
.lp-nav{display:flex;align-items:center;gap:.25rem}
.lp-nav a{padding:.375rem .75rem;font-size:.8rem;font-weight:700;color:var(--nav-text);border-radius:var(--radius-pill);text-decoration:none;transition:all .2s}
.lp-nav a:hover{color:var(--text-heading);background:var(--nav-hover-bg)}
.lp-nav a.active{color:var(--nav-active);background:var(--nav-active-bg)}
.lp-nav-toggle{display:none;padding:.375rem;color:var(--logo-text);border:none;background:none;cursor:pointer;border-radius:var(--radius-sm);transition:background .2s}
.lp-nav-toggle:hover{background:rgba(0,0,0,.05)}
.lp-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:998;opacity:0;pointer-events:none;transition:opacity .3s}
.lp-nav-overlay.open{opacity:1;pointer-events:auto}
@media(max-width:768px){
  .lp-nav-toggle{display:flex;align-items:center;justify-content:center}
  .lp-nav{position:fixed;top:0;right:-100%;width:280px;height:100vh;height:100dvh;background:var(--bg-white);box-shadow:-8px 0 30px rgba(0,0,0,.12);padding:4.5rem 1.5rem 2rem;flex-direction:column;align-items:stretch;gap:.25rem;transition:right .3s cubic-bezier(.4,0,.2,1);z-index:999;overflow-y:auto}
  .lp-nav.open{right:0}
  .lp-nav a{padding:.875rem 1rem;font-size:1rem;border-radius:var(--radius-md);display:block}
}
@media(max-width:640px){.lp-nav{gap:0} .lp-header{padding:.5rem 1rem} .lp-logo span{font-size:.95rem}}

/* ── Footer Links ────────────────────────────────────────────────── */
.lp-footer-links{max-width:64rem;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2rem;margin-bottom:1.5rem}
.lp-footer-links a{font-size:.8rem;font-weight:700;color:var(--text-accent);text-decoration:none}
.lp-footer-links a:hover{text-decoration:underline}

/* ── Site Footer (shared between homepage partials & template) ───── */
.site-footer{background:var(--footer-bg);color:var(--footer-text);padding:48px 1.5rem 1.5rem;border-top:1px solid var(--footer-border);position:relative;z-index:10}
.site-footer__inner{max-width:960px;margin:0 auto}
.site-footer__grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;margin-bottom:2rem}
.site-footer__brand{display:flex;flex-direction:column;gap:.75rem}
.site-footer__logo{display:inline-flex;align-items:center;gap:.625rem;text-decoration:none;color:var(--logo-text);font-family:var(--font-base);font-weight:800;font-size:1.15rem}
.site-footer__logo:hover{opacity:.8}
.site-footer__tagline{font-size:.875rem;line-height:1.7;color:var(--footer-text);max-width:340px;font-weight:500}
.site-footer__links-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.site-footer__links-col{display:flex;flex-direction:column;gap:.5rem}
.site-footer__links-col h4{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--footer-heading);margin-bottom:.25rem}
.site-footer__links-col a{font-size:.875rem;font-weight:600;color:var(--footer-text);text-decoration:none;transition:color .2s}
.site-footer__links-col a:hover{color:var(--footer-hover)}
.site-footer__disclosure{display:flex;align-items:flex-start;gap:.75rem;background:var(--disclosure-bg);border:1px solid var(--disclosure-border);border-radius:var(--radius-md);padding:1rem 1.25rem;margin-bottom:1.5rem;color:var(--disclosure-text);font-size:.8125rem;font-weight:600;line-height:1.7}
.site-footer__disclosure p{margin:0}
.site-footer__bottom{padding-top:1rem;border-top:1px solid var(--footer-border);text-align:center}
.site-footer__bottom p{font-size:.75rem;font-weight:600;color:var(--text-dim);margin:0}
@media(max-width:768px){.site-footer__grid{grid-template-columns:1fr;gap:2rem}.site-footer__links-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.site-footer{padding:2rem 1rem 1rem}.site-footer__links-grid{grid-template-columns:1fr;gap:1.5rem}.site-footer__disclosure{flex-direction:column;gap:.5rem}}

/* ── Mobile responsive overrides ─────────────────────────────────── */
@media(max-width:640px){
  .py-24{padding-top:3.5rem;padding-bottom:3.5rem} .py-20{padding-top:3rem;padding-bottom:3rem}
  .px-6{padding-left:1rem;padding-right:1rem} .p-10{padding:1.5rem} .p-12{padding:1.75rem}
  .hero-grid{gap:2rem} .hero-grid>div:first-child{padding-bottom:2rem} .hero-grid .img-box{padding:1.5rem}
  .star-badge{font-size:.875rem;padding:.75rem 1.25rem;gap:.5rem} .star-badge .icon-fill{width:16px;height:16px}
  #crossroads .clay{padding:2.5rem 1.5rem!important} #crossroads h2{font-size:1.75rem!important}
  .two-col .clay{padding:1.5rem} .grad-pink-blue.p-10{padding:1.5rem}
  .text-4xl{font-size:1.75rem} .text-3xl{font-size:1.5rem} .text-2xl{font-size:1.25rem}
  .w-max{width:auto;white-space:normal} body{padding-bottom:4rem}
}
