/* ==========================================================================
   VESTRA Wirtschaftskanzlei — Design System
   Relaunch 2026 · Wirtschaftsberatung für Unternehmer
   ========================================================================== */

:root{
  /* Farben */
  --ink:        #04202F;
  --navy:       #012234;
  --navy-deep:  #011A28;
  --petrol:     #153444;
  --green:      #3E7F2B;
  --green-btn:  #5F9B4E;
  --green-soft: #EDF3EA;
  --paper:      #FAF9F6;
  --paper-2:    #F2F1EB;
  --card:       #FFFFFF;

  --line:       rgba(1,34,52,.13);
  --line-soft:  rgba(1,34,52,.07);
  --line-dark:  rgba(255,255,255,.14);
  --muted:      rgba(4,32,47,.66);
  --muted-dark: rgba(255,255,255,.62);

  /* Typografie */
  /* Hausschrift Inter, lokal ausgeliefert — siehe assets/vestra-fonts.css */
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue",
           Helvetica, Arial, sans-serif;
  --serif: var(--sans);   /* Display-Rolle, gleiche Schrift, andere Behandlung */

  /* Maße */
  --wrap: 1200px;
  --gut: clamp(20px, 5vw, 48px);
  --sec: clamp(72px, 9vw, 140px);
  --r: 4px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(15.5px,1.06vw,17px);
  line-height:1.62;
  font-weight:400;
  letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

img,svg{ max-width:100%; height:auto; display:block; }

a{ color:inherit; }

/* --------------------------------------------------------------- Layout */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }
.wrap-narrow{ width:100%; max-width:820px; margin-inline:auto; padding-inline:var(--gut); }
.section{ padding-block:var(--sec); position:relative; }
.section--tight{ padding-block:clamp(52px,6vw,88px); }
.section--paper2{ background:var(--paper-2); }
.section--dark{ background:var(--navy); color:#fff; }
.section--dark .lede,.section--dark p{ color:var(--muted-dark); }
.rule{ height:1px; background:var(--line); border:0; margin:0; }

/* ------------------------------------------------------------ Typografie */
.eyebrow{
  display:flex; align-items:center; gap:12px;
  font-size:11px; font-weight:500; letter-spacing:.16em;
  text-transform:uppercase; color:var(--green);
  margin:0 0 22px;
}
.eyebrow::before{ content:""; width:26px; height:1px; background:currentColor; flex:none; opacity:.55; }
.section--dark .eyebrow{ color:#9FD08B; }

h1,h2,h3,h4{ margin:0; font-weight:400; letter-spacing:-.022em; }

.display{
  font-family:var(--serif);
  font-size:clamp(38px,5.4vw,68px);
  line-height:1.02;
  letter-spacing:-.028em;
  font-weight:300;
}
.h2{
  font-family:var(--serif);
  font-size:clamp(29px,3.5vw,46px);
  line-height:1.1;
  letter-spacing:-.024em;
  font-weight:300;
  max-width:19ch;
}
.h2--wide{ max-width:26ch; }
.h3{
  font-family:var(--sans);
  font-size:clamp(17px,1.35vw,20px);
  line-height:1.35;
  font-weight:600;
  letter-spacing:-.015em;
}
.lede{
  font-size:clamp(16.5px,1.25vw,19.5px);
  line-height:1.62;
  color:var(--muted);
  max-width:60ch;
  margin:26px 0 0;
}
.small{ font-size:14px; line-height:1.6; color:var(--muted); }
.section--dark .small{ color:var(--muted-dark); }

.sec-head{ max-width:var(--wrap); margin-bottom:clamp(40px,4.5vw,68px); }
.sec-head--split{ display:grid; grid-template-columns:1fr; gap:24px; }
@media(min-width:900px){
  .sec-head--split{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(40px,6vw,90px); align-items:end; }
  .sec-head--split .lede{ margin-top:0; }
}

.num{
  font-family:var(--sans); font-variant-numeric:tabular-nums;
  font-size:12px; letter-spacing:.08em; color:var(--green);
  font-weight:500;
}

/* --------------------------------------------------------------- Buttons */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:14px 24px; border-radius:var(--r);
  font-size:14.5px; font-weight:500; letter-spacing:-.005em;
  text-decoration:none; border:1px solid transparent;
  transition:background .22s ease,color .22s ease,border-color .22s ease,transform .22s ease;
  cursor:pointer; line-height:1;
}
.btn svg{ flex:none; transition:transform .22s ease; }
.btn:hover svg{ transform:translateX(3px); }
.btn--primary{ background:var(--green-btn); color:#fff; }
.btn--primary:hover{ background:#4E8840; }
.btn--ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--ink); }
.btn--onDark{ background:rgba(255,255,255,.05); color:#fff; border-color:var(--line-dark); }
.btn--onDark:hover{ background:rgba(255,255,255,.11); border-color:rgba(255,255,255,.3); }
.btn--sm{ padding:10px 17px; font-size:13.5px; }
.btn-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:36px; }

/* ---------------------------------------------------------------- Header */
.hdr{
  position:sticky; top:0; z-index:60;
  background:rgba(1,34,52,.92);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line-dark);
}
.hdr__in{ display:flex; align-items:center; gap:28px; height:70px; }
.brand{ display:flex; align-items:baseline; gap:9px; text-decoration:none; color:#fff; flex:none; }
.brand__mark{ font-family:var(--serif); font-size:22px; letter-spacing:.02em; font-weight:400; }
.brand__sub{ font-size:9.5px; letter-spacing:.19em; text-transform:uppercase; color:rgba(255,255,255,.55); font-weight:500; }
.nav{ display:none; gap:30px; margin-left:auto; }
.nav a{
  text-decoration:none; color:rgba(255,255,255,.74); font-size:14px;
  padding-block:6px; transition:color .2s ease; position:relative;
}
.nav a:hover,.nav a[aria-current="page"]{ color:#fff; }
.nav a[aria-current="page"]::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:#9FD08B;
}
.hdr__cta{ margin-left:auto; display:flex; gap:9px; align-items:center; min-width:0; }
@media(min-width:1060px){
  .nav{ display:flex; }
  .hdr__cta{ margin-left:0; }
}
@media(max-width:430px){ .hdr__cta{ display:none; } }
.hdr__menu{
  margin-left:12px; display:inline-flex; align-items:center; gap:8px; flex:none;
  background:none; border:1px solid var(--line-dark); color:#fff;
  border-radius:var(--r); padding:9px 14px; font:inherit; font-size:13px; cursor:pointer;
}
@media(max-width:430px){ .hdr__menu{ margin-left:auto; } }
@media(min-width:1060px){ .hdr__menu{ display:none; } }
.mobnav{ display:none; border-top:1px solid var(--line-dark); background:var(--navy-deep); }
.mobnav.is-open{ display:block; }
.mobnav a{
  display:block; padding:15px 0; text-decoration:none; color:rgba(255,255,255,.82);
  border-bottom:1px solid rgba(255,255,255,.07); font-size:15px;
}
.mobnav a:last-child{ border-bottom:0; }
.mobnav a.is-cta{ color:#9FD08B; font-weight:500; }

/* ------------------------------------------------------------------ Hero */
.hero{
  background:var(--navy); color:#fff; position:relative; overflow:hidden;
  padding-block:clamp(64px,8vw,116px) clamp(64px,8vw,110px);
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(var(--line-dark) 1px,transparent 1px);
  background-size:100% 116px; opacity:.5; pointer-events:none;
}
.hero::after{
  content:""; position:absolute; right:-16%; top:-28%; width:66%; aspect-ratio:1;
  background:radial-gradient(circle at 50% 50%,rgba(95,155,78,.20),transparent 62%);
  pointer-events:none;
}
.hero__in{ position:relative; z-index:2; display:grid; gap:clamp(44px,5vw,72px); }
@media(min-width:1000px){
  .hero__in{ grid-template-columns:minmax(0,1.24fr) minmax(0,.76fr); align-items:start; gap:clamp(48px,6vw,86px); }
}
.hero .display{ max-width:16ch; hyphens:none; }
.hero .lede{ color:rgba(255,255,255,.72); max-width:52ch; }
.hero__meta{
  display:flex; flex-wrap:wrap; gap:10px 22px; margin-top:40px;
  padding-top:22px; border-top:1px solid var(--line-dark);
  font-size:12.5px; letter-spacing:.05em; color:rgba(255,255,255,.55);
}

/* Ehrlichkeits-Karte im Hero */
.honest{
  background:rgba(255,255,255,.04);
  border:1px solid var(--line-dark);
  border-radius:var(--r);
  padding:clamp(24px,2.6vw,32px);
}
.honest__label{
  font-size:10.5px; letter-spacing:.17em; text-transform:uppercase;
  color:#9FD08B; font-weight:500; margin-bottom:18px;
}
.honest__list{ list-style:none; margin:0; padding:0; }
.honest__list li{
  display:flex; align-items:flex-start; gap:13px; padding:13px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-size:14.5px; line-height:1.5; color:rgba(255,255,255,.86);
}
.honest__list li:last-child{ border-bottom:0; padding-bottom:0; }
.honest__list li:first-child{ padding-top:0; }
.tick{ flex:none; margin-top:3px; }
.honest__foot{
  margin:20px 0 0; padding-top:18px; border-top:1px solid var(--line-dark);
  font-size:13px; line-height:1.55; color:rgba(255,255,255,.5);
}

/* --------------------------------------------------------------- Klartext */
.band{ background:var(--navy-deep); color:#fff; border-top:1px solid var(--line-dark); }
.band__in{
  display:flex; flex-wrap:wrap; gap:14px 34px; align-items:center;
  padding-block:20px;
  font-size:11.5px; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(255,255,255,.58); font-weight:500;
}
.band__in span{ display:inline-flex; align-items:center; gap:11px; }
.band__in span::before{ content:""; width:5px; height:5px; border-radius:50%; background:#5F9B4E; flex:none; }
.band__in span.is-yes{ color:#B9DFA9; }

/* ----------------------------------------------------------------- Grids */
.grid{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.grid--2{ grid-template-columns:1fr; }
.grid--4{ grid-template-columns:1fr; }
@media(min-width:640px){ .grid--4{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1000px){ .grid--4{ grid-template-columns:repeat(4,1fr); } .grid--2{ grid-template-columns:repeat(2,1fr); } }
.cell{ background:var(--paper); padding:clamp(26px,2.6vw,36px); }
.section--paper2 .cell{ background:var(--paper-2); }
.cell__n{ font-size:12px; letter-spacing:.09em; color:var(--green); font-variant-numeric:tabular-nums; margin-bottom:20px; }
.cell .h3{ margin-bottom:11px; }
.cell p{ margin:0; font-size:14.5px; line-height:1.6; color:var(--muted); }

/* ----------------------------------------------------------- Rolle: Do/Dont */
.roles{ display:grid; gap:22px; }
@media(min-width:940px){ .roles{ grid-template-columns:repeat(2,1fr); gap:26px; } }
.role{
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); padding:clamp(28px,3vw,42px);
}
.role--no{ background:var(--paper-2); border-color:var(--line-soft); }
.role__head{
  display:flex; align-items:center; gap:12px; padding-bottom:22px;
  border-bottom:1px solid var(--line); margin-bottom:8px;
}
.role__head h3{ font-size:17px; font-weight:600; letter-spacing:-.01em; }
.role ul{ list-style:none; margin:0; padding:0; }
.role li{
  display:flex; align-items:flex-start; gap:14px; padding:15px 0;
  border-bottom:1px solid var(--line-soft); font-size:15px; line-height:1.52;
}
.role li:last-child{ border-bottom:0; }
.role--no li{ color:var(--muted); }
.mark{ flex:none; margin-top:4px; }
.role__note{
  margin:24px 0 0; padding-top:20px; border-top:1px solid var(--line);
  font-size:13.5px; line-height:1.6; color:var(--muted);
}

/* ---------------------------------------------------------------- Brief */
.letter{ background:var(--paper-2); }
.letter__in{ display:grid; gap:clamp(36px,4vw,64px); }
@media(min-width:960px){ .letter__in{ grid-template-columns:minmax(0,.34fr) minmax(0,.66fr); } }
.letter__body{ max-width:64ch; }
.letter__body p{
  font-family:var(--serif); font-size:clamp(18px,1.5vw,21.5px);
  line-height:1.68; letter-spacing:-.012em; margin:0 0 1.15em; color:var(--ink);
}
.letter__body p:first-child::first-letter{
  font-size:3.1em; line-height:.86; float:left; padding:.06em .1em 0 0; color:var(--green);
}
.letter__body strong{ font-weight:600; }
.sig{ margin-top:38px; padding-top:26px; border-top:1px solid var(--line); }
.sig__name{ font-family:var(--serif); font-size:22px; letter-spacing:-.02em; }
.sig__role{ font-size:13px; color:var(--muted); margin-top:4px; letter-spacing:.02em; }
.letter__facts{ list-style:none; margin:0; padding:0; }
.letter__facts li{ padding:16px 0; border-bottom:1px solid var(--line); }
.letter__facts li:first-child{ border-top:1px solid var(--line); }
.letter__facts b{ display:block; font-family:var(--serif); font-size:26px; font-weight:400; letter-spacing:-.02em; }
.letter__facts span{ font-size:13.5px; color:var(--muted); }

/* -------------------------------------------------------------- Partner */
.partners{ display:grid; gap:22px; }
@media(min-width:820px){ .partners{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1180px){ .partners{ grid-template-columns:repeat(3,1fr); } }
.partner{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(26px,2.6vw,34px); display:flex; flex-direction:column;
  transition:border-color .22s ease, transform .22s ease;
}
.partner:hover{ border-color:rgba(1,34,52,.3); transform:translateY(-2px); }
.partner__tag{
  display:inline-block; align-self:flex-start; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--green); background:var(--green-soft);
  padding:6px 10px; border-radius:2px; margin-bottom:22px; font-weight:500;
}
.partner__name{ font-family:var(--serif); font-size:clamp(21px,1.8vw,25px); line-height:1.2; letter-spacing:-.022em; }
.partner__loc{ font-size:12.5px; letter-spacing:.06em; color:var(--muted); margin-top:8px; text-transform:uppercase; }
.partner__people{ margin:22px 0 0; padding:20px 0 0; border-top:1px solid var(--line-soft); list-style:none; }
.partner__people li{ font-size:14.5px; line-height:1.5; padding:5px 0; }
.partner__people em{ display:block; font-style:normal; font-size:13px; color:var(--muted); }
.partner__desc{ font-size:14.5px; line-height:1.58; color:var(--muted); margin:18px 0 0; }
.partner__cta{
  margin-top:auto; padding-top:26px;
  display:inline-flex; align-items:center; gap:9px;
  font-size:14px; font-weight:500; color:var(--ink); text-decoration:none;
}
.partner__cta:hover{ color:var(--green); }
.partner__cta svg{ transition:transform .22s ease; }
.partner__cta:hover svg{ transform:translate(2px,-2px); }

.notice{
  margin-top:34px; padding:22px 26px;
  border:1px solid var(--line); border-left:2px solid var(--green);
  border-radius:var(--r); background:var(--card);
  font-size:14px; line-height:1.62; color:var(--muted); max-width:80ch;
}
.section--dark .notice{ background:rgba(255,255,255,.04); border-color:var(--line-dark); border-left-color:#5F9B4E; color:var(--muted-dark); }

/* -------------------------------------------------------------- Prozess */
.steps{ border-top:1px solid var(--line); }
.step{
  display:grid; gap:12px 40px; padding:clamp(28px,3vw,40px) 0;
  border-bottom:1px solid var(--line); align-items:start;
}
@media(min-width:840px){ .step{ grid-template-columns:70px minmax(0,.36fr) minmax(0,.64fr); gap:40px; } }
.step__n{ font-family:var(--serif); font-size:30px; line-height:1; color:var(--green); letter-spacing:-.02em; }
.step__t{ font-size:clamp(19px,1.6vw,23px); font-family:var(--serif); letter-spacing:-.022em; line-height:1.24; }
.step p{ margin:0; color:var(--muted); font-size:15px; line-height:1.62; }

/* --------------------------------------------------------------- Zielgruppe */
.audience{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line-dark); }
.audience li{
  display:flex; gap:18px; align-items:flex-start;
  padding:20px 0; border-bottom:1px solid var(--line-dark);
  font-size:clamp(16px,1.25vw,18.5px); line-height:1.5;
}
.audience li span{ font-variant-numeric:tabular-nums; font-size:12px; color:#9FD08B; padding-top:7px; flex:none; letter-spacing:.08em; }

/* --------------------------------------------------------------- Stimmen */
.quotes{ display:grid; gap:22px; }
@media(min-width:760px){ .quotes{ grid-template-columns:repeat(2,1fr); } }
.quote{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:clamp(26px,2.6vw,34px); display:flex; flex-direction:column;
}
.quote blockquote{
  margin:0 0 24px; font-family:var(--serif); font-size:clamp(17.5px,1.4vw,20px);
  line-height:1.54; letter-spacing:-.015em;
}
.quote figcaption{ margin-top:auto; padding-top:20px; border-top:1px solid var(--line-soft); }
.quote__name{ font-size:14.5px; font-weight:600; }
.quote__role{ font-size:13px; color:var(--muted); margin-top:3px; }

/* ------------------------------------------------------------------- FAQ */
.faq{ border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  list-style:none; cursor:pointer; padding:26px 44px 26px 0; position:relative;
  font-size:clamp(16.5px,1.35vw,19px); font-weight:500; letter-spacing:-.015em; line-height:1.42;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; position:absolute; right:6px; top:50%; width:11px; height:11px;
  border-right:1.5px solid var(--green); border-bottom:1.5px solid var(--green);
  transform:translateY(-70%) rotate(45deg); transition:transform .25s ease;
}
.faq details[open] summary::after{ transform:translateY(-30%) rotate(-135deg); }
.faq summary:hover{ color:var(--green); }
.faq__a{ padding:0 8% 30px 0; margin:0; color:var(--muted); font-size:15.5px; line-height:1.68; max-width:76ch; }

/* --------------------------------------------------------------- CTA groß */
.cta{ background:var(--navy); color:#fff; text-align:left; position:relative; overflow:hidden; }
.cta::after{
  content:""; position:absolute; left:-10%; bottom:-46%; width:52%; aspect-ratio:1;
  background:radial-gradient(circle,rgba(95,155,78,.20),transparent 64%); pointer-events:none;
}
.cta__in{ position:relative; z-index:2; }
.cta .lede{ color:rgba(255,255,255,.7); }
.cta__points{
  display:flex; flex-wrap:wrap; gap:12px 30px; margin-top:38px; padding-top:24px;
  border-top:1px solid var(--line-dark); font-size:13.5px; color:rgba(255,255,255,.6);
}
.cta__points span{ display:inline-flex; align-items:center; gap:9px; }

/* ---------------------------------------------------------------- Footer */
.ftr{ background:var(--navy-deep); color:#fff; padding-block:clamp(56px,6vw,84px) 34px; }
.ftr__top{ display:grid; gap:44px; padding-bottom:52px; border-bottom:1px solid var(--line-dark); }
@media(min-width:900px){ .ftr__top{ grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr)); gap:48px; } }
.ftr__claim{ font-family:var(--serif); font-size:clamp(22px,2.1vw,29px); line-height:1.22; letter-spacing:-.024em; max-width:20ch; }
.ftr h4{ font-size:10.5px; letter-spacing:.17em; text-transform:uppercase; color:rgba(255,255,255,.42); margin:0 0 18px; font-weight:500; }
.ftr ul{ list-style:none; margin:0; padding:0; }
.ftr li{ margin-bottom:11px; }
.ftr li a{ color:rgba(255,255,255,.74); text-decoration:none; font-size:14.5px; transition:color .2s ease; }
.ftr li a:hover{ color:#fff; }
.ftr__legal{
  margin:36px 0 0; font-size:12.5px; line-height:1.68; color:rgba(255,255,255,.45); max-width:100ch;
}
.ftr__bottom{
  margin-top:30px; padding-top:24px; border-top:1px solid var(--line-dark);
  display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:space-between;
  font-size:12.5px; color:rgba(255,255,255,.42);
}
.ftr__bottom a{ color:rgba(255,255,255,.6); text-decoration:none; }
.ftr__bottom a:hover{ color:#fff; }

/* ------------------------------------------------------------ Innenseiten */
.pagehead{ background:var(--navy); color:#fff; padding-block:clamp(56px,6.5vw,96px) clamp(52px,6vw,84px); position:relative; overflow:hidden; }
.pagehead::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(var(--line-dark) 1px,transparent 1px);
  background-size:100% 116px; opacity:.45; pointer-events:none;
}
.pagehead__in{ position:relative; z-index:2; }
.pagehead .display{ max-width:17ch; }
.pagehead .lede{ color:rgba(255,255,255,.7); }
.crumb{ font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-bottom:22px; }
.crumb a{ text-decoration:none; color:rgba(255,255,255,.6); }

.prose{ max-width:72ch; }
.prose h2{ font-family:var(--serif); font-size:clamp(24px,2.4vw,32px); letter-spacing:-.024em; line-height:1.2; margin:56px 0 18px; font-weight:300; }
.prose h2:first-child{ margin-top:0; }
.prose h3{ font-size:17px; font-weight:600; margin:34px 0 10px; letter-spacing:-.012em; }
.prose p{ margin:0 0 1.05em; color:var(--muted); }
.prose ul{ margin:0 0 1.3em; padding-left:0; list-style:none; }
.prose ul li{ position:relative; padding-left:22px; margin-bottom:10px; color:var(--muted); }
.prose ul li::before{ content:""; position:absolute; left:0; top:11px; width:7px; height:1px; background:var(--green); }
.prose strong{ color:var(--ink); font-weight:600; }
.prose a{ color:var(--green); text-underline-offset:3px; }
.prose .toc{ display:grid; grid-template-columns:1fr; gap:6px 32px; margin:0 0 2.2em; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.prose .toc li{ padding-left:0; margin:0; font-size:14.5px; }
.prose .toc li::before{ display:none; }
.prose .toc a{ text-decoration:none; }
.prose .toc a:hover{ text-decoration:underline; }
.prose h2[id]{ scroll-margin-top:90px; }
@media(min-width:640px){ .prose .toc{ grid-template-columns:1fr 1fr; } }

.dl{ display:grid; gap:0; border-top:1px solid var(--line); margin:0; }
.dl > div{ display:grid; gap:4px 32px; padding:17px 0; border-bottom:1px solid var(--line); }
@media(min-width:700px){ .dl > div{ grid-template-columns:220px minmax(0,1fr); } }
.dl dt{ font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.dl dd{ margin:0; font-size:15.5px; }

.contact-grid{ display:grid; gap:24px; }
@media(min-width:900px){ .contact-grid{ grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(30px,4vw,60px); } }
.contact-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:clamp(28px,3vw,40px); }
.contact-card h3{ margin-bottom:18px; }
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:13px; letter-spacing:.04em; color:var(--muted); margin-bottom:7px; }
.field input,.field textarea,.field select{
  width:100%; padding:13px 15px; font:inherit; font-size:15px;
  border:1px solid var(--line); border-radius:var(--r); background:var(--paper);
  color:var(--ink); transition:border-color .2s ease;
}
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--green); }
.field textarea{ min-height:130px; resize:vertical; }
.consent{ display:flex; gap:11px; align-items:flex-start; font-size:13px; line-height:1.55; color:var(--muted); margin-bottom:22px; }
.consent input{ margin-top:3px; flex:none; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-msg{ display:none; margin-top:18px; padding:12px 16px; border-radius:var(--r); font-size:14px; line-height:1.55; }
.form-msg.ok{ display:block; background:rgba(62,127,43,.08); border:1px solid var(--green); }
.form-msg.err{ display:block; background:rgba(181,70,58,.08); border:1px solid #B5463A; }

@media print{ .hdr,.mobnav,.cta{ display:none; } }