/* ===== RESET & BASE ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;color:#1a2e1a;background:#fcfef9;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
input,select{font-family:inherit}

/* ===== VARIABLES ===== */
:root{
    --green-50:#f0faf3;
    --green-100:#ddf5e4;
    --green-200:#bdeacc;
    --green-300:#8dd9a6;
    --green-400:#6BCB8B;
    --green-500:#4CAF7D;
    --green-600:#3a9468;
    --green-700:#2d7854;
    --green-800:#1f5c3e;
    --green-900:#153d2a;
    --sage:#A8C5A0;
    --mint:#A8E6CF;
    --white:#ffffff;
    --gray-50:#f8faf8;
    --gray-100:#f0f4f0;
    --gray-200:#e2e8e2;
    --gray-300:#c4cfc4;
    --gray-400:#94a894;
    --gray-500:#6b7f6b;
    --gray-600:#4a5f4a;
    --dark:#1a2e1a;
    --radius:16px;
    --radius-sm:10px;
    --radius-lg:24px;
    --shadow-sm:0 2px 8px rgba(26,46,26,.06);
    --shadow:0 4px 24px rgba(26,46,26,.08);
    --shadow-lg:0 12px 48px rgba(26,46,26,.12);
    --transition:all .3s cubic-bezier(.4,0,.2,1);
}

/* ===== UTILITY ===== */
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.grad{background:linear-gradient(135deg,var(--green-400),var(--green-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.tag{display:inline-block;background:var(--green-100);color:var(--green-600);font-size:.8rem;font-weight:600;padding:6px 16px;border-radius:50px;margin-bottom:16px;letter-spacing:.03em;text-transform:uppercase}
.badge{display:inline-block;background:linear-gradient(135deg,var(--green-400),var(--green-500));color:#fff;font-size:.8rem;font-weight:600;padding:8px 20px;border-radius:50px;margin-bottom:24px}

.section-head{text-align:center;max-width:640px;margin:0 auto 56px}
.section-head h2{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;line-height:1.2;margin-bottom:16px;color:var(--dark)}
.section-head p{font-size:1.05rem;color:var(--gray-500);line-height:1.7}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.95rem;border-radius:12px;padding:12px 28px;transition:var(--transition);white-space:nowrap}
.btn--primary{background:linear-gradient(135deg,var(--green-400),var(--green-500));color:#fff;box-shadow:0 4px 16px rgba(107,203,139,.35)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(107,203,139,.45)}
.btn--outline{border:2px solid var(--green-300);color:var(--green-600)}
.btn--outline:hover{background:var(--green-50);transform:translateY(-2px)}
.btn--ghost{color:var(--green-600);padding:12px 20px}
.btn--ghost:hover{background:var(--green-50);border-radius:12px}
.btn--lg{padding:16px 36px;font-size:1rem;border-radius:14px}
.btn--block{width:100%;justify-content:center}

/* ===== HEADER ===== */
.header{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 0;transition:var(--transition)}
.header.scrolled{background:rgba(252,254,249,.92);backdrop-filter:blur(20px);box-shadow:var(--shadow-sm);padding:10px 0}
.header__inner{display:flex;align-items:center;justify-content:space-between}

.logo{display:flex;align-items:center;gap:10px}
.logo__text{font-size:1.3rem;font-weight:300;color:var(--dark)}
.logo__text strong{font-weight:800}

.nav{display:flex;gap:32px}
.nav__link{font-size:.9rem;font-weight:500;color:var(--gray-500);transition:var(--transition);position:relative}
.nav__link:hover{color:var(--green-500)}
.nav__link::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--green-400);transition:var(--transition)}
.nav__link:hover::after{width:100%}

.header__cta{font-size:.85rem;padding:10px 24px}

.burger{display:none;flex-direction:column;gap:5px;width:28px}
.burger span{height:2px;background:var(--dark);border-radius:2px;transition:var(--transition)}

@media(max-width:900px){
    .nav{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(252,254,249,.98);backdrop-filter:blur(20px);flex-direction:column;align-items:center;justify-content:center;gap:24px;z-index:998}
    .nav.open{display:flex}
    .nav.open .nav__link{font-size:1.2rem}
    .header__cta{display:none}
    .burger{display:flex;z-index:999}
    .burger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
    .burger.open span:nth-child(2){opacity:0}
    .burger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
}

/* ===== HERO ===== */
.hero{padding:140px 0 80px;position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:center}
.hero__bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero__circle{position:absolute;border-radius:50%;opacity:.15}
.hero__circle--1{width:600px;height:600px;background:radial-gradient(circle,var(--green-300),transparent 70%);top:-100px;right:-150px}
.hero__circle--2{width:400px;height:400px;background:radial-gradient(circle,var(--mint),transparent 70%);bottom:0;left:-100px}
.hero__circle--3{width:300px;height:300px;background:radial-gradient(circle,var(--sage),transparent 70%);top:40%;left:30%}

.hero__inner{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.hero__content h1{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:900;line-height:1.1;margin-bottom:20px;color:var(--dark)}
.hero__sub{font-size:1.1rem;color:var(--gray-500);line-height:1.7;margin-bottom:32px;max-width:520px}
.hero__actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:48px}

.hero__metrics{display:flex;gap:24px;flex-wrap:wrap}
.metric{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--white);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);border:1px solid var(--green-100)}
.metric div{display:flex;flex-direction:column}
.metric strong{font-size:.85rem;font-weight:700;color:var(--dark)}
.metric span{font-size:.72rem;color:var(--gray-400)}

