@charset "UTF-8";
/* =============================================================
   VORMA WEB — v3, calm edition

   Changes made for eye comfort:
   1. No pure white on black. Headings #e6e9ec, body #b6bcc4.
      White on near black is about 18:1 contrast, which makes thin
      strokes glow (halation). 10:1 to 12:1 reads far better.
   2. Dihjauti only on the four big section headings. Everywhere
      else the sans. A high contrast display serif shimmers on dark.
   3. Teal is only used where something is clickable.
   4. One flat background colour. No spotlights, no section fades.
   5. No scroll animation and no hover lifts. Nothing moves.
   ============================================================= */

@font-face{
  font-family:"Dihjauti";
  src:url("../assets/fonts/Dihjauti-Regular.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Dihjauti";
  src:url("../assets/fonts/Dihjauti-Bold.woff2") format("woff2");
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"InterVar";
  src:url("../assets/fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  font-weight:100 900; font-style:normal; font-display:swap;
}

:root{
  /* one flat ground */
  --bg:#06080d;
  --panel:#0b0e14;

  /* text, stepped down from white so nothing glows */
  --head:#e8ebee;
  --text:#c3c9d0;
  --muted:#9ba3ab;
  --faint:#7b838c;

  --teal:#07afb0;
  --line:rgba(255,255,255,.075);
  --line-2:rgba(255,255,255,.14);

  --s0:.618rem;
  --s1:1rem;
  --s2:1.618rem;
  --s3:2.618rem;
  --s4:4.236rem;
  --s5:6.2rem;

  --f-display:"Dihjauti",Georgia,serif;
  --f-ui:"InterVar",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --t-hero:clamp(2.05rem,4.1vw,3.35rem);
  --t-h2:clamp(1.95rem,3.4vw,2.9rem);
  --t-body:1.0625rem;
  --t-small:.9375rem;
  --t-micro:.8125rem;

  --shell:1180px;
  --header-h:72px;
  --r:4px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 1rem)}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--f-ui); font-size:var(--t-body); line-height:1.65;
  font-weight:400; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button,input,select,textarea{font:inherit; color:inherit}
