/* ==========================================================================
   ANVELOPE NFS — Design System
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap');

:root{
  /* Color */
  --c-black:       #0A0A0B;
  --c-charcoal:    #16171A;
  --c-charcoal-2:  #1C1D21;
  --c-charcoal-3:  #232427;
  --c-line:        #2B2C30;
  --c-white:       #F5F5F4;
  --c-muted:       #9A9B9F;
  --c-muted-2:     #6C6D71;
  --c-accent:      #E31B12;
  --c-accent-hi:   #FF3A2E;
  --c-accent-dim:  rgba(227,27,18,.14);
  --c-success:     #3DBE7A;

  /* Type */
  --f-display: 'Space Grotesk', 'Inter', sans-serif;
  --f-body:    'Inter', sans-serif;
  --f-mono:    'JetBrains Mono', monospace;

  /* Layout */
  --wrap: 1180px;
  --radius: 14px;
  --radius-sm: 8px;
  --gap: clamp(1.25rem, 3vw, 2.5rem);

  /* Motion */
  --ease: cubic-bezier(.22,.61,.36,1);
}

@media (prefers-color-scheme: light){ :root{ } }

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *,*::before,*::after{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

body{
  margin:0;
  background: var(--c-black);
  color: var(--c-white);
  font-family: var(--f-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  padding-bottom: env(safe-area-inset-bottom);
}

img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; }

h1,h2,h3,h4{ font-family: var(--f-display); font-weight: 600; line-height: 1.12; margin: 0 0 .5em; letter-spacing: -.01em; }
h1{ font-size: clamp(2.2rem, 5vw, 3.6rem); letter-spacing: -.02em; }
h2{ font-size: clamp(1.6rem, 3.2vw, 2.4rem); }
h3{ font-size: 1.2rem; }
p{ margin: 0 0 1em; color: var(--c-muted); }

:focus-visible{ outline: 2px solid var(--c-accent); outline-offset: 3px; border-radius: 4px; }

.wrap{ max-width: var(--wrap); margin-inline:auto; padding-inline: clamp(1.25rem, 4vw, 2.5rem); }
.section{ padding: clamp(3.5rem,7vw,6.5rem) 0; }
.section-tight{ padding: clamp(2rem,4vw,3.5rem) 0; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.5em;
  font-family: var(--f-mono); font-size: .72rem; letter-spacing:.14em; text-transform:uppercase;
  color: var(--c-accent); margin-bottom: 1rem;
}
.eyebrow::before{ content:''; width:16px; height:2px; background: var(--c-accent); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family: var(--f-body); font-weight:600; font-size:.95rem;
  padding: .9em 1.5em; border-radius: 999px; border: 1px solid transparent;
  cursor:pointer; white-space:nowrap; transition: transform .15s var(--ease), background .15s, border-color .15s, opacity .15s;
}
.btn:active{ transform: scale(.97); }
.btn-primary{ background: var(--c-accent); color:#fff; }
.btn-primary:hover{ background: var(--c-accent-hi); }
.btn-ghost{ background: transparent; color: var(--c-white); border-color: var(--c-line); }
.btn-ghost:hover{ border-color: var(--c-muted); }
.btn-whatsapp{ background:#20BD5C; color:#fff; }
.btn-whatsapp:hover{ background:#27d16a; }
.btn-block{ width:100%; }
.btn-sm{ padding:.6em 1.1em; font-size:.85rem; }
.btn svg{ width:1.1em; height:1.1em; flex-shrink:0; }

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 50;
  background: rgba(10,10,11,.86); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--c-line);
}
.site-header .wrap{ position:relative; display:flex; align-items:center; justify-content:space-between; height:72px; }
.logo{ display:flex; align-items:center; }
.logo img{ height:75px; width:auto; display:block; }
.logo-text{ font-family: var(--f-display); font-weight:700; font-size:1.15rem; letter-spacing:-.01em; display:flex; align-items:center; gap:.15em; }
.logo-text .dot{ color: var(--c-accent); }
.nav-desktop{ display:none; }
.nav-desktop ul{ display:flex; gap: 1.75rem; }
.nav-desktop a{ font-size:.92rem; color: var(--c-muted); font-weight:500; transition:color .15s; }
.nav-desktop a:hover, .nav-desktop a[aria-current="page"]{ color: var(--c-white); }
.nav-desktop .has-dropdown{ position:relative; }
.nav-desktop .dd-trigger{ display:inline-flex; align-items:center; gap:.35em; cursor:pointer; background:none; border:none; font:inherit; padding:0; }
.nav-desktop .dd-trigger svg{ width:12px; height:12px; transition: transform .15s var(--ease); }
.nav-desktop .has-dropdown:hover .dd-trigger svg,
.nav-desktop .has-dropdown:focus-within .dd-trigger svg{ transform: rotate(180deg); }
.dropdown-menu{
  display:none;
  position:absolute;
  top:calc(100% + 14px);
  left:50%;
  transform:translateX(-50%);
  background:var(--c-charcoal);
  border:1px solid var(--c-line);
  border-radius:14px;
  padding:.6rem;
  min-width:240px;
  box-shadow:0 24px 48px rgba(0,0,0,.5);
  z-index:10;
}

.dropdown-menu::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-14px;
  height:14px;
}
.nav-desktop .has-dropdown:hover .dropdown-menu,
.nav-desktop .has-dropdown:focus-within .dropdown-menu{ display:block; }
.dropdown-menu a{ display:block; padding:.65em .8em; border-radius:8px; font-size:.88rem; color: var(--c-muted); white-space:nowrap; }
.dropdown-menu a:hover{ background: var(--c-charcoal-3); color: var(--c-white); }
@media (min-width: 900px){ .nav-desktop{ display:block; } }
.header-cta{ display:flex; align-items:center; gap:.5rem; }
.header-cta .btn{ padding:.6em .9em; font-size:.85rem; }
.icon-btn{ width:40px; height:40px; padding:0 !important; border-radius:50%; }
.icon-btn svg{ width:1.15em; height:1.15em; }
.icon-btn .btn-txt{ display:none; }

.nav-toggle{
  display:flex; align-items:center; justify-content:center; width:40px; height:40px;
  background: var(--c-charcoal-3); border:1px solid var(--c-line); border-radius:10px; cursor:pointer; flex-shrink:0;
}
.nav-toggle svg{ width:20px; height:20px; }
@media (min-width: 900px){ .nav-toggle{ display:none; } }

.nav-mobile-panel{
  display:none; position:absolute; top:72px; left:0; right:0;
  background: var(--c-black); border-bottom:1px solid var(--c-line);
  max-height:0; overflow:hidden; transition: max-height .25s var(--ease);
}
.nav-mobile-panel.is-open{ display:block; max-height:80vh; overflow-y:auto; }
.nav-mobile-panel ul{ padding: .5rem clamp(1.25rem,4vw,2.5rem) 1.25rem; }
.nav-mobile-panel li{ border-bottom:1px solid var(--c-line); }
.nav-mobile-panel li:last-child{ border-bottom:none; }
.nav-mobile-panel a{ display:block; padding: 1rem 0; font-weight:600; font-size:1.02rem; color: var(--c-white); }
.nav-mobile-panel .nav-mobile-cta{ display:flex; gap:.75rem; padding: 1rem clamp(1.25rem,4vw,2.5rem) 1.5rem; border-top:1px solid var(--c-line); margin-top:.25rem; }
.nav-mobile-panel .nav-mobile-cta .btn{ flex:1; display:flex; align-items:center; justify-content:center; }
@media (min-width: 900px){ .nav-mobile-panel{ display:none !important; } }

/* ---------- Hero ---------- */
.hero{ position:relative; padding: clamp(3rem,8vw,6rem) 0 clamp(2.5rem,6vw,4rem); overflow:hidden; }
.hero-grid{ display:grid; gap: 2.5rem; align-items:center; }
@media (min-width: 960px){ .hero-grid{ grid-template-columns: 1.1fr .9fr; } }
.hero h1{ margin-bottom:.55em; }
.hero .lede{ font-size: 1.1rem; max-width: 46ch; color: var(--c-white); opacity:.72; }
.hero-cta-row{ display:flex; flex-wrap:wrap; gap:.85rem; margin-top: 1.75rem; }
.hero-trust{ display:flex; flex-wrap:wrap; gap: 1.75rem; margin-top: 2.5rem; padding-top: 1.75rem; border-top:1px solid var(--c-line); }
.hero-trust .stat b{ display:block; font-family: var(--f-mono); font-size:1.3rem; color:var(--c-white); }
.hero-trust .stat span{ font-size:.8rem; color: var(--c-muted-2); }

/* Signature: diagonal before/after visual */
.rim-art{ position:relative; aspect-ratio: 1/1; border-radius: var(--radius); overflow:hidden; border:1px solid var(--c-line); background: var(--c-charcoal); }
.rim-art .half{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.rim-art .half.before{ clip-path: polygon(0 0, 62% 0, 38% 100%, 0 100%); background: linear-gradient(155deg,#1a1a1c,#0c0c0d); }
.rim-art .half.after{ clip-path: polygon(62% 0, 100% 0, 100% 100%, 38% 100%); background: linear-gradient(155deg, #232025, #150d0a); }
.rim-art .divider{ position:absolute; top:0; bottom:0; left:49.5%; width:2px; background: var(--c-accent); transform: skewX(-13.5deg); box-shadow: 0 0 24px var(--c-accent); }
.rim-art .tag{ position:absolute; bottom:14px; font-family: var(--f-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; padding:.4em .7em; border-radius:99px; background:rgba(0,0,0,.5); border:1px solid var(--c-line); }
.rim-art .tag.tag-before{ left:14px; color: var(--c-muted); }
.rim-art .tag.tag-after{ right:14px; color: var(--c-accent-hi); }
.rim-svg{ width:62%; opacity:.9; }
.rim-art .before .rim-svg{ filter: grayscale(1) brightness(.6); }
.rim-art .after .rim-svg{ filter: drop-shadow(0 0 18px rgba(255,74,38,.35)); }

.rim-art .rim-photo{
  width:100%; height:100%; object-fit:cover; display:block;
}
.rim-art .before .rim-photo{ filter: grayscale(1) brightness(.75); }
.rim-art .after .rim-photo{ filter: saturate(1.1); }

/* ---------- Cards / services grid ---------- */
.grid{ display:grid; gap: var(--gap); }
.services-grid{ grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); }
.card{
  background: var(--c-charcoal); border:1px solid var(--c-line); border-radius: var(--radius);
  padding: 1.75rem; transition: border-color .2s, transform .2s var(--ease);
}
.card:hover{ border-color:#3a3b40; transform: translateY(-3px); }
.card .icon{ width:42px; height:42px; border-radius:10px; background: var(--c-accent-dim); display:flex; align-items:center; justify-content:center; margin-bottom:1.1rem; }
.card .icon svg{ width:22px; height:22px; color: var(--c-accent); }
.card h3{ margin-bottom:.4em; }
.card p{ font-size:.92rem; margin-bottom: 1rem; }
.card .card-link{ font-size:.85rem; font-weight:600; color: var(--c-white); display:inline-flex; align-items:center; gap:.4em; }
.card .card-link svg{ width:14px; height:14px; transition: transform .15s; }
.card:hover .card-link svg{ transform: translateX(3px); }

/* ---------- Lug badges (process steps) ---------- */
.lug-badge{
  width:46px; height:46px; border-radius:50%; border:1.5px solid var(--c-line);
  display:flex; align-items:center; justify-content:center; position:relative; flex-shrink:0;
  font-family: var(--f-mono); font-size:.75rem; color: var(--c-accent);
}
.lug-badge::before{
  content:''; position:absolute; inset:6px; border-radius:50%;
  background:
    radial-gradient(circle at 50% 12%, var(--c-line) 0 2.5px, transparent 2.5px),
    radial-gradient(circle at 88% 38%, var(--c-line) 0 2.5px, transparent 2.5px),
    radial-gradient(circle at 74% 88%, var(--c-line) 0 2.5px, transparent 2.5px),
    radial-gradient(circle at 26% 88%, var(--c-line) 0 2.5px, transparent 2.5px),
    radial-gradient(circle at 12% 38%, var(--c-line) 0 2.5px, transparent 2.5px);
}
.process-row{ display:flex; gap:1.1rem; align-items:flex-start; }
.process-row + .process-row{ margin-top: 1.75rem; padding-top:1.75rem; border-top:1px dashed var(--c-line); }
.process-row h3{ margin-bottom:.3em; }
.process-row p{ font-size:.92rem; margin:0; }

/* ---------- Pricing tables ---------- */
.price-table{ width:100%; border-collapse:collapse; font-size:.92rem; }
.price-table th,.price-table td{ padding: .85em 1em; text-align:left; border-bottom:1px solid var(--c-line); }
.price-table th{ font-family: var(--f-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color: var(--c-muted-2); font-weight:600; }
.price-table td.price{ font-family: var(--f-mono); color: var(--c-accent-hi); font-weight:600; text-align:right; }
.price-table tr:last-child td{ border-bottom:none; }
.price-note{ font-size:.82rem; color: var(--c-muted-2); margin-top:.75rem; }
.table-scroll{ overflow-x:auto; border:1px solid var(--c-line); border-radius: var(--radius); background: var(--c-charcoal); }
.table-scroll .price-table{ min-width: 420px; }
.table-scroll th:first-child,.table-scroll td:first-child{ padding-left:1.25rem; }
.table-scroll th:last-child,.table-scroll td:last-child{ padding-right:1.25rem; }

/* ---------- Calculator ---------- */
.calc{
  background: linear-gradient(165deg, var(--c-charcoal-2), var(--c-charcoal));
  border:1px solid var(--c-line); border-radius: 20px; padding: clamp(1.5rem,3vw,2.5rem);
}
.calc-grid{ display:grid; gap: 2rem; }
@media (min-width: 860px){ .calc-grid{ grid-template-columns: 1.15fr .85fr; } }
.field-group{ margin-bottom: 1.6rem; }
.field-label{ display:block; font-size:.82rem; font-weight:600; color: var(--c-white); margin-bottom:.7rem; }
.field-label .hint{ font-weight:400; color: var(--c-muted-2); font-size:.8rem; }

.seg{ display:grid; grid-template-columns: repeat(3,1fr); gap:.6rem; }
.seg button{
  background: var(--c-charcoal-3); border:1px solid var(--c-line); color: var(--c-muted);
  border-radius: 10px; padding: .85em .5em; font-size:.85rem; font-weight:600; cursor:pointer;
  transition: all .15s var(--ease);
}
.seg button.is-active{ background: var(--c-accent-dim); border-color: var(--c-accent); color: var(--c-white); }

.stepper{ display:flex; align-items:center; gap:1rem; background: var(--c-charcoal-3); border:1px solid var(--c-line); border-radius: 12px; padding: .4rem; }
.stepper button{ width:46px; height:46px; border-radius:9px; border:none; background: var(--c-charcoal); color: var(--c-white); font-size:1.3rem; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.stepper button:hover{ background: var(--c-accent); }
.stepper button:disabled{ opacity:.3; cursor:not-allowed; background:var(--c-charcoal); }
.stepper output{ flex:1; text-align:center; font-family: var(--f-mono); font-size:1.4rem; font-weight:600; }
.stepper output span{ font-size:.85rem; color: var(--c-muted-2); }

.toggle-row{ display:flex; align-items:center; justify-content:space-between; gap:1rem; background: var(--c-charcoal-3); border:1px solid var(--c-line); border-radius: 12px; padding: .95rem 1.1rem; margin-bottom:.7rem; }
.toggle-row.is-disabled{ opacity:.4; }
.toggle-row .t-label{ font-size:.9rem; font-weight:600; }
.toggle-row .t-sub{ font-size:.78rem; color: var(--c-muted-2); margin-top:.15rem; }
.switch{ position:relative; width:46px; height:26px; flex-shrink:0; }
.switch input{ position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.switch .track{ position:absolute; inset:0; background: var(--c-line); border-radius:99px; transition: background .15s; }
.switch .thumb{ position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition: transform .15s var(--ease); }
.switch input:checked + .track{ background: var(--c-accent); }
.switch input:checked ~ .thumb{ transform: translateX(20px); }
.switch input:disabled + .track{ opacity:.5; }

.calc-result{
  background: var(--c-black); border:1px solid var(--c-line); border-radius: 16px; padding: 1.75rem;
  position: sticky; top: 90px; align-self: start;
}
.calc-result .r-label{ font-family: var(--f-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color: var(--c-muted-2); }
.calc-result .r-price{ font-family: var(--f-mono); font-size: clamp(2.1rem,4vw,2.8rem); font-weight:700; color: var(--c-white); margin: .3rem 0 .2rem; display:flex; align-items:baseline; gap:.35rem; }
.calc-result .r-price small{ font-size:.4em; color: var(--c-muted); font-weight:500; }
.calc-result .r-breakdown{ margin: 1.25rem 0; border-top:1px solid var(--c-line); padding-top:1rem; }
.calc-result .r-breakdown li{ display:flex; justify-content:space-between; font-size:.85rem; color: var(--c-muted); padding:.3rem 0; }
.calc-result .r-breakdown li span:last-child{ font-family: var(--f-mono); color: var(--c-white); }
.calc-result .r-note{ display:none; font-size:.82rem; background: var(--c-accent-dim); color: var(--c-accent-hi); border-radius:10px; padding:.85em 1em; margin-bottom:1.25rem; line-height:1.4; }
.calc-result .r-note.is-visible{ display:block; }
.indr-note{ display:none; margin-top:.7rem; }
.indr-note.is-visible{ display:block; }
.calc-result .btn{ margin-top:.4rem; }

/* ---------- Before / After gallery ---------- */
.ba-grid{ grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); }
.ba-item{ border-radius: var(--radius); overflow:hidden; border:1px solid var(--c-line); background: var(--c-charcoal); }
.ba-compare{ position:relative; aspect-ratio: 4/3; overflow:hidden; }
.ba-compare .side{ position:absolute; inset:0; }
.ba-compare .side img{ width:100%; height:100%; object-fit:cover; display:block; }
.ba-compare .side.after{ clip-path: inset(0 0 0 50%); }
.ba-compare .side .cap{ position:absolute; bottom:10px; left:10px; font-family: var(--f-mono); font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:rgba(0,0,0,.55); padding:.3em .6em; border-radius:6px; }
.ba-compare input[type="range"]{
  position:absolute; inset:0; width:100%; height:100%; margin:0; appearance:none; background:transparent; cursor: ew-resize; z-index:5;
}
.ba-compare input[type="range"]::-webkit-slider-thumb{ appearance:none; width:2px; height:2000px; background:transparent; }
.ba-handle{ position:absolute; top:0; bottom:0; left:50%; width:2px; background:#fff; box-shadow:0 0 0 1px rgba(0,0,0,.3); pointer-events:none; z-index:4; }
.ba-handle::after{ content:'⟷'; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:34px; height:34px; background:#fff; color:#111; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.9rem; }
.ba-caption{ padding: 1.1rem 1.25rem; }
.ba-caption h3{ font-size:1rem; margin-bottom:.2em; }
.ba-caption p{ font-size:.85rem; margin:0; }
.placeholder-note{ font-family: var(--f-mono); font-size:.68rem; color: var(--c-muted-2); }

/* ---------- FAQ ---------- */
.faq-item{ border-bottom:1px solid var(--c-line); }
.faq-item:first-child{ border-top:1px solid var(--c-line); }
.faq-q{ width:100%; text-align:left; background:none; border:none; color: var(--c-white); padding: 1.25rem 0; display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; font-size:1rem; font-weight:600; font-family: var(--f-body); }
.faq-q .plus{ flex-shrink:0; width:22px; height:22px; position:relative; }
.faq-q .plus::before,.faq-q .plus::after{ content:''; position:absolute; background: var(--c-accent); top:50%; left:50%; transform:translate(-50%,-50%); }
.faq-q .plus::before{ width:14px; height:2px; }
.faq-q .plus::after{ width:2px; height:14px; transition: transform .2s var(--ease); }
.faq-item.is-open .plus::after{ transform: translate(-50%,-50%) rotate(90deg) scale(0); }
.faq-a{ max-height:0; overflow:hidden; transition: max-height .25s var(--ease); }
.faq-a p{ padding-bottom: 1.25rem; margin:0; font-size:.94rem; }

/* ---------- Breadcrumbs ---------- */
.breadcrumbs{ font-size:.8rem; color: var(--c-muted-2); padding: 1.1rem 0; }
.breadcrumbs a{ color: var(--c-muted-2); }
.breadcrumbs a:hover{ color: var(--c-white); }
.breadcrumbs span{ margin:0 .5em; }

/* ---------- Form ---------- */
.form-card{ background: var(--c-charcoal); border:1px solid var(--c-line); border-radius: var(--radius); padding: clamp(1.5rem,3vw,2.25rem); }
.form-row{ display:grid; gap:1rem; margin-bottom:1rem; }
@media (min-width:640px){ .form-row.cols-2{ grid-template-columns:1fr 1fr; } }
.form-row label{ display:block; font-size:.82rem; font-weight:600; margin-bottom:.5rem; }
.form-row input, .form-row select, .form-row textarea{
  width:100%; background: var(--c-charcoal-3); border:1px solid var(--c-line); color: var(--c-white);
  border-radius: 10px; padding:.85em 1em; font-family: var(--f-body); font-size:.95rem;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{ border-color: var(--c-accent); outline:none; }
.form-note{ font-size:.78rem; color: var(--c-muted-2); margin-top: .9rem; }
.form-row.has-error input, .form-row.has-error textarea{ border-color: var(--c-accent-hi); }
.field-error{ display:none; color: var(--c-accent-hi); font-size:.78rem; margin-top:.4rem; }
.form-row.has-error .field-error{ display:block; }
.form-success{ display:none; text-align:center; padding: 2.5rem 1rem; }
.form-success.is-visible{ display:block; }
.form-success .ok-icon{ width:52px; height:52px; border-radius:50%; background: var(--c-accent-dim); color: var(--c-accent); display:flex; align-items:center; justify-content:center; margin: 0 auto 1.1rem; }
.form-success .ok-icon svg{ width:26px; height:26px; }
.form-success h3{ margin-bottom:.4em; }
.form-fallback{ font-size:.82rem; margin-top:1.25rem; }
.form-fallback a{ color: var(--c-accent-hi); font-weight:600; }

/* ---------- CTA band ---------- */
.cta-band{ background: linear-gradient(120deg, var(--c-charcoal-2), var(--c-charcoal)); border:1px solid var(--c-line); border-radius: 20px; padding: clamp(2rem,5vw,3.5rem); text-align:center; }
.cta-band h2{ margin-bottom:.4em; }
.cta-band .btn-row{ display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center; margin-top:1.75rem; }

.map-embed{ border-radius: var(--radius); overflow:hidden; border:1px solid var(--c-line); }
.map-embed iframe{ display:block; width:100%; }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--c-line); padding: 3rem 0 2rem; margin-top: 2rem; }
.footer-grid{ display:grid; gap: 2.5rem; grid-template-columns: 1.3fr .8fr 1fr 1fr; }
@media (max-width: 900px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .footer-grid{ grid-template-columns: 1fr; } }
.footer-grid h4{ font-family: var(--f-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color: var(--c-muted-2); margin-bottom:1rem; }
.footer-grid li{ margin-bottom:.6rem; font-size:.88rem; }
.footer-grid a{ color: var(--c-muted); transition:color .15s; }
.footer-grid a:hover{ color: var(--c-white); }
.footer-bottom{ margin-top: 2.5rem; padding-top:1.5rem; border-top:1px solid var(--c-line); display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; font-size:.78rem; color: var(--c-muted-2); }

/* ---------- Utilities ---------- */
.text-center{ text-align:center; }
.mx-auto{ margin-inline:auto; }
.max-w-prose{ max-width:62ch; }
.mt-0{ margin-top:0; }
.tag-list{ display:flex; flex-wrap:wrap; gap:.5rem; margin: 1rem 0 0; }
.tag-list li{ font-family: var(--f-mono); font-size:.72rem; padding:.4em .8em; border-radius:99px; border:1px solid var(--c-line); color: var(--c-muted); }
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }
.placeholder-flag{ display:inline-block; font-family: var(--f-mono); font-size:.7rem; background: var(--c-accent-dim); color: var(--c-accent-hi); padding:.2em .6em; border-radius:6px; }
.two-col{ display:grid; gap: var(--gap); }
@media (min-width: 860px){ .two-col{ grid-template-columns: 1fr 1fr; align-items:center; } }
.check-list li{ display:flex; gap:.7em; margin-bottom:.75rem; font-size:.94rem; color: var(--c-white); }
.check-list li svg{ width:18px; height:18px; color: var(--c-success); flex-shrink:0; margin-top:.15em; }

.social-row{ display:flex; gap:.6rem; }
.social-row a{
  width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background: var(--c-charcoal-3); border:1px solid var(--c-line); color: var(--c-muted); transition: all .15s ease;
}
.social-row a:hover{ background: var(--c-accent); border-color: var(--c-accent); color:#fff; }
.social-row svg{ width:17px; height:17px; }

.rounded-img{ width:100%; border-radius: var(--radius); border:1px solid var(--c-line); object-fit:cover; }