/* ===================================================================
   BEM BATATA — styles.css
   Paleta: espresso quente + dourado batata + creme + acento mar
   =================================================================== */

:root{
  --espresso:#1a120b;
  --espresso-2:#24180e;
  --gold:#e8a33d;
  --gold-deep:#c9812a;
  --amber:#f4c46b;
  --cream:#fbf3e6;
  --cream-2:#f4e7d1;
  --ink:#2b2018;
  --muted:#6f6154;
  --sea:#2f8fb0;
  --sea-deep:#1f6f8b;
  --white:#ffffff;

  --radius:22px;
  --radius-sm:14px;
  --shadow-sm:0 4px 18px rgba(26,18,11,.08);
  --shadow:0 24px 60px -20px rgba(26,18,11,.35);
  --shadow-gold:0 18px 40px -12px rgba(200,129,42,.55);
  --maxw:1180px;
  --ease:cubic-bezier(.22,1,.36,1);

  --sans:"Plus Jakarta Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}

.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:24px}
.section{padding:clamp(64px,9vw,120px) 0}

/* ---------- Typography helpers ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-deep);margin-bottom:18px;
}
.eyebrow--center{justify-content:center}
.eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(232,163,61,.22)}
.section__head{max-width:620px;margin:0 auto clamp(40px,6vw,64px);text-align:center}
.section__title{
  font-family:var(--serif);font-weight:600;line-height:1.05;
  font-size:clamp(2rem,4.4vw,3.2rem);letter-spacing:-.02em;color:var(--espresso);
}
.section__title em{font-style:italic;color:var(--gold-deep)}
.section__sub{color:var(--muted);font-size:1.06rem;margin-top:16px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--sans);font-weight:700;font-size:.98rem;
  padding:14px 26px;border-radius:100px;border:none;cursor:pointer;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s,color .3s;
  white-space:nowrap;
}
.btn svg{transition:transform .3s var(--ease)}
.btn--primary{background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#3a250c;box-shadow:var(--shadow-gold)}
.btn--primary:hover{transform:translateY(-3px);box-shadow:0 26px 50px -12px rgba(200,129,42,.7)}
.btn--primary:hover svg{transform:translateX(4px)}
.btn--soft{background:rgba(26,18,11,.06);color:var(--espresso)}
.btn--soft:hover{background:rgba(26,18,11,.12);transform:translateY(-2px)}
.btn--ghost{background:transparent;border:1.6px solid rgba(255,255,255,.35);color:#fff}
.btn--ghost:hover{background:#fff;color:var(--espresso);transform:translateY(-2px)}
.btn--light{background:var(--cream);color:var(--espresso)}
.btn--light:hover{transform:translateY(-3px);box-shadow:0 20px 40px -14px rgba(0,0,0,.35)}

/* ---------- NAV ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:80;padding:18px 0;transition:all .4s var(--ease)}
.nav.scrolled{
  padding:10px 0;background:rgba(251,243,230,.82);backdrop-filter:blur(14px);
  box-shadow:0 6px 30px -12px rgba(26,18,11,.25);
}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--serif);font-weight:600;font-size:1.3rem;color:var(--espresso)}
.nav:not(.scrolled) .brand{color:#fff}
.brand__mark{
  display:grid;place-items:center;width:44px;height:44px;border-radius:13px;
  background:rgba(255,255,255,.12);backdrop-filter:blur(6px);
}
.nav.scrolled .brand__mark{background:rgba(232,163,61,.16)}
.brand__text span{color:var(--gold)}
.brand--footer{color:#fff;font-size:1.4rem}
.brand--footer .brand__mark{background:rgba(255,255,255,.1)}
.brand__logo{height:52px;width:auto;display:block}
.nav.scrolled .brand__logo{height:46px}
.brand--footer .brand__logo{height:64px}
@media (max-width:600px){.brand__logo{height:44px}}

.nav__links{display:flex;align-items:center;gap:8px}
.nav__links a:not(.btn){
  padding:9px 14px;border-radius:100px;font-weight:600;font-size:.95rem;color:#fff;
  opacity:.9;transition:opacity .25s,background .25s;
}
.nav.scrolled .nav__links a:not(.btn){color:var(--ink)}
.nav__links a:not(.btn):hover{opacity:1;background:rgba(255,255,255,.12)}
.nav.scrolled .nav__links a:not(.btn):hover{background:rgba(26,18,11,.06)}
.nav__cta{margin-left:8px}
.nav.scrolled .nav__cta{border-color:rgba(26,18,11,.2);color:var(--espresso)}
.nav.scrolled .nav__cta:hover{background:var(--espresso);color:#fff;border-color:var(--espresso)}

.nav__toggle{display:none;flex-direction:column;gap:5px;width:44px;height:44px;border:none;background:transparent;cursor:pointer;padding:10px}
.nav__toggle span{height:2.5px;border-radius:3px;background:#fff;transition:all .3s var(--ease)}
.nav.scrolled .nav__toggle span{background:var(--espresso)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;color:#fff;overflow:hidden;
  background:radial-gradient(120% 100% at 80% 0%,#33220f 0%,var(--espresso) 55%,#120b06 100%);}
.hero__bg{position:absolute;inset:0;z-index:0}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.blob--1{width:520px;height:520px;top:-120px;right:-80px;background:radial-gradient(circle,#e8a33d,transparent 70%)}
.blob--2{width:460px;height:460px;bottom:-140px;left:-120px;background:radial-gradient(circle,#c9812a,transparent 70%);opacity:.4}
.grain{position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");}

.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding-block:120px 90px}
.hero__copy .eyebrow{color:var(--amber)}
.hero__title{font-family:var(--serif);font-weight:600;font-size:clamp(2.6rem,6vw,4.6rem);line-height:1.02;letter-spacing:-.025em}
.hero__title em{font-style:italic;color:var(--amber)}
.hero__lead{margin-top:22px;font-size:clamp(1.05rem,1.6vw,1.22rem);color:rgba(251,243,230,.82);max-width:32ch}
.hero__lead strong{color:#fff}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.hero__actions .btn--soft{background:rgba(255,255,255,.12);color:#fff}
.hero__actions .btn--soft:hover{background:rgba(255,255,255,.2)}

.hero__stats{display:flex;gap:30px;margin-top:44px;flex-wrap:wrap}
.hero__stats li{display:flex;flex-direction:column}
.hero__stats strong{font-family:var(--serif);font-size:1.7rem;font-weight:600;color:var(--amber)}
.hero__stats span{font-size:.85rem;color:rgba(251,243,230,.7)}

/* hero art */
.hero__art{display:flex;justify-content:center}
.plate{position:relative;width:min(440px,86vw);aspect-ratio:1;display:grid;place-items:center;animation:float 6s var(--ease) infinite}
.plate__ring{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.14),rgba(255,255,255,.02) 60%,transparent 70%);
  border:1px solid rgba(255,255,255,.12);}