h1,h2,h3,h4{margin:0; color:var(--head); font-weight:500; line-height:1.15; letter-spacing:-.01em}
p{margin:0}
ul,ol{margin:0; padding:0; list-style:none}
svg{fill:currentColor}
::selection{background:var(--teal); color:#02181a}

.shell{width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:clamp(1.125rem,4vw,2.25rem)}
.skip-link{position:absolute; left:-9999px; top:0; z-index:200; background:var(--teal); color:#02181a; padding:.75rem 1.25rem}
.skip-link:focus{left:0}
:focus-visible{outline:2px solid var(--teal); outline-offset:3px}

/* the display serif appears here and nowhere else */
.h2{font-family:var(--f-display); font-weight:400; font-size:var(--t-h2); letter-spacing:0}
.h2-big{margin-bottom:var(--s3)}

/* ---------- Buttons: quiet, sentence case ---------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.8rem 1.4rem; border:1px solid var(--line-2); border-radius:var(--r);
  background:transparent; color:var(--head);
  font-size:.9375rem; font-weight:500; letter-spacing:0; cursor:pointer;
  transition:background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.btn:hover{background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.28)}
.btn-primary{background:var(--teal); border-color:var(--teal); color:#02181a; font-weight:560}
.btn-primary:hover{background:#0ac3c4; border-color:#0ac3c4; color:#02181a}
.btn-block{display:flex; width:100%}
.btn-ico{width:1.05rem; height:1.05rem; flex:none}

/* ═══════════════ HEADER ═══════════════ */
.site-header{position:fixed; inset:0 0 auto 0; z-index:100; background:transparent; transition:background .25s linear}
.site-header.is-scrolled{background:var(--bg); border-bottom:1px solid var(--line)}
.header-inner{height:var(--header-h); display:flex; align-items:center; gap:var(--s2)}

.brand{display:inline-flex; align-items:center; gap:.7rem; flex:none}
.brand-mark{height:30px; width:auto; flex:none}
.brand-word{height:13px; width:auto; flex:none}

.nav{display:flex; gap:var(--s2); margin-left:auto}
.nav a{font-size:.9375rem; color:var(--text); padding:.3rem 0; border-bottom:1px solid transparent; transition:color .2s var(--ease), border-color .2s var(--ease)}
.nav a:hover{color:var(--head); border-bottom-color:var(--teal)}

.header-actions{display:flex; align-items:center; gap:.9rem; margin-left:var(--s2)}

.cta-pill{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.5rem .95rem .5rem .8rem; border-radius:999px;
  background:var(--teal); color:#02181a; transition:background .2s var(--ease);
}
.cta-pill:hover{background:#0ac3c4}
.cta-ico{width:1.2rem; height:1.2rem; flex:none}
.cta-text{display:grid; line-height:1.15}
.cta-text em{font-style:normal; font-size:.625rem; letter-spacing:.1em; text-transform:uppercase; opacity:.75}
.cta-text strong{font-size:.875rem; font-weight:620; white-space:nowrap}

/* flags: brightness alone shows which one is on */
.lang{display:flex; align-items:center; gap:.45rem}
.lang-btn{
  background:none; border:0; padding:0; cursor:pointer;
  width:28px; height:19px; border-radius:2px; overflow:hidden; line-height:0;
  opacity:.3; transition:opacity .2s var(--ease);
}
.lang-btn svg{width:100%; height:100%; display:block}
.lang-btn:hover{opacity:.7}
.lang-btn.is-active{opacity:1}

.menu-toggle{
  display:none; width:38px; height:38px; border:1px solid var(--line-2);
  background:none; border-radius:var(--r); cursor:pointer;
  flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.menu-toggle span{display:block; width:16px; height:1.5px; background:var(--head); transition:transform .25s var(--ease)}
.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.25px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.25px) rotate(-45deg)}

.mobile-nav{display:none; background:var(--bg); border-top:1px solid var(--line); padding:var(--s1) 0 var(--s2); min-height:calc(100dvh - var(--header-h)); overflow-y:auto}
.mobile-nav nav{display:flex; flex-direction:column}
.mobile-nav nav a{font-size:1.25rem; color:var(--head); padding:.85rem clamp(1.125rem,4vw,2.25rem); border-bottom:1px solid var(--line)}
.lang-mobile{display:none; padding:var(--s2) clamp(1.125rem,4vw,2.25rem) 0}
.mobile-nav .lang-mobile{display:flex}
.lang-mobile .lang-btn{width:40px; height:27px}

/* ═══════════════ HERO ═══════════════ */
.hero{position:relative; isolation:isolate; padding-top:calc(var(--header-h) + var(--s5)); overflow:hidden}
.hero-bg{position:absolute; inset:0; z-index:-2}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:center 42%}
.hero::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(180deg,rgba(6,8,13,.86) 0%,rgba(6,8,13,.45) 30%,rgba(6,8,13,.8) 78%,var(--bg) 100%),
    linear-gradient(96deg,rgba(6,8,13,.92) 0%,rgba(6,8,13,.7) 45%,rgba(6,8,13,.3) 100%);
}
.hero-inner{padding-bottom:var(--s4)}
.hero-title{
  font-family:var(--f-display); font-weight:400; font-size:var(--t-hero);
  line-height:1.12; letter-spacing:-.012em; margin-bottom:var(--s2);
  color:var(--head); max-width:17ch; text-wrap:balance;
}
.hero-lead{max-width:54ch; color:var(--text); margin-bottom:var(--s3); font-size:1.0625rem}
.hero-cta{display:flex; flex-wrap:wrap; gap:.75rem; margin-bottom:var(--s1)}
.hero-link a{
  display:inline-flex; align-items:center; gap:.35rem; font-size:var(--t-small);
  color:var(--teal); border-bottom:1px solid transparent; transition:border-color .2s var(--ease);
}
.hero-link a:hover{border-bottom-color:var(--teal)}