.hero__image{position:relative;display:flex;justify-content:center}
.hero__image img{filter:drop-shadow(0 20px 60px rgba(26,46,26,.15));animation:float 6s ease-in-out infinite}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}

@media(max-width:900px){
    .hero{padding:120px 0 60px;min-height:auto}
    .hero__inner{grid-template-columns:1fr;text-align:center}
    .hero__sub{margin-left:auto;margin-right:auto}
    .hero__actions{justify-content:center}
    .hero__metrics{justify-content:center}
    .hero__image{order:-1}
    .hero__image img{max-width:340px}
}

/* ===== BRANDS ===== */
.brands{padding:40px 0;border-top:1px solid var(--green-100);border-bottom:1px solid var(--green-100);background:var(--green-50)}
.brands__label{text-align:center;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-400);margin-bottom:20px;font-weight:600}
.brands__row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:32px 48px}
.brands__row span{font-size:1.1rem;font-weight:700;color:var(--gray-300);letter-spacing:.02em}

/* ===== FEATURES ===== */
.features{padding:100px 0}
.features__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.fcard{background:var(--white);border-radius:var(--radius);padding:32px 28px;border:1px solid var(--green-100);transition:var(--transition)}
.fcard:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--green-300)}
.fcard__icon{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--green-50),var(--green-100));display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--green-500)}
.fcard h3{font-size:1.05rem;font-weight:700;margin-bottom:10px;color:var(--dark)}
.fcard p{font-size:.9rem;color:var(--gray-500);line-height:1.6}

@media(max-width:1024px){.features__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.features__grid{grid-template-columns:1fr}}

/* ===== LIFESTYLE ===== */
.lifestyle{padding:100px 0;background:var(--green-50)}
.lifestyle__inner{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center}
.lifestyle__img{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.lifestyle__img img{width:100%;object-fit:cover}
.lifestyle__content .tag{margin-bottom:16px}
.lifestyle__content h2{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:800;line-height:1.2;margin-bottom:20px}
.lifestyle__content p{color:var(--gray-500);line-height:1.7;margin-bottom:36px}
.lifestyle__stats{display:flex;gap:32px;flex-wrap:wrap}
.lstat{display:flex;flex-direction:column}
.lstat strong{font-size:1.4rem;font-weight:800;color:var(--green-600)}
.lstat span{font-size:.8rem;color:var(--gray-400)}

@media(max-width:900px){
    .lifestyle__inner{grid-template-columns:1fr}
    .lifestyle__img{order:-1}
}

/* ===== GALLERY ===== */
.gallery{padding:100px 0}
.gallery__image{margin-bottom:40px;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}
.gallery__labels{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;text-align:center}
.glabel h4{font-size:1rem;font-weight:700;margin-bottom:6px;color:var(--dark)}
.glabel p{font-size:.88rem;color:var(--gray-500)}

@media(max-width:600px){.gallery__labels{grid-template-columns:1fr;gap:20px}}

/* ===== COLORS ===== */
.colors{padding:80px 0;background:var(--green-50)}
.colors__image{margin-bottom:32px;border-radius:var(--radius-lg);overflow:hidden}
.colors__options{display:flex;justify-content:center;gap:16px;margin-bottom:16px}
.color-dot{width:36px;height:36px;border-radius:50%;border:3px solid transparent;transition:var(--transition);cursor:pointer}
.color-dot--active,.color-dot:hover{border-color:var(--green-400);transform:scale(1.15)}
.colors__names{display:flex;justify-content:center;gap:32px;font-size:.85rem;color:var(--gray-400);font-weight:500}

@media(max-width:600px){.colors__names{flex-wrap:wrap;gap:16px}}

/* ===== SPECS ===== */
.specs{padding:100px 0}
.specs__inner{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;align-items:start}
.specs__content h2{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:800;line-height:1.2;margin-bottom:16px}
.specs__content p{color:var(--gray-500);line-height:1.7}
.specs__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.spec-item{background:var(--white);border:1px solid var(--green-100);border-radius:var(--radius-sm);padding:20px 24px;transition:var(--transition)}
.spec-item:hover{border-color:var(--green-300);box-shadow:var(--shadow-sm)}
.spec-item__label{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-400);font-weight:600;display:block;margin-bottom:4px}
.spec-item strong{font-size:1.05rem;font-weight:700;color:var(--dark)}