.plate__ring::after{content:"";position:absolute;inset:34px;border-radius:50%;border:1px dashed rgba(255,255,255,.18)}
.plate__photo{position:relative;z-index:2;width:82%;aspect-ratio:1;border-radius:50%;overflow:hidden;
  border:6px solid rgba(255,255,255,.9);box-shadow:0 40px 70px -20px rgba(0,0,0,.6),inset 0 0 0 1px rgba(0,0,0,.05)}
.plate__photo img{width:100%;height:100%;object-fit:cover}
.chip{position:absolute;z-index:3;background:rgba(255,255,255,.94);color:var(--espresso);
  font-weight:700;font-size:.82rem;padding:9px 15px;border-radius:100px;box-shadow:var(--shadow);white-space:nowrap}
.chip--top{top:8%;right:0;animation:float 5s var(--ease) infinite .4s}
.chip--bottom{bottom:10%;left:-4%;animation:float 5.5s var(--ease) infinite .8s}
.chip--bottom{color:var(--gold-deep)}

.hero__scroll{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;
  width:26px;height:44px;border:2px solid rgba(255,255,255,.4);border-radius:100px;display:grid;justify-items:center}
.hero__scroll span{width:4px;height:9px;border-radius:4px;background:#fff;margin-top:8px;animation:scroll 1.6s infinite}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes scroll{0%{opacity:0;transform:translateY(0)}40%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* ---------- FEATURES ---------- */
.features{position:relative;margin-top:-1px;background:var(--cream);padding:clamp(50px,7vw,84px) 0}
.features__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.feature{background:var(--white);border-radius:var(--radius);padding:30px 26px;box-shadow:var(--shadow-sm);
  border:1px solid rgba(26,18,11,.05);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.feature:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.feature__ico{display:grid;place-items:center;width:54px;height:54px;border-radius:15px;margin-bottom:18px;
  background:linear-gradient(135deg,var(--amber),var(--gold-deep));color:#3a250c}
.feature__ico svg{width:26px;height:26px}
.feature h3{font-family:var(--serif);font-weight:600;font-size:1.22rem;color:var(--espresso);margin-bottom:8px}
.feature p{color:var(--muted);font-size:.96rem}

/* ---------- MENU ---------- */
.menu{background:linear-gradient(180deg,var(--cream),var(--cream-2))}
.menu__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);
  border:1px solid rgba(26,18,11,.05);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.card:hover{transform:translateY(-10px);box-shadow:var(--shadow)}
.card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#f3dcb4}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.card:hover .card__media img{transform:scale(1.06)}
.card__badge{position:absolute;top:14px;left:14px;background:var(--espresso);color:#fff;font-size:.72rem;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;padding:6px 12px;border-radius:100px}
.card__badge--sea{background:var(--sea-deep)}
.card__badge--green{background:#3f9a5b}
.card__badge--sweet{background:#c94f86}
.card__body h3{margin-bottom:8px}
.card__body{padding:22px 24px 26px}
.card__row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.card__body h3{font-family:var(--serif);font-weight:600;font-size:1.3rem;color:var(--espresso)}
.price{font-family:var(--serif);font-weight:600;font-size:1.15rem;color:var(--gold-deep);white-space:nowrap}
.card__body p{color:var(--muted);font-size:.95rem;margin-top:8px}
.menu__note{text-align:center;color:var(--muted);font-size:.82rem;margin-top:26px;font-style:italic;opacity:.8}
.menu__cta{display:flex;justify-content:center;margin-top:14px}

/* ---------- CASHBACK ---------- */
.cashback{background:linear-gradient(135deg,var(--espresso),#3a2410);color:#fff;overflow:hidden}
.cashback__inner{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center;padding:clamp(56px,8vw,96px) 24px}
.cashback__copy .eyebrow{color:var(--amber)}
.cashback__copy h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.9rem,4vw,2.9rem);line-height:1.08}
.cashback__copy h2 em{font-style:italic;color:var(--amber)}
.cashback__copy p{color:rgba(251,243,230,.8);margin:18px 0 28px;max-width:46ch;font-size:1.05rem}
.cashback__visual{position:relative;display:grid;place-items:center;min-height:200px}
.coin{position:relative;z-index:2;width:130px;height:130px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--serif);font-weight:700;font-size:3.4rem;color:#3a250c;
  background:radial-gradient(circle at 35% 30%,#ffe08a,var(--gold-deep));
  box-shadow:0 24px 50px -10px rgba(232,163,61,.6),inset 0 -8px 18px rgba(140,88,20,.5);
  animation:float 5s var(--ease) infinite}
.cashback__pulse{position:absolute;width:130px;height:130px;border-radius:50%;border:2px solid var(--amber);opacity:.6;animation:pulse 2.6s ease-out infinite}
@keyframes pulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.1);opacity:0}}

/* ---------- ABOUT ---------- */
.about__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(36px,6vw,72px);align-items:center}
.about__art{position:relative}
.about__frame{border-radius:28px;overflow:hidden;box-shadow:var(--shadow);border:6px solid #fff;aspect-ratio:1}
.about__frame img{width:100%;height:100%;object-fit:cover;display:block}
.about__stat{position:absolute;right:-10px;bottom:-24px;background:#fff;border-radius:var(--radius-sm);padding:16px 22px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;line-height:1.2}
.about__stat strong{font-family:var(--serif);color:var(--gold-deep);font-size:1.1rem}
.about__stat span{font-size:.82rem;color:var(--muted)}
.about__copy .section__title{text-align:left}
.about__copy p{color:var(--muted);margin-top:16px;font-size:1.05rem}
.about__copy p strong{color:var(--espresso)}
.about__list{margin-top:26px;display:grid;gap:12px}
.about__list li{display:flex;align-items:center;gap:12px;font-weight:600;color:var(--ink)}
.about__list svg{width:22px;height:22px;padding:4px;border-radius:50%;background:rgba(232,163,61,.18);color:var(--gold-deep);flex:none}

/* ---------- EXPERIÊNCIAS ---------- */
.exp{background:linear-gradient(180deg,var(--cream-2),var(--cream))}
.exp__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.exp__card{background:var(--white);border-radius:var(--radius);padding:34px 30px;box-shadow:var(--shadow-sm);
  border:1px solid rgba(26,18,11,.05);transition:transform .35s var(--ease),box-shadow .35s var(--ease);position:relative;overflow:hidden}
.exp__card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--amber),var(--gold-deep));transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.exp__card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.exp__card:hover::before{transform:scaleX(1)}
.exp__ico{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;margin-bottom:20px;
  background:rgba(232,163,61,.14);color:var(--gold-deep)}
.exp__ico svg{width:28px;height:28px}
.exp__card h3{font-family:var(--serif);font-weight:600;font-size:1.35rem;color:var(--espresso);margin-bottom:10px}
.exp__card p{color:var(--muted);font-size:.98rem;margin-bottom:18px}
.link{font-weight:700;color:var(--gold-deep);transition:letter-spacing .3s}
.link:hover{letter-spacing:.02em}

/* ---------- INSTAGRAM ---------- */
.ig{background:var(--cream);padding:clamp(56px,8vw,100px) 0}
.ig__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,64px);align-items:center}
.ig__head .section__title{text-align:left}
.ig__head .btn{margin-top:22px}
.ig__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ig__tile{aspect-ratio:1;border-radius:var(--radius-sm);display:grid;place-items:center;overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .4s var(--ease)}
.ig__tile:hover{transform:scale(1.04) rotate(1deg)}
.ig__tile img{width:100%;height:100%;object-fit:cover}
.ig__tile--2{margin-top:24px}
.ig__tile--3{margin-top:-24px}