.trust-strip{background:var(--bg)}
.trust-inner{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s1) var(--s2); padding-block:var(--s2)}
.trust-item{display:flex; flex-direction:column; gap:.15rem}
.trust-item strong{font-family:var(--f-display); font-size:1.5rem; font-weight:400; line-height:1; color:var(--head)}
.trust-item span{font-size:var(--t-small); color:var(--muted); line-height:1.45}

.whofor{
  border-top:1px solid var(--line); padding-block:var(--s2) var(--s4);
  max-width:none;
  font-size:var(--t-small); color:var(--muted);
}

/* ═══════════════ SECTIONS ═══════════════ */
.section{padding-block:var(--s5); background:var(--bg)}

/* ═══════════════ WORK ═══════════════ */
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s2)}
.card{
  display:flex; flex-direction:column; background:var(--panel);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden;
  transition:border-color .2s var(--ease);
}
.card:hover{border-color:var(--line-2)}
.card-media{position:relative; display:block; overflow:hidden; aspect-ratio:1.618/1; background:#0e131b}
.card-media img{width:100%; height:100%; object-fit:cover; object-position:top center; filter:saturate(.9) brightness(.9); transition:filter .25s var(--ease)}
.card-media:hover img{filter:saturate(1) brightness(1)}
.card-open{
  position:absolute; left:0; right:0; bottom:0; padding:.7rem var(--s1);
  background:linear-gradient(0deg,rgba(6,8,13,.94),rgba(6,8,13,0));
  font-size:var(--t-micro); color:var(--head);
  display:flex; align-items:center; gap:.4rem; opacity:0; transition:opacity .2s var(--ease);
}
.card-media:hover .card-open,.card-media:focus-visible .card-open{opacity:1}
.card-body{padding:var(--s2); display:flex; flex-direction:column; gap:.6rem; flex:1}
.card-label{font-size:var(--t-small); color:var(--muted)}
.card-title{font-size:1.4rem; font-weight:560}
.card-text{font-size:.9375rem; color:var(--text); line-height:1.6}
.chip-label{
  font-size:var(--t-micro); color:var(--faint); margin-top:.4rem;
  letter-spacing:.06em; text-transform:uppercase;
}
.delivered{display:grid; gap:.4rem}
.delivered li{position:relative; padding-left:1.25rem; font-size:.9375rem; color:var(--text); line-height:1.5}
.delivered li::before{
  content:""; position:absolute; left:.1rem; top:.42em; width:.3rem; height:.55rem;
  border-right:1.5px solid var(--teal); border-bottom:1.5px solid var(--teal); transform:rotate(42deg);
}
.card-outcome{
  font-size:.9375rem; color:var(--head); line-height:1.55;
  border-left:2px solid var(--teal); padding:.3rem 0 .3rem .75rem; margin-top:.3rem;
}
.card-visit{
  margin-top:auto; display:inline-flex; align-items:center; gap:.4rem;
  border-top:1px solid var(--line); padding-top:.9rem; font-size:var(--t-small);
  color:var(--teal); transition:color .2s var(--ease);
}
.card-visit:hover{color:#0ac3c4; text-decoration:underline; text-underline-offset:3px}

.disclosure{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:.5rem;
  width:100%; background:none; border:0; border-top:1px solid var(--line);
  padding:.85rem 0 0; cursor:pointer; text-align:left;
  font-size:var(--t-small); color:var(--muted); transition:color .2s var(--ease);
}
.disclosure:hover{color:var(--head)}
.chev{width:1.05rem; height:1.05rem; flex:none; fill:none; transition:transform .25s var(--ease)}
[aria-expanded="true"]>.chev{transform:rotate(180deg)}
.details{overflow:hidden}
.details p{font-size:var(--t-small); color:var(--muted); line-height:1.65; padding-top:.75rem}

/* ═══════════════ PACKAGES ═══════════════ */
.pkg-note{margin-bottom:var(--s3); max-width:62ch}
.pkg-note-big{font-family:var(--f-display); font-size:clamp(1.35rem,2.4vw,1.8rem); line-height:1.2; color:var(--head)}
.pkg-note-sub{margin-top:.5rem; color:var(--muted); font-size:.9375rem}

.plans{display:grid; grid-template-columns:1fr 1fr; gap:var(--s2); margin-bottom:var(--s2)}
.plan{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--r);
  padding:var(--s2); display:flex; flex-direction:column; gap:.7rem;
}
/* hovering a package lights it up, so the eye settles on one card */
.plan{transition:border-color .25s var(--ease), background-color .25s var(--ease), box-shadow .25s var(--ease)}
.plan:hover,.plan:focus-within{
  border-color:rgba(7,175,176,.55);
  background-color:#0e131b;
  box-shadow:0 0 0 1px rgba(7,175,176,.18), 0 12px 32px rgba(0,0,0,.35);
}
.plan-name{font-size:1.25rem; font-weight:560; letter-spacing:0}
.plan-for{font-size:var(--t-small); color:var(--muted); margin-top:-.25rem}
.plan-price{display:flex; flex-wrap:wrap; align-items:baseline; gap:.45rem}
.plan-price .from{font-size:var(--t-small); color:var(--muted)}
/* the price is set in the sans, heavier and smaller: no shimmer */
.plan-price strong{font-size:2.1rem; font-weight:600; line-height:1; color:var(--head); letter-spacing:-.02em}
.plan-time{font-size:var(--t-small); color:var(--muted); padding-bottom:var(--s1); border-bottom:1px solid var(--line)}

.plan-list{display:grid; gap:.5rem}
.plan-list li{position:relative; padding-left:1.35rem; font-size:.9375rem; color:var(--text); line-height:1.55}
.plan-list li::before{
  content:""; position:absolute; left:.15rem; top:.44em; width:.3rem; height:.56rem;
  border-right:1.5px solid var(--muted); border-bottom:1.5px solid var(--muted); transform:rotate(42deg);
}
.plan-list li.is-strong{color:var(--head); font-weight:540}
.plan-list-sm li{font-size:.875rem; color:var(--muted)}
.plan-list li.is-strong::before{border-color:var(--teal)}
.plan-list-out li{color:var(--faint)}
.plan-list-out li::before{border:0; width:.6rem; height:1px; background:var(--faint); top:.82em; transform:none}

.plan-inherit{
  font-size:1rem; font-weight:560; color:var(--head);
  border-left:2px solid var(--teal); padding:.35rem 0 .35rem .8rem;
}
.plan-sub{font-size:var(--t-micro); letter-spacing:.1em; text-transform:uppercase; color:var(--faint); margin-top:.4rem}

.addlist{display:grid; gap:.4rem}
.addlist li{display:flex; justify-content:space-between; align-items:baseline; gap:1rem; font-size:.875rem; color:var(--muted); border-bottom:1px solid var(--line); padding-bottom:.35rem}
.addlist em{font-style:normal; color:var(--text); white-space:nowrap}
.plan-cta{margin-top:var(--s1)}

.assure{
  display:flex; flex-wrap:wrap; gap:.5rem var(--s2);
  margin-bottom:var(--s2); padding:var(--s1) 0;
  border-block:1px solid var(--line);
}
.assure li{position:relative; padding-left:1.15rem; font-size:var(--t-small); color:var(--text)}
.assure li::before{
  content:""; position:absolute; left:.05rem; top:.42em; width:.3rem; height:.55rem;
  border-right:1.5px solid var(--teal); border-bottom:1.5px solid var(--teal); transform:rotate(42deg);
}

.care{border:1px solid var(--line); border-radius:var(--r); background:var(--panel); padding:var(--s2)}
.care-top{display:flex; flex-wrap:wrap; align-items:baseline; gap:.9rem; margin-bottom:var(--s1); padding-bottom:var(--s1); border-bottom:1px solid var(--line)}
.care-name{font-size:1.15rem; font-weight:560}
.care-price{font-size:1.6rem; font-weight:600; color:var(--head); letter-spacing:-.02em}
.care-price span{font-size:var(--t-small); font-weight:400; color:var(--muted); margin-left:.15rem}
.care-flag{margin-left:auto; border:1px solid var(--teal); color:var(--teal); font-size:.75rem; padding:.3rem .7rem; border-radius:999px}
.care-intro{font-size:.9375rem; color:var(--muted); margin-bottom:var(--s1)}
.care .care-list{display:block; columns:3; column-gap:var(--s3)}
.care .care-list li{margin-bottom:.45rem}
.care-foot{margin-top:var(--s1); font-size:var(--t-small); color:var(--muted)}

.tick{display:grid; gap:.4rem}
.tick li{position:relative; padding-left:1.15rem; font-size:.9375rem; color:var(--text); break-inside:avoid}
.tick li::before{content:""; position:absolute; left:0; top:.78em; width:.55rem; height:1px; background:var(--faint)}
.tick li.is-strong{color:var(--head); font-weight:520}

/* ═══════════════ PROCESS ═══════════════ */
.stages{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s2) var(--s3)}
.stages li{display:grid; grid-template-columns:2.2rem 1fr; gap:.75rem; align-items:start}
.stage-n{
  width:2.2rem; height:2.2rem; border-radius:50%; border:1px solid var(--teal);
  color:var(--teal); display:flex; align-items:center; justify-content:center;
  font-size:.9375rem; line-height:1;
}
.stages h3{font-size:1.0625rem; font-weight:560; margin-bottom:.3rem}
.stages p{font-size:.9375rem; color:var(--muted); line-height:1.6}

