/* ===== Анастасія Богданова — спільна дизайн-система сайту (Prata + Manrope, крем / бронза / золото) ===== */
:root{
  --bg:#F6EFE1;--paper:#EFE6D2;--mist:#EADFC8;--white:#FBF8F1;
  --ink:#221D16;--ink-soft:#57493A;
  --gold:#C9A36A;--bronze:#8B7048;--bronze-deep:#6E572F;
  --clay:#B5502A;
  --line:rgba(34,29,22,.14);--line-soft:rgba(139,112,72,.22);
  --muted:rgba(34,29,22,.62);
  --serif:'Prata',Georgia,serif;--sans:'Manrope',-apple-system,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);overflow-x:hidden;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;}
::selection{background:var(--gold);color:var(--ink);}
h1,h2,h3,h4,.serif{font-family:var(--serif);font-weight:400;line-height:1.1;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}
em{font-style:italic;}

/* grain */
body::after{content:'';position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");}

.c{max-width:1180px;margin:0 auto;padding:0 48px;}
.ey{font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--bronze);display:flex;align-items:center;gap:16px;margin-bottom:32px;font-weight:600;}
.ey::before{content:'';width:40px;height:1px;background:var(--bronze);display:inline-block;flex-shrink:0;}
.ey.light{color:var(--gold);}
.ey.light::before{background:var(--gold);}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--bronze);color:var(--bg);
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;padding:20px 44px;
  text-decoration:none;border:none;cursor:pointer;transition:background .25s,transform .25s,box-shadow .25s;line-height:1.3;text-align:center;}
.btn:hover{background:#A3855A;transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--bronze);}
.btn-ghost:hover{background:rgba(139,112,72,.09);transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:var(--bg);}
.btn-dark:hover{background:#3A322A;}
.btn-gold{background:var(--gold);color:var(--ink);}
.btn-gold:hover{background:#D9B67E;}
.btn-light{background:var(--bg);color:var(--ink);}
.btn-light:hover{background:#fff;}
.btn-ghost-light{background:transparent;color:var(--bg);border:1px solid rgba(246,239,225,.5);}
.btn-ghost-light:hover{background:rgba(246,239,225,.1);}
.btn-block{width:100%;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(139,112,72,.45);}70%{box-shadow:0 0 0 16px rgba(139,112,72,0);}100%{box-shadow:0 0 0 0 rgba(139,112,72,0);}}
.btn-pulse{animation:pulse 2.2s infinite;}
.btn-pulse:hover{animation:none;box-shadow:0 10px 30px rgba(139,112,72,.35);}

/* reveal */
.rr{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease;}
.rr.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.rr{opacity:1;transform:none;transition:none;}}

/* ─── NAV ─── */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;
  padding:16px 48px;transition:background .35s,border-color .35s;border-bottom:1px solid transparent;gap:24px;}
.nav.solid,.nav.force-solid{background:rgba(246,239,225,.94);backdrop-filter:blur(12px);border-bottom-color:var(--line);}
.nav-name{font-family:var(--serif);font-size:17px;color:var(--ink);letter-spacing:.5px;line-height:1.1;white-space:nowrap;}
.nav-name span{display:block;font-family:var(--sans);font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--bronze);margin-top:3px;font-weight:600;}
.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links>a,.nav-drop>summary{font-size:11px;letter-spacing:2.2px;text-transform:uppercase;font-weight:600;color:var(--ink);cursor:pointer;list-style:none;position:relative;padding:6px 0;}
.nav-links>a::after,.nav-drop>summary::after{content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--bronze);transition:right .25s;}
.nav-links>a:hover::after,.nav-drop:hover>summary::after,.nav-links>a.active::after{right:0;}
.nav-drop{position:relative;}
.nav-drop>summary::-webkit-details-marker{display:none;}
.nav-drop-menu{position:absolute;top:calc(100% + 14px);left:-20px;background:var(--white);border:1px solid var(--line);min-width:320px;padding:10px;box-shadow:0 20px 50px rgba(34,29,22,.14);display:none;}
.nav-drop:hover .nav-drop-menu,.nav-drop[open] .nav-drop-menu{display:block;}
.nav-drop::after{content:'';position:absolute;left:0;right:0;top:100%;height:16px;}
.ndi{display:grid;grid-template-columns:48px 1fr auto;gap:14px;align-items:center;padding:10px 12px;transition:background .2s;}
.ndi:hover{background:var(--paper);}
.ndi img{width:48px;height:48px;object-fit:cover;}
.ndi b{display:block;font-family:var(--serif);font-weight:400;font-size:15px;color:var(--ink);line-height:1.2;}
.ndi small{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);}
.ndi .ndi-price{font-size:12px;color:var(--bronze);font-weight:600;white-space:nowrap;}
.ndi-all{display:block;padding:12px;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--bronze);font-weight:600;border-top:1px solid var(--line);margin-top:6px;}
.nav-cta{font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--bg);background:var(--bronze);padding:13px 24px;transition:background .25s;white-space:nowrap;}
.nav-cta:hover{background:#A3855A;}
.nav-burger{display:none;width:44px;height:44px;border:1px solid var(--line);background:transparent;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;}
.nav-burger span{display:block;width:20px;height:1.5px;background:var(--ink);transition:transform .3s,opacity .3s;}
.nav-burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.nav-burger.open span:nth-child(2){opacity:0;}
.nav-burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
.nav-mobile{position:fixed;inset:0;z-index:99;background:var(--bg);padding:100px 28px 40px;display:none;flex-direction:column;gap:6px;overflow-y:auto;}
.nav-mobile.open{display:flex;}
.nav-mobile a{font-family:var(--serif);font-size:26px;padding:12px 0;border-bottom:1px solid var(--line);color:var(--ink);}
.nav-mobile .nm-sub{font-family:var(--sans);font-size:15px;padding:10px 0 10px 18px;display:flex;justify-content:space-between;}
.nav-mobile .nm-sub small{color:var(--bronze);font-weight:600;font-size:12px;}
.nav-mobile .nm-label{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--bronze);font-weight:600;margin:26px 0 6px;}
.nav-mobile a.btn{margin-top:28px;font-family:var(--sans);font-size:12px;border-bottom:none;padding:20px 30px;}