/* ---------- CONTATO ---------- */
.contact{background:linear-gradient(180deg,var(--cream),var(--cream-2))}
.contact__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(36px,5vw,60px);align-items:start}
.contact__copy .section__title{text-align:left}
.contact__copy .section__sub{margin-bottom:8px}
.contact__list{margin:30px 0;display:grid;gap:18px}
.contact__list li{display:flex;align-items:center;gap:16px}
.contact__ico{display:grid;place-items:center;width:50px;height:50px;border-radius:14px;flex:none;
  background:#fff;box-shadow:var(--shadow-sm);color:var(--gold-deep)}
.contact__ico svg{width:24px;height:24px}
.contact__list strong{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.contact__list a,.contact__list span{font-family:var(--serif);font-size:1.15rem;color:var(--espresso);font-weight:500}
.contact__list a:hover{color:var(--gold-deep)}
.contact__actions{display:flex;flex-wrap:wrap;gap:14px}

.contact__card{background:var(--espresso);color:#fff;border-radius:var(--radius);padding:clamp(28px,4vw,40px);box-shadow:var(--shadow)}
.contact__card h3{font-family:var(--serif);font-weight:600;font-size:1.5rem;margin-bottom:10px}
.contact__card>p{color:rgba(251,243,230,.75);margin-bottom:22px}
.newsletter{display:flex;gap:10px;flex-wrap:wrap}
.newsletter input{flex:1;min-width:180px;padding:14px 18px;border-radius:100px;border:1.6px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);color:#fff;font-family:var(--sans);font-size:.96rem}
.newsletter input::placeholder{color:rgba(251,243,230,.5)}
.newsletter input:focus{outline:none;border-color:var(--amber);background:rgba(255,255,255,.1)}
.newsletter__ok{margin-top:14px;color:var(--amber);font-weight:600}
.contact__socials{display:flex;gap:12px;margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
.contact__socials a{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;
  background:rgba(255,255,255,.08);transition:background .3s,transform .3s}
.contact__socials a:hover{background:var(--gold-deep);transform:translateY(-3px)}
.contact__socials svg{width:22px;height:22px;color:#fff}

/* ---------- FOOTER ---------- */
.footer{background:var(--espresso-2);color:#fff;padding:44px 0}
.footer__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer__links{display:flex;gap:20px;flex-wrap:wrap}
.footer__links a{color:rgba(251,243,230,.7);font-weight:600;font-size:.95rem;transition:color .25s}
.footer__links a:hover{color:var(--amber)}
.footer__copy{width:100%;text-align:center;color:rgba(251,243,230,.45);font-size:.85rem;border-top:1px solid rgba(255,255,255,.08);padding-top:24px;margin-top:8px}

/* ---------- FAB (mobile order) ---------- */
.fab{position:fixed;bottom:20px;right:20px;z-index:70;display:none;align-items:center;gap:8px;
  padding:14px 20px;border-radius:100px;background:linear-gradient(135deg,var(--gold),var(--gold-deep));
  color:#3a250c;font-weight:800;box-shadow:var(--shadow-gold)}
.fab svg{width:20px;height:20px}

/* ---------- REVEAL ANIMATION ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .plate,.chip,.coin,.hero__scroll span,.cashback__pulse{animation:none}
}

/* ===================================================================
   RESPONSIVE
   =================================================================== */
@media (max-width:980px){
  .hero__inner{grid-template-columns:1fr;gap:20px;text-align:center;padding-block:130px 80px}
  .hero__lead{margin-inline:auto}
  .hero__actions,.hero__stats{justify-content:center}
  .hero__art{order:-1}
  .plate{width:min(340px,74vw)}
  .features__grid{grid-template-columns:repeat(2,1fr)}
  .menu__grid{grid-template-columns:repeat(2,1fr)}
  .cashback__inner{grid-template-columns:1fr;text-align:center}
  .cashback__copy .eyebrow{justify-content:center}
  .cashback__copy p{margin-inline:auto}
  .about__grid{grid-template-columns:1fr}
  .about__art{max-width:440px;margin-inline:auto}
  .exp__grid{grid-template-columns:1fr}
  .ig__inner{grid-template-columns:1fr}
  .ig__head .section__title,.about__copy .section__title,.contact__copy .section__title,.ig__head .eyebrow{text-align:center}
  .ig__head{text-align:center}
  .ig__head .eyebrow{justify-content:center}
  .contact__grid{grid-template-columns:1fr}
}

@media (max-width:760px){
  .nav__toggle{display:flex}
  .nav__links{
    position:fixed;inset:0 0 0 auto;width:min(320px,84vw);flex-direction:column;align-items:stretch;gap:6px;
    background:var(--cream);padding:100px 24px 40px;box-shadow:-20px 0 60px -20px rgba(0,0,0,.4);
    transform:translateX(105%);transition:transform .4s var(--ease);z-index:75;
  }
  .nav__links.open{transform:none}
  .nav__links a:not(.btn){color:var(--ink)!important;padding:14px 16px;border-radius:12px;font-size:1.05rem}
  .nav__links a:not(.btn):hover{background:rgba(26,18,11,.06)}
  .nav__cta{margin:12px 0 0;border-color:var(--gold-deep)!important;color:var(--espresso)!important;justify-content:center}
  .nav__toggle.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .nav__toggle.open span:nth-child(2){opacity:0}
  .nav__toggle.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  .fab{display:inline-flex}
  .footer__inner{flex-direction:column;text-align:center}
}

@media (max-width:520px){
  .container{padding-inline:18px}
  .features__grid,.menu__grid{grid-template-columns:1fr}
  .hero__stats{gap:22px}
  .newsletter input{min-width:100%}
  .newsletter button{width:100%}
  .contact__actions .btn{flex:1}
}

/* body scroll lock when menu open */
body.nav-open{overflow:hidden}