@media(max-width:900px){
    .specs__inner{grid-template-columns:1fr}
    .specs__grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:500px){.specs__grid{grid-template-columns:1fr}}

/* ===== STORIES ===== */
.stories{padding:100px 0;background:var(--green-50)}
.stories__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.scard{background:var(--white);border-radius:var(--radius);padding:32px 28px;border:1px solid var(--green-100);transition:var(--transition);position:relative}
.scard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.scard--feat{border:2px solid var(--green-400);box-shadow:var(--shadow)}
.scard__badge{position:absolute;top:-12px;left:24px;background:linear-gradient(135deg,var(--green-400),var(--green-500));color:#fff;font-size:.72rem;font-weight:700;padding:5px 14px;border-radius:50px;text-transform:uppercase;letter-spacing:.03em}
.scard__head{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.scard__avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;color:#fff;flex-shrink:0}
.scard__head h4{font-size:.95rem;font-weight:700;color:var(--dark)}
.scard__head span{font-size:.8rem;color:var(--gray-400)}
.scard__stats{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.sstat{display:flex;flex-direction:column;align-items:center}
.sstat span{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-400);font-weight:600}
.sstat strong{font-size:1.1rem;font-weight:800;color:var(--dark)}
.sstat--hl strong{color:var(--green-500)}
.sstat__arrow{font-size:1.2rem;color:var(--green-400)}
.scard p{font-size:.9rem;color:var(--gray-500);line-height:1.6;margin-bottom:16px;font-style:italic}
.scard__bar{height:4px;background:var(--green-100);border-radius:4px;overflow:hidden;margin-bottom:8px}
.scard__fill{height:100%;background:linear-gradient(90deg,var(--green-400),var(--green-500));border-radius:4px;transition:width 1.5s ease}
.scard__status{font-size:.78rem;font-weight:600;color:var(--green-500)}

@media(max-width:1024px){.stories__grid{grid-template-columns:1fr}}

/* ===== REVIEWS ===== */
.reviews{padding:100px 0;overflow:hidden}
.reviews__track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:8px;scroll-behavior:smooth}
.reviews__track::-webkit-scrollbar{display:none}
.rcard{min-width:340px;max-width:380px;flex-shrink:0;background:var(--white);border:1px solid var(--green-100);border-radius:var(--radius);padding:28px;scroll-snap-align:start;transition:var(--transition)}
.rcard:hover{border-color:var(--green-300);box-shadow:var(--shadow)}
.rcard__stars{color:#f5b942;font-size:1.1rem;margin-bottom:14px;letter-spacing:2px}
.rcard p{font-size:.9rem;color:var(--gray-600);line-height:1.65;margin-bottom:20px;font-style:italic}
.rcard__author{display:flex;align-items:center;gap:12px}
.rcard__av{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;color:#fff;flex-shrink:0}
.rcard__author strong{font-size:.88rem;display:block;color:var(--dark)}
.rcard__author span{font-size:.78rem;color:var(--gray-400)}

.reviews__nav{display:flex;justify-content:center;gap:16px;margin-top:32px}
.reviews__btn{width:44px;height:44px;border-radius:50%;border:2px solid var(--green-200);display:flex;align-items:center;justify-content:center;color:var(--green-500);transition:var(--transition)}
.reviews__btn:hover{background:var(--green-400);color:#fff;border-color:var(--green-400)}

/* ===== INBOX (What's in the box) ===== */
.inbox{padding:100px 0;background:var(--green-50)}
.inbox__inner{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;align-items:center}
.inbox__content h2{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:800;line-height:1.2;margin-bottom:24px}
.inbox__list{display:flex;flex-direction:column;gap:14px}
.inbox__list li{display:flex;align-items:center;gap:12px;font-size:.95rem;font-weight:500;color:var(--dark)}
.inbox__list svg{flex-shrink:0}
.inbox__img{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}

@media(max-width:900px){
    .inbox__inner{grid-template-columns:1fr}
    .inbox__img{order:-1}
}

/* ===== PRICING ===== */
.pricing{padding:100px 0}
.pricing__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}
.pcard{background:var(--white);border:1px solid var(--green-100);border-radius:var(--radius);padding:36px 28px;text-align:center;transition:var(--transition);position:relative}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.pcard--pop{border:2px solid var(--green-400);box-shadow:var(--shadow);transform:scale(1.04)}
.pcard--pop:hover{transform:scale(1.04) translateY(-6px)}
.pcard__badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--green-400),var(--green-500));color:#fff;font-size:.72rem;font-weight:700;padding:6px 18px;border-radius:50px;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
.pcard h3{font-size:1.2rem;font-weight:700;margin-bottom:16px;color:var(--dark)}
.pcard__price{margin-bottom:24px}
.pcard__amount{font-size:2.6rem;font-weight:900;color:var(--dark)}
.pcard__old{font-size:1rem;color:var(--gray-300);text-decoration:line-through;margin-left:8px}
.pcard ul{margin-bottom:28px;display:flex;flex-direction:column;gap:10px}
.pcard li{font-size:.9rem;color:var(--gray-600);position:relative;padding-left:24px}
.pcard li::before{content:'';position:absolute;left:0;top:6px;width:12px;height:12px;border-radius:50%;background:var(--green-100);border:2px solid var(--green-400)}
.pcard li.disabled{color:var(--gray-300)}
.pcard li.disabled::before{border-color:var(--gray-200);background:var(--gray-100)}

@media(max-width:900px){
    .pricing__grid{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}
    .pcard--pop{transform:none}
    .pcard--pop:hover{transform:translateY(-6px)}
}

/* ===== FAQ ===== */
.faq{padding:100px 0;background:var(--green-50)}
.faq__list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq-item{background:var(--white);border-radius:var(--radius-sm);border:1px solid var(--green-100);overflow:hidden;transition:var(--transition)}
.faq-item.open{border-color:var(--green-300);box-shadow:var(--shadow-sm)}
.faq-item__q{width:100%;display:flex;justify-content:space-between;align-items:center;padding:20px 24px;font-size:.95rem;font-weight:600;color:var(--dark);text-align:left;transition:var(--transition)}
.faq-item__q svg{flex-shrink:0;transition:transform .3s ease;color:var(--green-400)}
.faq-item.open .faq-item__q svg{transform:rotate(180deg)}
.faq-item__a{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .3s ease}
.faq-item.open .faq-item__a{max-height:300px;padding:0 24px 20px}
.faq-item__a p{font-size:.9rem;color:var(--gray-500);line-height:1.7}

/* ===== FOOTER ===== */
.footer{padding:60px 0 0;background:var(--dark);color:rgba(255,255,255,.7)}
.footer__top{display:grid;grid-template-columns:1.2fr 2fr;gap:60px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.08)}
.footer__brand{max-width:320px}
.footer__brand .logo__text{color:#fff}
.footer__brand p{margin-top:16px;font-size:.9rem;line-height:1.6}
.footer__links{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.footer__col h4{color:#fff;font-size:.9rem;font-weight:700;margin-bottom:16px}
.footer__col a{display:block;font-size:.88rem;margin-bottom:10px;transition:var(--transition)}
.footer__col a:hover{color:var(--green-400)}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;padding:24px 0;font-size:.85rem}
.footer__social{display:flex;gap:16px}
.footer__social a{color:rgba(255,255,255,.5);transition:var(--transition)}
.footer__social a:hover{color:var(--green-400)}

@media(max-width:900px){
    .footer__top{grid-template-columns:1fr}
    .footer__links{grid-template-columns:repeat(3,1fr)}
    .footer__bottom{flex-direction:column;gap:16px;text-align:center}
}
@media(max-width:500px){.footer__links{grid-template-columns:1fr;gap:24px}}

/* ===== ANIMATIONS ===== */
[data-animate]{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s ease}
[data-animate="fade-right"]{transform:translateX(-30px)}
[data-animate="fade-left"]{transform:translateX(30px)}
[data-animate].visible{opacity:1;transform:translate(0,0)}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--green-50)}
::-webkit-scrollbar-thumb{background:var(--green-300);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--green-400)}