
:root{
  --bg:#f6f8fb;
  --surface:#ffffff;
  --surface-2:#f2f7f3;
  --text:#16324a;
  --muted:#5f7385;
  --line:#d9e4dc;
  --primary:#00c853;
  --primary-dark:#009a43;
  --accent:#f25c1f;
  --accent-dark:#d94f18;
  --brand-dark:#16324a;
  --shadow:0 18px 50px rgba(22,50,74,.08);
  --radius:22px;
  --container:min(1360px, calc(100vw - 2rem));
  --header-h:84px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top right, rgba(0,202,0,.08), transparent 24%),
    radial-gradient(circle at left 20%, rgba(253,50,0,.07), transparent 18%),
    var(--bg);
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit}
.container{width:var(--container);margin:0 auto}
.section{padding:5.5rem 0}
.section-sm{padding:3.5rem 0}
.eyebrow{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.5rem .9rem;border-radius:999px;
  background:rgba(0,200,83,.10);color:var(--primary-dark);
  font-weight:700;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase
}
.section-head{max-width:760px;margin-bottom:2rem}
.section-head h2{font-size:clamp(2rem,4vw,3.4rem);line-height:1.05;margin:.9rem 0 1rem}
.section-head p{font-size:1.05rem;color:var(--muted);margin:0}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:1rem;top:1rem;z-index:999;background:#fff;padding:.75rem 1rem;border-radius:10px}
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(217,228,220,.95)
}
.site-header .inner{
  min-height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;gap:1rem
}
.brand{display:flex;align-items:center;gap:1rem;font-weight:800}
.brand img{width:210px;max-width:50vw}
.brand small{display:block;color:var(--muted);font-weight:600;font-size:.8rem}
.nav{
  display:flex;align-items:center;gap:1.4rem
}
.nav-links{display:flex;gap:1.3rem;align-items:center}
.nav-links a{color:var(--brand-dark);font-weight:700}
.nav-links a:hover{color:var(--accent)}
.menu-toggle{
  display:none;border:1px solid var(--line);background:#fff;border-radius:14px;
  width:48px;height:48px;align-items:center;justify-content:center;cursor:pointer
}
.menu-toggle span,.menu-toggle::before,.menu-toggle::after{
  content:"";display:block;width:20px;height:2px;background:#1d241e;border-radius:2px;position:absolute;
}
.menu-toggle span{transform:translateY(0)}
.menu-toggle::before{transform:translateY(-6px)}
.menu-toggle::after{transform:translateY(6px)}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  padding:1rem 1.3rem;border-radius:999px;border:1px solid transparent;
  font-weight:700;transition:.25s ease;cursor:pointer
}
.btn-primary{background:linear-gradient(135deg,var(--primary),#2ed46d);color:#fff;box-shadow:0 12px 30px rgba(0,154,67,.22)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 18px 36px rgba(0,154,67,.24)}
.btn-outline{background:#fff;border-color:var(--line)}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);background:#fff7f2}
.hero{
  position:relative;overflow:hidden;background:#edf3f8
}
.hero-banners{
  min-height:auto
}
.hero-slide{
  position:absolute;inset:0;opacity:0;transition:opacity 700ms ease
}
.hero-slide.active{opacity:1;position:relative}
.hero-slide img{width:100%;height:auto;display:block}
.hero-banner-controls{
  position:absolute;left:0;right:0;bottom:1.1rem;z-index:3;display:flex;justify-content:center
}
.hero-intro{
  padding:2.5rem 0 2rem
}
.intro-box{
  align-items:center
}
.intro-box h1{
  font-size:clamp(2rem,4.5vw,3.8rem);line-height:1.02;margin:.9rem 0 1rem;letter-spacing:-.03em;color:var(--brand-dark)
}
.intro-box p{
  font-size:1.05rem;max-width:700px;color:var(--muted);margin:0
}
.intro-actions{
  display:flex;gap:1rem;flex-wrap:wrap;align-items:center
}
.slider-dots{display:flex;gap:.65rem;margin-top:1.4rem}
.slider-dots button{
  width:12px;height:12px;border-radius:999px;border:none;background:rgba(255,255,255,.35);cursor:pointer
}
.slider-dots button.active{background:#fff}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;box-shadow:var(--shadow)
}
.icon-badge{
  width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg, rgba(0,200,83,.14), rgba(242,92,31,.12));
  display:grid;place-items:center;font-size:1.4rem;margin-bottom:1rem
}
.card h3{margin:.15rem 0 .55rem;font-size:1.2rem}
.card p{margin:0;color:var(--muted)}
.product-card{
  overflow:hidden;padding:0
}
.product-card .thumb{aspect-ratio:1/1;background:#fff}
.product-card .thumb img{width:100%;height:100%;object-fit:cover}
.product-card .body{padding:1.25rem}
.product-card .meta{display:flex;gap:.5rem;flex-wrap:wrap;margin:.7rem 0 1rem}
.tag{
  font-size:.78rem;background:var(--surface-2);padding:.35rem .65rem;border-radius:999px;border:1px solid var(--line);color:#325034;font-weight:700
}
.price{font-size:1.45rem;font-weight:800;margin:.6rem 0}
.price small{font-size:.85rem;font-weight:600;color:var(--muted)}
.band{
  background:linear-gradient(135deg, var(--brand-dark), #244f74);color:#fff;border-radius:28px;padding:2rem;display:grid;grid-template-columns:1.2fr .8fr;gap:1.5rem;align-items:center
}
.band p{color:rgba(255,255,255,.76)}
.check-list{display:grid;gap:.8rem}
.check-list li{list-style:none;position:relative;padding-left:1.7rem;color:var(--muted)}
.check-list li::before{
  content:"";position:absolute;left:0;top:.55rem;width:10px;height:10px;border-radius:999px;background:var(--primary)
}
.steps{counter-reset:step}
.step{
  position:relative;padding-left:4rem
}
.step::before{
  counter-increment:step;content:counter(step);
  position:absolute;left:0;top:0;width:48px;height:48px;border-radius:16px;
  background:linear-gradient(135deg,var(--primary), var(--accent));color:#fff;display:grid;place-items:center;font-weight:800;box-shadow:0 12px 28px rgba(22,50,74,.14)
}
.faq{
  display:grid;gap:1rem
}
.faq-item{
  border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden
}
.faq-item summary{
  list-style:none;padding:1.1rem 1.25rem;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item p{padding:0 1.25rem 1.25rem;margin:0;color:var(--muted)}
.cta-box{
  background:linear-gradient(135deg, rgba(0,200,83,.12), rgba(242,92,31,.10));
  border:1px solid rgba(0,200,83,.18);
  border-radius:30px;padding:2rem;
  display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap
}
.page-hero{
  padding:4rem 0 2.5rem;background:linear-gradient(180deg, rgba(0,200,83,.08), transparent)
}
.page-hero h1{font-size:clamp(2.4rem,5vw,4.2rem);margin:.8rem 0 .7rem}
.form-wrap iframe{border-radius:22px;background:#fff;box-shadow:var(--shadow)}
.site-footer{
  padding:2.4rem 0;border-top:1px solid var(--line);color:var(--muted)
}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center}
.breadcrumbs{color:var(--muted);font-size:.95rem}
.notice{font-size:.88rem;color:var(--muted)}
@media (max-width: 980px){
  .band,.grid-3,.grid-2,.footer-grid{grid-template-columns:1fr}
  .hero-meta{max-width:420px}
  .nav-links{
    position:fixed;inset:calc(var(--header-h) + 6px) 1rem auto 1rem;background:rgba(255,255,255,.98);border:1px solid var(--line);
    border-radius:24px;padding:1rem;display:none;flex-direction:column;align-items:flex-start;box-shadow:var(--shadow)
  }
  .nav-links.open{display:flex}
  .menu-toggle{display:inline-flex;position:relative}
}
@media (max-width: 720px){
  .section{padding:4rem 0}
  .hero-banner-controls{bottom:.6rem}
  .intro-actions{flex-direction:column;align-items:stretch}
  .intro-actions .btn{width:100%}
  .brand img{width:170px}
}

.local-band{grid-template-columns:1.15fr .85fr}
.local-list li{color:rgba(255,255,255,.82)}
