/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img{display:block;max-width:100%}
button{cursor:pointer;font:inherit;color:inherit;background:none;border:none}
a{color:inherit;text-decoration:none}
input,textarea{font:inherit;color:inherit}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--brand-light);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Palette / tokens (корпоративные цвета Кофелар) ---------- */
:root{
  --background:#ffffff; --foreground:#4a4a4c;
  --brand:#dfc5ac; --brand-deep:#4a4a4c; --brand-light:#dfc5ac; --accent-teal:#7e7e7f;
  --surface:#fef3ed; --surface-card:#ffffff;
  --ink:#4a4a4c; --ink-soft:#7e7e7f; --ghost:rgba(74,74,76,.3); --hairline:rgba(74,74,76,.15); --on-brand:#ffffff;
  --radius-card:1.5rem; --radius-card-lg:2rem; --radius-pill:62.5rem;
}

/* ---------- Adaptive rem grid ---------- */
html{font-size:16px;scrollbar-gutter:stable}
@media (max-width:1920px){ html{font-size:0.833333vw} }
@media (max-width:1440px){ html{font-size:1.111111vw} }
@media (max-width:1024px){ html{font-size:1.5625vw} }
@media (max-width:640px){ html{font-size:4.444444vw} }
html.lock{position:relative;overflow:hidden;height:100%}

body{
  min-height:100vh; background:var(--background); color:var(--foreground);
  font-family:"Inter", system-ui, sans-serif; font-weight:300;
}
h1,h2,h3,h4,h5,h6,.stack{font-family:"Bounded", system-ui, sans-serif}
main{width:100%;overflow-x:clip;padding:0.5rem}
@media (min-width:640px){ main{padding:0.75rem} }
.font-medium{font-weight:500}

/* ---------- shared: clip reveal ---------- */
.clipbox{overflow:hidden;vertical-align:top;max-width:100%}
.clipbox.inline{display:inline-block;padding-bottom:0.12em}
.clipbox.block{display:block;padding-bottom:0.14em}
.clipinner{display:block;will-change:transform,opacity;overflow-wrap:anywhere}