/* ─── FOOTER ─── */
.footer{background:var(--ink);color:rgba(246,239,225,.55);padding:72px 0 28px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;padding-bottom:48px;border-bottom:1px solid rgba(246,239,225,.1);}
.footer .f-name{font-family:var(--serif);font-size:22px;color:var(--bg);display:block;margin-bottom:14px;}
.footer p{font-size:13.5px;line-height:1.75;max-width:360px;font-weight:300;}
.footer h4{font-family:var(--sans);font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:18px;font-weight:600;}
.footer-col a{display:block;font-size:14px;color:rgba(246,239,225,.72);padding:5px 0;transition:color .2s;}
.footer-col a:hover{color:var(--bg);}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px;font-size:11.5px;letter-spacing:.3px;color:rgba(246,239,225,.38);line-height:1.7;}

/* ─── STICKY CTA (mobile) ─── */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:90;padding:12px 16px;background:rgba(246,239,225,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .35s;display:none;}
.sticky-cta.show{transform:none;}
.sticky-cta a{display:flex;justify-content:center;align-items:center;gap:12px;background:var(--bronze);color:var(--bg);text-decoration:none;font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:600;padding:16px;}
.sticky-cta a s{opacity:.6;}

/* ─── FAQ base ─── */
.faq-list details{border-top:1px solid var(--line);}
.faq-list details:last-of-type{border-bottom:1px solid var(--line);}
.faq-list summary{padding:22px 0;font-family:var(--serif);font-size:clamp(17px,1.5vw,21px);color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;line-height:1.3;}
.faq-list summary::-webkit-details-marker{display:none;}
.faq-list summary::after{content:'+';font-family:var(--sans);font-size:24px;font-weight:300;color:var(--bronze);flex-shrink:0;transition:transform .25s;}
.faq-list details[open] summary::after{transform:rotate(45deg);}
.faq-list .faq-a{font-size:15px;color:var(--ink-soft);line-height:1.75;padding-bottom:24px;font-weight:300;max-width:600px;}

/* ─── lightbox ─── */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(34,29,22,.92);display:none;align-items:center;justify-content:center;padding:30px;cursor:zoom-out;}
.lightbox.active{display:flex;}
.lightbox img{max-width:min(92vw,1100px);max-height:90vh;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.5);}
.lightbox-close{position:absolute;top:20px;right:28px;color:var(--bg);font-size:28px;cursor:pointer;}

/* ─── helpers ─── */
.ticker{background:var(--ink);color:var(--bg);overflow:hidden;padding:16px 0;}
.ticker-track{display:flex;white-space:nowrap;animation:tick 40s linear infinite;width:max-content;}
.ticker span{font-size:12px;letter-spacing:3px;text-transform:uppercase;padding:0 28px;display:inline-flex;align-items:center;gap:28px;font-weight:500;}
.ticker span::after{content:'';width:6px;height:6px;background:var(--gold);border-radius:50%;}
@keyframes tick{to{transform:translateX(-50%);}}

/* bundle offer (обличчя + стопи) */
.bundle{margin-top:56px;border:1px solid var(--line-soft);background:var(--white);display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;padding:34px 40px;position:relative;}
.bundle::before{content:'Комплект';position:absolute;top:-11px;left:40px;background:var(--clay);color:var(--bg);font-size:10px;letter-spacing:2px;text-transform:uppercase;font-weight:600;padding:5px 12px;}
.bundle h3{font-size:clamp(22px,2.2vw,30px);margin-bottom:10px;}
.bundle h3 em{color:var(--bronze);}
.bundle p{font-size:14.5px;color:var(--ink-soft);line-height:1.7;font-weight:300;max-width:560px;}
.bundle-price{text-align:right;}
.bundle-price s{display:block;font-size:14px;color:var(--muted);}
.bundle-price b{display:block;font-family:var(--serif);font-size:44px;font-weight:400;color:var(--ink);line-height:1;margin:4px 0 6px;}
.bundle-price small{display:block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--clay);font-weight:600;margin-bottom:18px;}

/* ─── RESPONSIVE ─── */
@media(max-width:1024px){
  .c{padding:0 32px;}
  .nav{padding:14px 32px;}
  .nav-links,.nav-cta{display:none;}
  .nav-burger{display:flex;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:760px){
  .c{padding:0 20px;}
  .nav{padding:12px 20px;}
  .footer{padding:56px 0 24px;}
  .footer-grid{grid-template-columns:1fr;gap:32px;}
  .sticky-cta{display:block;}
  .bundle{grid-template-columns:1fr;padding:30px 22px;gap:22px;}
  .bundle::before{left:22px;}
  .bundle-price{text-align:left;}
}
