:root{
  --brand-yellow:#f7ce52;
  --brand-dark:#161616;
  --grey:#848484;
  --grey-2:#7c7c7c;

  --radius-lg:16px;
  --radius-md:12px;
  --shadow:0 8px 30px rgba(0,0,0,.06);

  --page-bg:#fff;
  --panel:#ffffff;
  --panel-tint:#fff6cf;

  --header-h:64px;          /* mobile */
  --header-h-desktop:80px;  /* desktop */
}

/* Base */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: Helvetica, Arial, sans-serif;
  color:var(--brand-dark);
  background:var(--page-bg);
  line-height:1.55;
}

/* Typography */
h1,h2,h3,h4,h5,h6{
  text-transform:uppercase;
  font-weight:700;
  letter-spacing:.3px;
  margin:0 0 .6rem 0;
  color:var(--brand-dark);
}
h1{ font-size:56px; line-height:1.1; }
h2{ font-size:45px; line-height:1.15; }
h3{ font-size:35px; line-height:1.2; }
h4{ font-size:27px; line-height:1.25; }

/* Fluid scale for small screens */
h1{ font-size:clamp(32px,6vw,56px); }
h2{ font-size:clamp(26px,4.5vw,45px); }
h3{ font-size:clamp(22px,3.6vw,35px); }
h4{ font-size:clamp(18px,2.8vw,27px); }

.b1{ font-size:clamp(16px,2.6vw,20px); }
.b2{ font-size:clamp(15px,2.2vw,17px); }
.b3{ font-size:clamp(14px,2vw,15px); }

.text-grey{ color:var(--grey); }
.text-grey-2{ color:var(--grey-2); }

/* Links & buttons */
a{ color:var(--brand-dark); text-decoration:none; }
a:hover{ color:var(--brand-yellow); text-decoration:underline; }

.btn{
  border:none;
  border-radius:var(--radius-md);
  padding:.7rem 1.25rem;
  font-weight:700;
}
.btn-primary{
  background:var(--brand-yellow);
  color:var(--brand-dark);
}
.btn-primary:hover{
  background:var(--brand-dark);
  color:var(--brand-yellow);
}
.btn-outline-dark{
  background:transparent;
  border:2px solid var(--brand-dark);
  color:var(--brand-dark);
}
.btn-outline-dark:hover{
  background:var(--brand-dark);
  color:#fff;
}

/* Header */
.brand-logo{ height:40px; width:auto; }
.brand-name{ font-weight:800; letter-spacing:.5px; color:var(--brand-dark); }
.navbar .nav-link{ color:var(--brand-dark); }
.navbar .nav-link:hover{ color:var(--brand-yellow); }

/* Sections */
.section{ padding:clamp(28px,5vw,56px) 0; }
.section-yellow{ background:var(--panel-tint); }
.section-cta{ background:#fff; }

/* Hero */
.hero{ background:var(--panel-tint); border-bottom:1px solid #f3e7b0; }

/* Surfaces */
.media-frame{
  background:#fff; border:1px solid #eee; border-radius:var(--radius-lg);
  padding:12px; box-shadow:var(--shadow);
}
.feature{
  background:#fff; border:1px solid #f0f0f0; border-radius:var(--radius-lg);
  padding:20px; box-shadow:var(--shadow); height:100%;
}
.cta-card{
  background:#fff; border:1px solid #eee; border-radius:var(--radius-lg);
  padding:28px; box-shadow:var(--shadow);
}

/* Checklist */
.list-checked{ list-style:none; padding-left:0; margin:0; }
.list-checked li{
  position:relative; padding-left:28px; margin-bottom:.6rem;
}
.list-checked li::before{
  content:"✓"; position:absolute; left:0; top:0; width:20px; text-align:center;
  color:var(--brand-dark); background:var(--brand-yellow);
  border-radius:6px; font-weight:800; line-height:1; padding:2px 0;
}

/* Accordion */
.accordion-item{ border:1px solid #eee; border-radius:var(--radius-md); overflow:hidden; margin-bottom:12px; background:#fff; }
.accordion-button{
  text-transform:uppercase; font-weight:800; letter-spacing:.3px;
  background:#fff; padding:14px 18px;
}
.accordion-button:not(.collapsed){ color:var(--brand-dark); background:var(--brand-yellow); box-shadow:none; }
.accordion-body{ padding:16px 18px; }

/* Footer */
.site-footer{ border-top:1px solid #eee; background:#fff; padding:18px 0; }
.footer-link{ color:var(--brand-dark); margin-left:10px; }
.footer-link:hover{ color:var(--brand-yellow); }
.sep{ color:#cfcfcf; margin:0 6px; }

/* Mobile tweaks */
@media (max-width:575.98px){
  .btn{ width:100%; }
}

/* ===== Scroll-snap pages ===== */

/* Mobile: snap inside <main> */
@media (max-width:767.98px){
  html,body{ height:100%; }
  main.snap-container{
    scroll-snap-type:y mandatory;
    overflow-y:auto;
    height:calc(100vh - var(--header-h));
    scroll-padding-top:var(--header-h);
  }
  .snap{
    min-height:calc(100vh - var(--header-h));
    scroll-snap-align:start;
    display:flex; align-items:center; padding-block:24px;
  }
}

/* Desktop: snap on page scroll */
@media (min-width:992px){
  html,body{ height:100%; }
  html{
    scroll-snap-type:y mandatory;
    scroll-padding-top:var(--header-h-desktop);
  }
  main.snap-container{ height:auto; overflow:visible; }
  .snap{
    min-height:calc(100vh - var(--header-h-desktop));
    scroll-snap-align:start;
    display:flex; align-items:center; padding-block:0;
  }
}

/* Auto-height snap target (FAQ) */
.snap-auto{
  min-height:auto; display:block;
  scroll-snap-align:start;
  padding-block:var(--section-pad,56px);
}

/* Reduced motion: disable snap */
@media (prefers-reduced-motion:reduce){
  html{ scroll-snap-type:none !important; }
  main.snap-container{ scroll-snap-type:none !important; }
}