.disclosure-wide{margin-top:var(--s3); color:var(--text)}
.phases{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s2) var(--s3); padding-top:var(--s2)}
.phase-title{font-size:var(--t-small); font-weight:560; color:var(--head); margin-bottom:.6rem; padding-bottom:.5rem; border-bottom:1px solid var(--line-2)}
.steps-flat{display:grid; gap:.7rem; counter-reset:st}
.steps-flat li{display:grid; gap:.1rem}
.steps-flat span{font-size:.9375rem; color:var(--text)}
.steps-flat em{font-style:normal; font-size:var(--t-micro); color:var(--muted); line-height:1.5}

.quote-block{margin-top:var(--s4); border:1px solid var(--line); border-radius:var(--r); background:var(--panel); padding:var(--s2)}
.quote-intro{font-size:.9375rem; color:var(--muted); margin-bottom:var(--s1)}
.quote-title{font-size:1.15rem; font-weight:560; margin-bottom:var(--s1)}
.quote-block .tick{display:block; columns:3; column-gap:var(--s3)}
.quote-block .tick li{margin-bottom:.4rem}
.quote-foot{margin-top:var(--s1); padding-top:var(--s1); border-top:1px solid var(--line); font-size:var(--t-small); color:var(--muted)}

.quotes{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s2)}
.quote{margin:0; background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:var(--s2); display:grid; gap:var(--s1)}
.quote blockquote{margin:0}
.quote blockquote p{font-size:1rem; color:var(--text); line-height:1.6}
.quote figcaption{display:grid; border-top:1px solid var(--line); padding-top:.8rem}
.quote figcaption strong{font-size:.9375rem; color:var(--head); font-weight:560}
.quote figcaption span{font-size:var(--t-micro); color:var(--muted)}