/* ---------- Eyebrow ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:0.5rem;font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.22em}
.eyebrow .dot{width:0.375rem;height:0.375rem;border-radius:var(--radius-pill);flex:none}
.eyebrow.dark{color:var(--ink-soft)}
.eyebrow.dark .dot{background:var(--brand)}
.eyebrow.light{color:rgba(255,255,255,.7)}
.eyebrow.light .dot{background:var(--brand-light)}

/* ---------- Dots (slider) ---------- */
.dots{display:flex;align-items:center;gap:0.5rem}
.dot-btn{padding:0.375rem;display:grid;place-items:center}
.dot-pill{display:block;height:0.375rem;width:0.375rem;border-radius:var(--radius-pill);transition:width .3s ease,background-color .3s ease}
.dot-pill.light{background:rgba(255,255,255,.4)}
.dot-pill.light.active{width:1.25rem;background:#fff}

/* ---------- Section header shared ---------- */
.section-header .stack{margin-top:1rem}
h2.stack{font-size:clamp(1.75rem, 8vw, 2.5rem);font-weight:500;line-height:1.05;letter-spacing:-0.01em}
@media (min-width:640px){ h2.stack{font-size:3rem;line-height:0.98} }
.section-lede{font-size:0.9375rem;color:var(--ink-soft);line-height:1.6;margin-top:1.25rem;max-width:30rem}
.section-header.center{text-align:center}
.section-header.center .eyebrow{justify-content:center}
.section-header.center .section-lede{margin-left:auto;margin-right:auto}

/* ---------- Pill button ---------- */
.pill-btn{display:inline-flex;align-items:center;gap:0.5rem;border-radius:var(--radius-pill);padding:0.875rem 1.75rem;font-size:0.875rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em;transition:background-color .25s ease,color .25s ease}
.pill-btn .pill-arrow{width:1rem;height:1rem;flex:none}
.pill-btn.light{background:#fff;color:var(--brand-deep)}
.pill-btn.light:hover{background:var(--brand-light);color:var(--brand-deep)}
.pill-btn.dark{background:var(--ink);color:#fff}
.pill-btn.dark:hover{background:var(--brand-deep)}
.pill-btn.outline{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff}
.pill-btn.outline:hover{background:#fff;color:var(--brand-deep)}
.pill-btn.outline-dark{background:transparent;border:1px solid var(--hairline);color:var(--ink)}
.pill-btn.outline-dark:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.pill-btn.small{padding:0.6rem 1.25rem;font-size:0.75rem}

/* ---------- Loader ---------- */
.loader{position:fixed;inset:0;z-index:200;background:var(--brand-deep);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding:0 1.5rem;text-align:center}
.loader-wordmark{display:flex;align-items:center;gap:0.5rem;font-size:0.9rem;font-weight:500;text-transform:uppercase;letter-spacing:0.1em;white-space:nowrap}
@media (min-width:480px){ .loader-wordmark{font-size:1.125rem;letter-spacing:0.16em} }
@media (min-width:640px){ .loader-wordmark{font-size:1.5rem;letter-spacing:0.2em} }
.logo-mark{display:inline-flex;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-pill);background:#fff;flex:none;aspect-ratio:97/105}
.logo-mark img{width:100%;height:100%;object-fit:contain;padding:16%}
.loader-wordmark .logo-mark{height:2.75rem}
.loader-track{width:10rem;height:1px;border-radius:var(--radius-pill);background:rgba(255,255,255,.2);overflow:hidden}
.loader-fill{width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:left}

/* ---------- Header ---------- */
.site-header{position:relative;z-index:20;display:flex;align-items:center;padding:1.5rem 1.5rem 0;font-size:0.75rem;color:#fff}
@media (min-width:640px){ .site-header{padding:2rem 2.5rem 0} }
.header-nav-left{flex:1;display:none;gap:1.75rem}
@media (min-width:1024px){ .header-nav-left{display:flex} }
.header-nav-left a{color:rgba(255,255,255,.9);transition:color .2s ease;white-space:nowrap}
.header-nav-left a:hover{color:#fff}
.header-brand{flex:1;display:flex;align-items:center;gap:0.5rem;font-size:0.7rem;font-weight:500;text-transform:uppercase;letter-spacing:0.1em;justify-content:flex-start;white-space:nowrap}
@media (min-width:480px){ .header-brand{font-size:0.8125rem;letter-spacing:0.14em} }
@media (min-width:640px){ .header-brand{font-size:0.9375rem;letter-spacing:0.18em} }
@media (min-width:1024px){ .header-brand{justify-content:center;font-size:1rem;letter-spacing:0.2em} }
.header-brand .logo-mark{height:2rem;flex:none;padding:3px}
.header-right{flex:1;display:flex;align-items:center;justify-content:flex-end;gap:1rem}
@media (min-width:640px){ .header-right{gap:1.25rem} }
.book-visit-text{display:none;text-transform:uppercase;letter-spacing:0.05em;font-size:0.75rem;color:#fff}
@media (min-width:640px){ .book-visit-text{display:inline}}
.book-visit-text:hover{text-decoration:underline}
.burger{width:2.5rem;height:2.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius-pill);background:rgba(255,255,255,.15);backdrop-filter:blur(8px);transition:background-color .2s ease}
.burger:hover{background:rgba(255,255,255,.25)}
.burger span{display:block;width:1rem;height:2px;border-radius:1px;background:#fff}
.burger span+span{margin-top:2px}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius-card-lg);background:var(--brand-deep);color:#fff;display:flex;flex-direction:column;min-height:max(36rem, calc(100svh - 1rem))}
@media (min-width:640px){ .hero{min-height:max(36rem, calc(100svh - 1.5rem))} }
.hero-bg{position:absolute;inset:0;z-index:-10}
.hero-bg-inner{position:absolute;left:0;right:0;top:-16%;height:132%;width:100%;will-change:transform}
.hero-bg-inner img{width:100%;height:100%;object-fit:cover}
.hero-bg-gradient{position:absolute;inset:0;background:linear-gradient(to bottom, rgba(74,74,76,.7), rgba(74,74,76,.45), rgba(74,74,76,.85))}

.hero-content{position:relative;z-index:10;max-width:38rem;display:flex;flex-direction:column;gap:1.25rem;padding:2.5rem 1.5rem 0}
@media (min-width:640px){ .hero-content{padding:3rem 2.5rem 0;gap:1.5rem} }
.hero-content .eyebrow{transition:opacity .3s ease}
.hero-title{font-size:2.35rem;font-weight:500;line-height:1.02;letter-spacing:-0.02em;white-space:normal}
@media (min-width:640px){ .hero-title{font-size:2.85rem} }
@media (min-width:1024px){ .hero-title{font-size:3.5rem} }
.hero-title .clipinner{transform:translateY(115%);opacity:0}

.hero-lead{font-size:1.0625rem;line-height:1.6;color:rgba(255,255,255,.8);max-width:30rem}

.hero-bottom{margin-top:auto;display:flex;flex-direction:column;gap:1.5rem;padding:1.5rem 1.5rem 2rem}
@media (min-width:640px){ .hero-bottom{flex-direction:row;justify-content:flex-end;align-items:flex-end;padding:1.5rem 2.5rem 2.5rem} }
.hero-right-cluster{display:flex;align-items:flex-end;gap:1rem;flex-wrap:wrap}

.glass-card{border-radius:var(--radius-card);border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.1);box-shadow:0 1rem 2rem rgba(74,74,76,.2);backdrop-filter:blur(10px)}

.collection-slider{display:flex;width:16rem;max-width:100%;flex-direction:column;gap:0.75rem}
.collection-card{display:flex;gap:0.75rem;padding:0.75rem}
.collection-card img{width:3.5rem;height:3.5rem;border-radius:0.75rem;object-fit:cover;flex:none}
.collection-info{display:flex;flex-direction:column;gap:0.15rem;min-width:0}
.collection-brand{font-size:0.7rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em}
.collection-title{font-size:0.7rem;text-transform:uppercase;opacity:.8}
.collection-cta{font-size:0.65rem;text-decoration:underline;margin-top:0.15rem;align-self:flex-start}

.membership-stack{display:flex;flex-direction:column;gap:0.75rem;width:100%;max-width:20rem}
@media (min-width:640px){ .membership-stack{flex-direction:row;flex-wrap:wrap;max-width:none} }
.membership-card{width:100%;display:flex;align-items:stretch;gap:0.75rem;padding:0.75rem}
@media (min-width:640px){ .membership-card{width:15.5rem} }
.membership-left{display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.membership-value{font-size:1.875rem;font-weight:500;line-height:1;white-space:nowrap}
.membership-avatars{display:flex}
.membership-avatars span{width:1.25rem;height:1.25rem;border-radius:var(--radius-pill);border:1px solid rgba(74,74,76,.4);margin-left:-0.5rem}
.membership-avatars span:first-child{margin-left:0}
.membership-caption{font-size:0.65rem;opacity:.8}
.membership-img{width:4rem;aspect-ratio:3/4;border-radius:0.75rem;object-fit:cover;flex:none}

/* ---------- Stats (Кофелар в цифрах) ---------- */
.stats{background:var(--surface);padding:6rem 1.5rem}
@media (min-width:640px){ .stats{padding:6rem 2.5rem} }
.stats-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;margin-top:3rem}
@media (min-width:768px){ .stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.stat-card{border-radius:var(--radius-card);background:var(--surface-card);padding:2rem;box-shadow:inset 0 0 0 1px var(--hairline);display:flex;flex-direction:column;gap:0.75rem}
.stat-card-value{font-size:1.5rem;font-weight:600;color:var(--ink);line-height:1.2;letter-spacing:-0.01em}
@media (min-width:640px){ .stat-card-value{font-size:1.75rem} }
.stat-card-sub{font-size:0.875rem;font-weight:500;color:var(--brand-deep)}
.stat-card-text{font-size:0.875rem;color:var(--ink-soft);line-height:1.6;margin-top:auto}

/* ---------- Values (Наши ценности и подход) ---------- */
.values{position:relative;background:var(--background);padding:6rem 1.5rem;overflow:hidden}
@media (min-width:640px){ .values{padding:6rem 2.5rem} }
.values-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1.5rem;align-items:center}
@media (min-width:768px){ .values-grid{grid-template-columns:minmax(0,1fr) auto;gap:3rem} }
.values-text .stack{margin-top:1rem}
.values-text p{margin-top:1.25rem;font-size:0.9375rem;color:var(--ink-soft);line-height:1.7;max-width:34rem}
.values-photo{border-radius:var(--radius-pill);overflow:hidden;box-shadow:inset 0 0 0 1px var(--hairline);width:5rem;height:5rem}
@media (min-width:640px){ .values-photo{width:6rem;height:6rem} }
.values-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(0.15)}
.leaf-deco{display:none;position:absolute;right:-2rem;top:2rem;width:9rem;opacity:.5;pointer-events:none;z-index:-1}
@media (min-width:1024px){ .leaf-deco{display:block} }

/* ---------- Founder (Основатель компании) ---------- */
.founder{background:var(--surface);padding:6rem 1.5rem}
@media (min-width:640px){ .founder{padding:6rem 2.5rem} }
.founder-layout{margin-top:3rem;max-width:40rem}
.founder-content{display:flex;flex-direction:column;gap:1.5rem}
.founder-identity{display:flex;align-items:center;gap:1.25rem}
.founder-photo-frame{position:relative;flex:none;width:5rem;height:5rem;border-radius:var(--radius-pill);overflow:hidden;box-shadow:inset 0 0 0 1px var(--hairline)}
@media (min-width:640px){ .founder-photo-frame{width:6rem;height:6rem} }
.founder-photo-frame img{width:100%;height:100%;object-fit:cover;filter:grayscale(0.15)}
.founder-name{font-size:1.5rem;font-weight:500;color:var(--ink);letter-spacing:-0.01em}
@media (min-width:640px){ .founder-name{font-size:1.75rem} }
.founder-role{margin-top:0.4rem;font-size:0.8125rem;font-weight:500;color:var(--ink-soft);text-transform:uppercase;letter-spacing:0.12em}
.founder-bio{font-size:0.9375rem;color:var(--ink-soft);line-height:1.75;max-width:34rem}
.founder-quote{position:relative;padding:1.5rem 1.75rem;background:var(--surface-card);border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--hairline)}
.founder-quote .quote-glyph{display:block;font-size:2.5rem;color:var(--brand);line-height:0.6;margin-bottom:0.5rem}
.founder-quote blockquote{font-size:1.1875rem;line-height:1.5;color:var(--ink);font-weight:500;letter-spacing:-0.01em}
@media (min-width:640px){ .founder-quote blockquote{font-size:1.375rem} }
.founder-quote figcaption{margin-top:1rem;font-size:0.8125rem;color:var(--ink-soft)}

/* ---------- Actions (Действия) ---------- */
.actions{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius-card-lg);background:var(--brand-deep);margin-top:0.75rem;padding:3.5rem 1.5rem}
@media (min-width:640px){ .actions{padding:4rem 2.5rem} }

.actions-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem}
@media (min-width:640px){ .actions-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem} }
@media (min-width:1024px){ .actions-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }

.action-card{display:flex;flex-direction:column;gap:1.75rem;min-height:11rem;border-radius:var(--radius-card);padding:2rem;transition:transform .3s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
.action-card:hover{transform:translateY(-4px)}

.action-card--primary{background:#fff;color:var(--brand-deep);box-shadow:0 1.5rem 3rem rgba(0,0,0,.25)}
.action-card--primary:hover{background:var(--brand-light)}

.action-card--outline{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.22);color:#fff}
.action-card--outline:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.45)}

.action-card-icon{width:3.25rem;height:3.25rem;display:grid;place-items:center;border-radius:var(--radius-pill);flex:none}
.action-card--primary .action-card-icon{background:var(--surface);color:var(--brand-deep)}
.action-card--outline .action-card-icon{background:rgba(255,255,255,.12);color:#fff}
.action-card-icon svg{width:1.5rem;height:1.5rem}

.action-card-title{margin-top:auto;font-size:1.375rem;font-weight:500;line-height:1.25;letter-spacing:-0.01em}
@media (min-width:640px){ .action-card-title{font-size:1.5rem} }

.action-card-cta{display:inline-flex;align-items:center;gap:0.5rem;font-size:0.8125rem;font-weight:500;text-transform:uppercase;letter-spacing:0.08em}
.action-card-cta .pill-arrow{width:1rem;height:1rem;transition:transform .25s ease}
.action-card:hover .pill-arrow{transform:translateX(5px)}

/* ---------- Social / полезные ссылки ---------- */
.social-section{position:relative;background:var(--background);padding:6rem 1.5rem}
@media (min-width:640px){ .social-section{padding:6rem 2.5rem} }
.link-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;margin-top:3rem}
@media (min-width:768px){ .link-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.link-card{display:flex;flex-direction:column;gap:1rem;border-radius:var(--radius-card);background:var(--surface);padding:1.75rem;transition:background-color .2s ease,transform .3s ease}
.link-card:hover{background:var(--brand-deep);color:#fff;transform:translateY(-4px)}
.link-card:hover .link-card-desc{color:rgba(255,255,255,.75)}
.link-card:hover .link-icon{background:#fff;color:var(--brand-deep)}
.link-icon{width:2.75rem;height:2.75rem;display:grid;place-items:center;border-radius:var(--radius-pill);background:var(--brand-deep);color:#fff;transition:background-color .2s ease,color .2s ease}
.link-icon svg{width:1.25rem;height:1.25rem}
.link-card h3{font-size:1.0625rem;font-weight:500}
.link-card-desc{font-size:0.8125rem;color:var(--ink-soft);line-height:1.5;transition:color .2s ease}
.link-card-cta{font-size:0.75rem;text-transform:uppercase;letter-spacing:0.05em;text-decoration:underline;margin-top:auto}

/* ---------- Footer ---------- */
.site-footer{position:relative;overflow:hidden;background:var(--brand-deep);color:#fff;border-radius:var(--radius-card-lg);margin-top:0.75rem;padding:3.5rem 1.5rem}
.cup-deco{display:none;position:absolute;left:58%;bottom:0;width:9rem;pointer-events:none;z-index:-1;filter:drop-shadow(0 1.5rem 2.5rem rgba(0,0,0,.4))}
@media (min-width:1024px){ .cup-deco{display:block} }
@media (min-width:1280px){ .cup-deco{width:10rem} }
@media (min-width:640px){ .site-footer{padding:4rem 2.5rem} }
.footer-cta{position:relative;isolation:isolate;border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:3.5rem;display:flex;flex-direction:column;gap:1.5rem}
@media (min-width:640px){ .footer-cta{flex-direction:row;justify-content:space-between;align-items:flex-end} }
.footer-cta-title{font-size:clamp(1.75rem, 8vw, 2.25rem);font-weight:500;line-height:1.05;letter-spacing:-0.01em;margin-top:1rem;max-width:20ch}
@media (min-width:640px){ .footer-cta-title{font-size:3rem} }
@media (min-width:768px){ .footer-cta-title{font-size:3.75rem} }
.footer-columns{display:grid;grid-template-columns:minmax(0,1fr);gap:2.5rem;padding:3.5rem 0}
@media (min-width:768px){ .footer-columns{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)} }
.footer-brand{max-width:20rem}
.footer-brand .header-brand{font-size:0.75rem;letter-spacing:0.12em;justify-content:flex-start}
@media (min-width:480px){ .footer-brand .header-brand{font-size:0.9375rem;letter-spacing:0.16em} }
@media (min-width:640px){ .footer-brand .header-brand{font-size:1.125rem;letter-spacing:0.2em} }
.footer-blurb{font-size:0.875rem;color:rgba(255,255,255,.65);margin-top:1rem}
.footer-address{font-style:normal;margin-top:1.5rem;color:rgba(255,255,255,.8);font-size:0.875rem;display:flex;flex-direction:column;gap:0.4rem}
.footer-address a:hover{text-decoration:underline}
.footer-address .muted{color:rgba(255,255,255,.55)}
.footer-nav-heading{font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.2em;color:rgba(255,255,255,.5)}
.footer-nav ul{margin-top:1rem;display:flex;flex-direction:column;gap:0.75rem;font-size:0.875rem;color:rgba(255,255,255,.8)}
.footer-nav a:hover{text-decoration:underline}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:2rem;font-size:0.875rem;color:rgba(255,255,255,.6);display:flex;flex-direction:column;gap:1.25rem}
@media (min-width:640px){ .footer-bottom{flex-direction:row;justify-content:space-between;align-items:center} }
.social-nav,.legal-nav{display:flex;gap:1.25rem}
.social-nav a:hover,.legal-nav a:hover{color:#fff}

/* ---------- Modal ---------- */
.modal-overlay{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-end;justify-content:center;padding:0.75rem;pointer-events:none}
@media (min-width:640px){ .modal-overlay{align-items:center;padding:1.5rem} }
.modal-overlay.open{pointer-events:auto}
.modal-backdrop{position:absolute;inset:0;background:rgba(74,74,76,.4);backdrop-filter:blur(6px);opacity:0}
.modal-panel{position:relative;max-height:92svh;overflow-y:auto;border-radius:var(--radius-card-lg);background:var(--surface-card);color:var(--ink);padding:1.5rem;width:100%;box-shadow:0 2rem 4rem rgba(74,74,76,.35);opacity:0}
@media (min-width:640px){ .modal-panel{padding:2rem;max-width:32rem} }
.modal-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.modal-close,.menu-close{width:2.5rem;height:2.5rem;border-radius:var(--radius-pill);background:var(--surface);display:grid;place-items:center;flex:none;transition:background-color .2s ease}
.modal-close:hover{background:var(--hairline)}
.modal-close svg,.menu-close svg{width:1.125rem;height:1.125rem}
#modalTitle{font-size:2.25rem;font-weight:500;line-height:0.95;margin-top:0.75rem}
@media (min-width:640px){ #modalTitle{font-size:3rem} }
.contact-form{margin-top:1.75rem;display:flex;flex-direction:column;gap:1rem}
.field{display:flex;flex-direction:column;gap:0.5rem}
.field-label{font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.18em;color:var(--ink-soft)}
.field input,.field textarea{width:100%;border-radius:0.75rem;border:1px solid var(--hairline);background:var(--background);padding:0.75rem 1rem;font-size:0.875rem;transition:border-color .2s ease,box-shadow .2s ease}
.field input:focus,.field textarea:focus{border-color:var(--brand-light);box-shadow:0 0 0 3px rgba(223,197,172,.4);outline:none}
.submit-btn{border-radius:var(--radius-pill);background:var(--ink);color:#fff;padding:0.875rem 1.75rem;font-size:0.875rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em;align-self:flex-start;transition:background-color .2s ease,opacity .2s ease}
.submit-btn:hover{background:var(--brand-deep)}
.submit-btn:disabled{opacity:.6;cursor:default}
.success-panel{margin-top:2rem;border-radius:var(--radius-card);background:var(--surface);padding:1.5rem;text-align:center}
.success-panel[hidden]{display:none}
.success-icon{width:3rem;height:3rem;border-radius:var(--radius-pill);background:var(--brand);display:grid;place-items:center;margin:0 auto}
.success-icon svg{width:1.5rem;height:1.5rem}
.success-title{font-size:1.125rem;font-weight:500;margin-top:0.75rem}
.success-sub{font-size:0.875rem;color:var(--ink-soft);margin-top:0.5rem}
.success-panel .pill-btn{margin-top:1.25rem}

/* ---------- Menu overlay ---------- */
.menu-overlay{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;pointer-events:none;padding:0.5rem}
@media (min-width:640px){ .menu-overlay{padding:0.75rem} }
.menu-overlay.open{pointer-events:auto}
.menu-backdrop{position:absolute;inset:0;background:var(--brand-deep);opacity:0}
.menu-panel{position:relative;flex:1;display:flex;flex-direction:column;color:#fff;padding:1.5rem;opacity:0}
@media (min-width:640px){ .menu-panel{padding:2.5rem} }
.menu-top{display:flex;align-items:center;justify-content:space-between}
.menu-close{background:rgba(255,255,255,.15)}
.menu-close:hover{background:rgba(255,255,255,.25)}
.menu-nav{flex:1;display:flex;flex-direction:column;justify-content:center;gap:0.5rem}
.menu-link{display:block;font-size:2.25rem;font-weight:500;letter-spacing:-0.01em;transition:color .2s ease}
@media (min-width:640px){ .menu-link{font-size:3.25rem} }
.menu-link:hover{color:var(--brand-light)}
.menu-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:2rem;display:flex;flex-direction:column;gap:1.25rem}
@media (min-width:640px){ .menu-bottom{flex-direction:row;justify-content:space-between;align-items:center} }