/* ═══════════════ ABOUT ═══════════════ */
.about-grid{display:grid; grid-template-columns:61.8fr 38.2fr; gap:var(--s4); align-items:center}
.about-lead{color:var(--text); max-width:50ch; margin-block:var(--s2) var(--s1); font-size:1.0625rem}
.about-text{color:var(--muted); max-width:52ch; font-size:.9375rem; margin-bottom:var(--s3)}
.portrait{aspect-ratio:1/1.272; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--panel)}
.portrait img{width:100%; height:100%; object-fit:cover; filter:grayscale(.15)}
.portrait-ph{
  width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.7rem; color:var(--faint); text-align:center; padding:var(--s2);
}
.portrait-ph svg{width:2.4rem; height:2.4rem}
.portrait-ph span{font-size:var(--t-small); color:var(--faint)}

/* ═══════════════ CONTACT ═══════════════ */
.contact{position:relative; isolation:isolate; overflow:hidden; padding-block:var(--s5)}
.contact-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 60%; z-index:-2}
.contact::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,var(--bg) 0%,rgba(6,8,13,.86) 26%,rgba(6,8,13,.9) 74%,var(--bg) 100%);
}
.contact-grid{display:grid; grid-template-columns:61.8fr 38.2fr; gap:var(--s4); align-items:center}
.icon-row{display:flex; gap:.75rem; flex-wrap:wrap}
.icon-row a{
  width:3rem; height:3rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line-2); background:var(--panel); color:var(--text);
  transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.icon-row .ico{width:1.3rem; height:1.3rem}
.icon-row a:hover{background:var(--teal); border-color:var(--teal); color:#02181a}

.form-foot{font-size:var(--t-micro); color:var(--muted); text-align:center}
.contact-lead{color:var(--text); max-width:52ch; margin-block:var(--s2) var(--s3)}
.form-wrap{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:var(--s2)}
.form{display:grid; gap:var(--s1)}
.field{display:grid; gap:.35rem}
.field>span{font-size:var(--t-small); color:var(--muted)}
.field input,.field select{
  background:var(--bg); border:1px solid var(--line-2); border-radius:2px;
  padding:.75rem .85rem; font-size:.9375rem; width:100%; color:var(--head);
  transition:border-color .2s var(--ease);
}
.field select{appearance:none; cursor:pointer; background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position:calc(100% - 1.1rem) 1.2rem,calc(100% - .75rem) 1.2rem; background-size:5px 5px,5px 5px; background-repeat:no-repeat; padding-right:2.4rem}
.field select option{background:#0e131b; color:var(--head)}
.field input::placeholder{color:var(--faint)}
.field input:focus,.field select:focus{border-color:var(--teal); outline:none}

/* ═══════════════ FOOTER ═══════════════ */
.site-footer{background:var(--bg); border-top:1px solid var(--line); padding-top:var(--s4)}
.footer-inner{display:grid; grid-template-columns:1.5fr repeat(3,minmax(0,1fr)); gap:var(--s3) var(--s2); padding-bottom:var(--s4)}
.brand-lg .brand-mark{height:62px}
.brand-lg .brand-word{height:24px}
.footer-area{font-size:var(--t-small); color:var(--muted); margin-top:var(--s1); max-width:36ch}
.footer-col{display:grid; gap:.55rem; align-content:start}
.footer-col h4{font-size:var(--t-small); color:var(--head); font-weight:560; margin-bottom:.3rem}
.footer-col a,.footer-col span{font-size:var(--t-small); color:var(--muted); transition:color .2s var(--ease)}
.footer-col a:hover{color:var(--head)}
.foot-icons{display:flex; gap:.6rem; margin-bottom:.35rem}
.foot-icons a{
  width:2.4rem; height:2.4rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line-2); color:var(--text);
  transition:background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease);
}
.foot-icons a:hover{background:var(--teal); border-color:var(--teal); color:#02181a}
.foot-icons .ico{width:1.1rem; height:1.1rem}
.foot-mail{display:inline-flex; align-items:center; gap:.5rem}
.foot-mail .ico{width:1.15rem; height:1.15rem; flex:none; color:var(--teal)}
.footer-base{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.6rem;
  border-top:1px solid var(--line); padding-block:var(--s1) var(--s2);
  font-size:var(--t-small); color:var(--faint);
}

.wa-float{
  position:fixed; right:1rem; bottom:1rem; z-index:90;
  width:3.1rem; height:3.1rem; border-radius:50%; background:var(--teal); color:#02181a;
  display:none; align-items:center; justify-content:center;
  transition:background .2s var(--ease);
}
.wa-float svg{width:1.55rem; height:1.55rem}
.wa-float:hover{background:#0ac3c4}

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width:1080px){
  .nav{display:none}
  .cards{grid-template-columns:1fr 1fr}
  .cards .card:last-child{grid-column:1/-1}
  .cards .card:last-child .card-media{aspect-ratio:2.4/1}
  .stages,.phases,.quotes{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:920px){
  .about-grid,.contact-grid{grid-template-columns:1fr; gap:var(--s3)}
  .about-side{max-width:320px}
  .plans{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr 1fr; gap:var(--s2) var(--s3)}
  .footer-brand{grid-column:1/-1}
  .care .care-list,.quote-block .tick{columns:2}
  .quotes{grid-template-columns:1fr}
}
@media (max-width:780px){
  :root{--header-h:64px; --s5:4.6rem}
  .menu-toggle{display:flex}
  .cta-text em{display:none}
  .cta-pill{padding:.5rem .8rem; gap:.45rem}
  .cta-text strong{font-size:.8125rem}
  .cta-ico{width:1.1rem; height:1.1rem}
  .header-inner{gap:.6rem}
  .header-actions{gap:.5rem; margin-left:auto}
  .header-actions .lang{display:none}
  .brand-mark{height:26px}
  .brand-word{height:11px}
  .site-header{background:var(--bg); border-bottom:1px solid var(--line)}
  .mobile-nav{display:block}
  .mobile-nav[hidden]{display:none}
  .wa-float{display:flex}
  .trust-inner{grid-template-columns:1fr 1fr}
  .cards{grid-template-columns:1fr}
  .cards .card:last-child .card-media{aspect-ratio:1.618/1}
  .stages,.phases{grid-template-columns:1fr}
  .care .care-list,.quote-block .tick{columns:1}
  .assure{gap:.5rem 1rem}
  .hero{padding-top:calc(var(--header-h) + var(--s4))}
  .care-flag{margin-left:0}
}
@media (max-width:480px){
  .hero-cta{flex-direction:column; align-items:stretch}
  .hero-cta .btn{width:100%}
  .footer-inner{grid-template-columns:1fr}
  .step-d p{padding-left:0}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important}
}

/* ═══════════════ CONSENT BANNER ═══════════════ */
.lang-btn{display:block}

.consent{
  position:fixed; left:0; right:0; bottom:0; z-index:120;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:var(--s1) var(--s2);
  padding:var(--s1) clamp(1.125rem,4vw,2.25rem);
  background:var(--panel); border-top:1px solid var(--line);
  box-shadow:0 -12px 32px rgba(0,0,0,.45);
  transform:translateY(100%); transition:transform .3s var(--ease);
}
.consent.is-in{transform:none}
.consent-text{margin:0; max-width:64ch; font-size:var(--t-small); color:var(--muted)}
.consent-link{color:var(--teal); text-decoration:underline; text-underline-offset:2px}
.consent-actions{display:flex; gap:.6rem; flex-wrap:wrap}
.consent .btn{padding:.6rem 1.1rem; font-size:var(--t-small)}
body.consent-open .wa-float{bottom:7.5rem}

.foot-legal{color:var(--faint)}
.foot-legal:hover{color:var(--teal)}

/* ═══════════════ LEGAL PAGES ═══════════════ */
.legal{padding-block:var(--s5) var(--s4)}
.legal-wrap{max-width:70ch}
.legal h1{font-family:var(--f-display); font-weight:400; font-size:var(--t-h2); color:var(--head); margin-bottom:var(--s1)}
.legal h2{font-size:1.05rem; color:var(--head); margin-top:var(--s3); margin-bottom:var(--s0)}
.legal p,.legal li{color:var(--text); font-size:var(--t-body); line-height:1.65}
.legal p{margin-bottom:var(--s1)}
.legal ul{margin:0 0 var(--s1) 1.1rem}
.legal li{margin-bottom:.35rem}
.legal a{color:var(--teal)}
.legal .legal-meta{color:var(--faint); font-size:var(--t-small)}

@media (max-width:640px){
  .consent{flex-direction:column; align-items:flex-start}
  .consent-actions{width:100%}
  .consent .btn{flex:1 1 auto; justify-content:center}
  body.consent-open .wa-float{bottom:11rem}
}

/* Touch targets: the visible size stays the same, the tappable area
   grows to about 44px so phones register the tap reliably. */
.lang-btn,.icon-row a,.foot-icons a{position:relative}
.lang-btn::after{content:""; position:absolute; inset:-13px -9px}
.icon-row a::after,.foot-icons a::after{content:""; position:absolute; inset:-4px}