@charset "UTF-8";
/* =========================================================
   financesolutions.lu — Stylesheet
   Palette aus dem Logo: Marineblau, Signalrot, Grau.
   Petrol (#36817F) ist ausschliesslich der Partnermarke
   credihome vorbehalten und taucht sonst nirgends auf.
   ========================================================= */

/* ── Tokens ─────────────────────────────────────────────── */
:root{
  --navy-900:#04142B;
  --navy:#011E4B;
  --navy-700:#0B2E63;
  --navy-300:#8FA3C4;
  --red:#AE0D10;
  --red-700:#8A0A0D;
  --teal:#36817F;
  --teal-050:#EEF5F4;

  --paper:#F7F6F3;
  --paper-2:#EFEDE7;
  --white:#FFFFFF;
  --ink:#14181F;
  --ink-70:#4A5462;
  --ink-50:#6F7883;
  --rule:#DCD9D2;
  --rule-dark:rgba(255,255,255,.16);

  --ff-display:'Archivo','Archivo Expanded',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ff-body:'Public Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --ff-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;

  --wrap:1180px;
  --gutter:clamp(1.25rem,4vw,2.5rem);
  --sec-y:clamp(3.75rem,8vw,7rem);
  --r:3px;
  --shadow:0 1px 2px rgba(4,20,43,.05),0 12px 32px -12px rgba(4,20,43,.18);
}

/* ── Reset ──────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5.5rem}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--ff-body);font-size:clamp(1rem,.97rem + .16vw,1.0625rem);
  line-height:1.62;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,picture,svg{max-width:100%;display:block}
img{height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--ff-display);font-weight:700;letter-spacing:-.015em;line-height:1.08}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
ul,ol{margin:0;padding:0}
table{border-collapse:collapse;width:100%}

::selection{background:var(--navy);color:#fff}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:2px}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy);color:#fff;padding:.75rem 1.25rem}
.skip:focus{left:.5rem;top:.5rem}

/* ── Layout-Helfer ──────────────────────────────────────── */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap--narrow{max-width:760px}

.eyebrow{
  font-family:var(--ff-mono);font-size:.74rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--red);
  margin:0 0 1rem;display:flex;align-items:center;gap:.6rem;
}
.eyebrow::before{content:"";width:1.5rem;height:2px;background:var(--red);flex:none}

.sec-head{max-width:44rem;margin-bottom:clamp(2.25rem,4vw,3.25rem)}
.sec-head h2{font-size:clamp(1.75rem,1.15rem + 2.4vw,2.85rem);font-variation-settings:'wdth' 112}
.sec-lead{margin-top:1.1rem;font-size:1.075em;color:var(--ink-70);max-width:38rem}
.fineprint{margin-top:1.75rem;font-size:.8125rem;line-height:1.6;color:var(--ink-50);max-width:52rem}
.note{
  margin-top:1.25rem;padding:.9rem 1.05rem;border-left:2px solid var(--rule);
  background:var(--paper-2);font-size:.875rem;line-height:1.6;color:var(--ink-70);
}
.note--warn{border-left-color:var(--red);background:rgba(174,13,16,.045)}
.link{color:var(--navy);text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px;text-decoration-color:rgba(1,30,75,.35)}
.link:hover{text-decoration-color:var(--red);color:var(--red)}

/* ── Buttons ────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  background:var(--navy);color:#fff;text-decoration:none;
  font-family:var(--ff-body);font-weight:600;font-size:.95rem;letter-spacing:.005em;
  padding:.72rem 1.35rem;border:1px solid var(--navy);border-radius:var(--r);
  cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.btn:hover{background:var(--navy-700);border-color:var(--navy-700)}
.btn:active{transform:translateY(1px)}
.btn--lg{padding:.95rem 1.75rem;font-size:1rem}
.btn--sm{padding:.5rem 1rem;font-size:.875rem}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.btn--ghost:hover{background:rgba(255,255,255,.1);border-color:#fff}

/* ── Header ─────────────────────────────────────────────── */
.hdr{
  position:sticky;top:0;z-index:100;background:var(--paper);
  border-bottom:1px solid var(--rule);
}
@supports (backdrop-filter:blur(1px)){
  /* Nur wo es gefahrlos ist: Safari macht aus backdrop-filter einen
     Bezugsrahmen fuer position:fixed — deshalb erst ab Desktopbreite. */
  @media (min-width:861px){
    .hdr{background:rgba(247,246,243,.93);backdrop-filter:saturate(160%) blur(10px)}
  }
}
.hdr__in{
  max-width:var(--wrap);margin-inline:auto;padding:.65rem var(--gutter);
  display:flex;align-items:center;gap:1.5rem;
}
.hdr__logo{flex:none;display:block}
.hdr__logo img{width:190px;height:auto}
.hdr__nav{margin-left:auto;display:flex;align-items:center;gap:1.75rem}
.hdr__nav ul{display:flex;align-items:center;gap:1.5rem;list-style:none}
.hdr__nav a{
  text-decoration:none;font-size:.9rem;font-weight:500;color:var(--ink-70);
  padding:.35rem 0;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;
}
.hdr__nav a:hover{color:var(--navy);border-bottom-color:var(--red)}
.hdr__nav-contact{display:none}
.langsw{display:flex;align-items:center;gap:.15rem;font-family:var(--ff-mono);font-size:.75rem}
.langsw a{
  text-decoration:none;padding:.3rem .42rem;color:var(--ink-50);border-radius:2px;
  letter-spacing:.04em;border-bottom:none!important;
}
.langsw a:hover{color:var(--navy);background:var(--paper-2)}
.langsw a.is-on{color:#fff;background:var(--navy)}
.hdr__cta{flex:none}
.burger{
  display:none;background:none;border:0;padding:.6rem;cursor:pointer;
  -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
  touch-action:manipulation;min-width:44px;min-height:44px;
}
.burger span{display:block;width:22px;height:2px;background:var(--navy);margin:4px 0;transition:transform .22s ease,opacity .22s ease;pointer-events:none}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ── Hero ───────────────────────────────────────────────── */
.hero{
  position:relative;background:var(--navy-900);color:#fff;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:stretch;
}
.hero__text{
  padding:clamp(3rem,6vw,5.5rem) var(--gutter) clamp(3.5rem,6vw,5.5rem);
  max-width:calc(var(--wrap) * .62);margin-left:auto;width:100%;
  padding-left:max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)));
}
.hero .eyebrow{color:#fff}
.hero .eyebrow::before{background:var(--red)}
.hero h1{
  font-size:clamp(2.35rem,1.3rem + 4.4vw,4.35rem);
  font-variation-settings:'wdth' 118;font-weight:700;letter-spacing:-.028em;line-height:1.02;
}
.hero h1 span{display:block}
.hero__h1b{color:var(--navy-300)}
.hero__lead{margin-top:1.5rem;max-width:34rem;font-size:1.075em;line-height:1.65;color:rgba(255,255,255,.82)}
.hero__lead strong{color:#fff;font-weight:600}
.hero__cta{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.75rem}
.hero__trust{
  margin-top:2.75rem;padding-top:1.75rem;border-top:1px solid var(--rule-dark);
  list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr));gap:1.25rem;
}
.hero__trust strong{display:block;font-family:var(--ff-display);font-size:.98rem;font-variation-settings:'wdth' 108;letter-spacing:-.005em}
.hero__trust span{display:block;margin-top:.2rem;font-size:.8rem;line-height:1.45;color:rgba(255,255,255,.58)}
.hero__img{position:relative;min-height:22rem;overflow:hidden}
.hero__img picture,.hero__img img{width:100%;height:100%;object-fit:cover}
.hero__img::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,var(--navy-900) 0%,rgba(4,20,43,.55) 26%,rgba(4,20,43,0) 62%);
}

/* ── Zinsleiste ─────────────────────────────────────────── */
.rates{background:var(--navy);color:#fff;padding:clamp(1.75rem,3vw,2.5rem) 0}
.rates__h{
  font-family:var(--ff-mono);font-size:.74rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--navy-300);margin-bottom:1.25rem;
}
.rates__list{
  list-style:none;display:grid;gap:1px;background:var(--rule-dark);
  grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));border:1px solid var(--rule-dark);
}
.rates__list li{background:var(--navy);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.15rem}
.rates__label{font-size:.78rem;color:var(--navy-300);letter-spacing:.01em}
.rates__val{font-family:var(--ff-mono);font-size:1.55rem;font-weight:500;letter-spacing:-.02em;line-height:1.2}
.rates__span{font-family:var(--ff-mono);font-size:.72rem;color:rgba(255,255,255,.45)}
.rates__note{margin-top:1.1rem;font-size:.78rem;line-height:1.55;color:rgba(255,255,255,.5);max-width:56rem}

/* ── Rechner ────────────────────────────────────────────── */
.calc{padding:var(--sec-y) 0;background:var(--paper)}
.calc__box{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  background:var(--white);border:1px solid var(--rule);box-shadow:var(--shadow);
}
.calc__in{padding:clamp(1.5rem,3vw,2.5rem);display:grid;gap:1.35rem;align-content:start}
.calc__out{
  padding:clamp(1.5rem,3vw,2.5rem);background:var(--navy-900);color:#fff;
  display:flex;flex-direction:column;
}
.calc__budget-l{font-family:var(--ff-mono);font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--navy-300);margin-bottom:.35rem}
.calc__budget{
  font-family:var(--ff-display);font-variation-settings:'wdth' 112;font-weight:700;
  font-size:clamp(2.1rem,1.2rem + 3vw,3.1rem);letter-spacing:-.03em;line-height:1;margin:0 0 1.5rem;
  font-variant-numeric:tabular-nums;
}
.calc__warn{
  margin:-.75rem 0 1.25rem;padding:.7rem .9rem;background:rgba(174,13,16,.22);
  border-left:2px solid var(--red);font-size:.85rem;line-height:1.5;
}
.calc__kv{margin:0;display:grid;gap:0;border-top:1px solid var(--rule-dark)}
.calc__kv > div{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.7rem 0;border-bottom:1px solid var(--rule-dark);
}
.calc__kv dt{font-size:.875rem;color:rgba(255,255,255,.66)}
.calc__kv dd{margin:0;font-family:var(--ff-mono);font-size:1rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.calc__kv--sm dt{font-size:.8rem}
.calc__kv--sm dd{font-size:.875rem}
.calc__kv .is-total dt{color:#fff;font-weight:600}
.calc__kv .is-total dd{font-weight:500}
.calc__det{margin-top:1.25rem}
.calc__det summary{
  cursor:pointer;font-family:var(--ff-mono);font-size:.75rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--navy-300);padding:.4rem 0;list-style:none;
}
.calc__det summary::-webkit-details-marker{display:none}
.calc__det summary::before{content:"+ ";}
.calc__det[open] summary::before{content:"– ";}
.calc__det summary:hover{color:#fff}
.calc__cta{margin-top:auto;padding-top:0;align-self:start;margin-top:1.75rem;background:var(--red);border-color:var(--red)}
.calc__cta:hover{background:var(--red-700);border-color:var(--red-700)}

/* ── Formularfelder (global) ────────────────────────────── */
.fld{margin:0;display:flex;flex-direction:column;gap:.4rem}
.fld > label{font-size:.85rem;font-weight:600;color:var(--ink);letter-spacing:.005em}
.fld__hint{font-size:.78rem;color:var(--ink-50);line-height:1.45}
.fld__err{font-size:.8rem;color:var(--red);font-weight:500}
.req{color:var(--red)}
.fld input[type=text],.fld input[type=email],.fld input[type=tel],.fld select,.fld textarea{
  width:100%;background:var(--white);border:1px solid var(--rule);border-radius:var(--r);
  padding:.62rem .8rem;font-size:.95rem;transition:border-color .15s,box-shadow .15s;
}
.fld textarea{resize:vertical;min-height:7rem;font-family:inherit}
.fld input:focus,.fld select:focus,.fld textarea:focus{
  outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(1,30,75,.12);
}
.fld input[aria-invalid="true"],.fld textarea[aria-invalid="true"]{border-color:var(--red)}
.fld select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236F7883' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center;padding-right:2.2rem;
}
.fld__money{position:relative;display:block}
.fld__money input{font-family:var(--ff-mono);font-variant-numeric:tabular-nums;padding-right:2.2rem}
.fld__money i{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);font-style:normal;color:var(--ink-50);font-family:var(--ff-mono);font-size:.9rem}
.fld--check{flex-direction:row;align-items:flex-start;flex-wrap:wrap}
.fld--check label{display:flex;gap:.65rem;align-items:flex-start;font-size:.875rem;font-weight:400;line-height:1.5;cursor:pointer}
.fld--check input[type=checkbox]{margin-top:.22rem;width:1.05rem;height:1.05rem;accent-color:var(--navy);flex:none}
.fld--check a{color:var(--navy);text-decoration:underline;text-underline-offset:.18em}

input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:2px;background:var(--rule);
  border-radius:2px;margin:.65rem 0;cursor:pointer;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--navy);
  border:3px solid var(--white);box-shadow:0 0 0 1px var(--rule);cursor:grab;
}
input[type=range]::-moz-range-thumb{
  width:16px;height:16px;border-radius:50%;background:var(--navy);
  border:3px solid var(--white);box-shadow:0 0 0 1px var(--rule);cursor:grab;
}
.fld output{font-family:var(--ff-mono);font-variant-numeric:tabular-nums;color:var(--navy);font-weight:500}

/* ── Karten ─────────────────────────────────────────────── */
.srv{padding:var(--sec-y) 0;background:var(--paper-2);border-block:1px solid var(--rule)}
.cards{list-style:none;display:grid;gap:1px;background:var(--rule);grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));border:1px solid var(--rule)}
.card{background:var(--white);padding:clamp(1.35rem,2.5vw,1.9rem)}
.card h3{font-size:1.08rem;font-variation-settings:'wdth' 106;margin-bottom:.6rem;line-height:1.25}
.card p{font-size:.9rem;line-height:1.6;color:var(--ink-70);margin:0}

/* ── Ablauf ─────────────────────────────────────────────── */
.how{padding:var(--sec-y) 0}
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:clamp(1.5rem,3vw,2.5rem)}
.step{position:relative;padding-top:1.15rem;border-top:2px solid var(--navy)}
.step__n{
  font-family:var(--ff-mono);font-size:.78rem;font-weight:500;color:var(--red);
  letter-spacing:.1em;display:block;margin-bottom:.5rem;
}
.step h3{font-size:1.05rem;font-variation-settings:'wdth' 106;margin-bottom:.5rem}
.step p{font-size:.9rem;line-height:1.6;color:var(--ink-70);margin:0}

.moment{
  margin-top:clamp(2.5rem,5vw,4rem);display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(1.5rem,3vw,3rem);align-items:center;
}
.moment__img img{aspect-ratio:4/3;object-fit:cover;width:100%}
.moment__body h3{font-size:clamp(1.3rem,1rem + 1.2vw,1.7rem);font-variation-settings:'wdth' 110}
.moment__lead{margin-top:.9rem;color:var(--ink-70)}
.moment__list{list-style:none;margin-top:1.1rem;display:grid;gap:.8rem}
.moment__list li{padding-left:1.35rem;position:relative;font-size:.95rem;line-height:1.6;color:var(--ink-70)}
.moment__list li::before{content:"";position:absolute;left:0;top:.62em;width:.5rem;height:2px;background:var(--red)}
.moment__list strong{color:var(--ink);font-weight:600}

/* ── Nebenkosten ────────────────────────────────────────── */
.costs{padding:var(--sec-y) 0;background:var(--paper-2);border-block:1px solid var(--rule)}
.tablewrap{overflow-x:auto;background:var(--white);border:1px solid var(--rule)}
.tbl{min-width:38rem;font-size:.9rem}
.tbl th,.tbl td{text-align:left;padding:.85rem 1.1rem;border-bottom:1px solid var(--rule);vertical-align:top}
.tbl thead th{
  font-family:var(--ff-mono);font-size:.72rem;font-weight:500;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-50);background:var(--paper);
}
.tbl tbody th{font-weight:600;font-family:var(--ff-body);width:14rem}
.tbl td.num{font-family:var(--ff-mono);font-variant-numeric:tabular-nums;white-space:nowrap;width:11rem}
.tbl td:last-child{color:var(--ink-70);font-size:.86rem;line-height:1.55}
.tbl tbody tr:last-child th,.tbl tbody tr:last-child td{border-bottom:0}
.tbl tr.is-credit{background:rgba(1,30,75,.035)}
.tbl tr.is-credit td.num{color:var(--red);font-weight:500}

.example{
  margin-top:clamp(2rem,4vw,3rem);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(1.5rem,3vw,2.75rem);align-items:center;
}
.example__img img{aspect-ratio:4/3;object-fit:cover;width:100%}
.example__body h3{font-size:clamp(1.2rem,1rem + 1vw,1.5rem);font-variation-settings:'wdth' 108;margin-bottom:.75rem}
.example__body p{color:var(--ink-70)}

/* ── Partner (einziger Ort mit Petrol) ──────────────────── */
.ptn{padding:var(--sec-y) 0;background:var(--teal-050)}
.ptn .eyebrow{color:var(--teal)}
.ptn .eyebrow::before{background:var(--teal)}
.sec-head--ptn{position:relative;max-width:none;display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem}
.sec-head--ptn h2{grid-column:1;font-size:clamp(1.75rem,1.15rem + 2.4vw,2.85rem);font-variation-settings:'wdth' 112}
.sec-head--ptn .eyebrow{grid-column:1}
.ptn__logo{width:min(240px,32vw);height:auto;grid-column:2;grid-row:1/3;align-self:center}
.ptn__lead{max-width:44rem;color:var(--ink-70);margin-bottom:clamp(1.75rem,3vw,2.5rem)}
.cards--ptn{background:rgba(54,129,127,.28);border-color:rgba(54,129,127,.28)}
.card--ptn{background:var(--white)}
.card--ptn h3{color:var(--teal)}
.ptn__quote{
  margin:clamp(1.75rem,3vw,2.5rem) 0 0;padding-left:1.5rem;border-left:3px solid var(--teal);
  max-width:44rem;
}
.ptn__quote p{
  font-family:var(--ff-display);font-variation-settings:'wdth' 104;font-weight:600;
  font-size:clamp(1.1rem,1rem + .7vw,1.35rem);line-height:1.4;letter-spacing:-.01em;
}
.ptn__quote footer{margin-top:.9rem;font-size:.9rem}
.ptn__quote footer .link{color:var(--teal);text-decoration-color:rgba(54,129,127,.4)}
.ptn__quote footer .link:hover{color:var(--teal)}

/* ── Warum wir ──────────────────────────────────────────── */
.why{padding:var(--sec-y) 0}
.why__list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:clamp(1.5rem,3vw,2.5rem)}
.why__list li{padding-top:1.1rem;border-top:1px solid var(--rule)}
.why__list h3{font-size:1.05rem;font-variation-settings:'wdth' 106;margin-bottom:.55rem}
.why__list p{font-size:.9rem;line-height:1.6;color:var(--ink-70);margin:0}
.why__list a{color:var(--navy);text-decoration:underline;text-underline-offset:.18em}

/* ── FAQ ────────────────────────────────────────────────── */
.faq{padding:var(--sec-y) 0;background:var(--paper-2);border-block:1px solid var(--rule)}
.acc{border-top:1px solid var(--rule)}
.acc__i{border-bottom:1px solid var(--rule)}
.acc__i summary{
  cursor:pointer;list-style:none;padding:1.1rem 2.5rem 1.1rem 0;position:relative;
}
.acc__i summary::-webkit-details-marker{display:none}
.acc__i summary h3{font-size:1.02rem;font-variation-settings:'wdth' 104;font-weight:600;line-height:1.35;display:inline}
.acc__i summary::after{
  content:"";position:absolute;right:.35rem;top:1.55rem;width:.7rem;height:.7rem;
  border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);
  transform:rotate(45deg);transition:transform .2s ease;
}
.acc__i[open] summary::after{transform:rotate(-135deg)}
.acc__i summary:hover h3{color:var(--red)}
.acc__b{padding:0 2.5rem 1.35rem 0}
.acc__b p{font-size:.93rem;line-height:1.68;color:var(--ink-70);margin:0}

/* ── Kontakt ────────────────────────────────────────────── */
.ct{padding:var(--sec-y) 0;background:var(--navy-900);color:#fff}
.ct--page{padding-top:clamp(3rem,6vw,5rem)}
.ct__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,4.5rem)}
.ct .eyebrow{color:#fff}
.ct h1,.ct h2{font-size:clamp(1.75rem,1.15rem + 2.4vw,2.6rem);font-variation-settings:'wdth' 112}
.ct .sec-lead{color:rgba(255,255,255,.72)}
.ct__direct{margin-top:2.25rem;padding-top:1.5rem;border-top:1px solid var(--rule-dark)}
.ct__direct-h{font-family:var(--ff-mono);font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--navy-300);margin-bottom:.75rem}
.ct__direct p{margin:0 0 .35rem}
.ct__direct .link{color:#fff;text-decoration-color:rgba(255,255,255,.4)}
.ct__direct .link:hover{color:#fff;text-decoration-color:var(--red)}
.ct__hours{font-size:.85rem;color:rgba(255,255,255,.5);margin-top:.6rem!important}
.ct__steps{margin-top:2rem;padding-left:1.2rem;display:grid;gap:.6rem;font-size:.9rem;color:rgba(255,255,255,.72)}
.ct__steps li{padding-left:.35rem}
.ct__steps li::marker{color:var(--red);font-family:var(--ff-mono);font-size:.85rem}
.ct__form{background:var(--white);color:var(--ink);padding:clamp(1.5rem,3vw,2.5rem);box-shadow:var(--shadow)}

/* ── Formular ───────────────────────────────────────────── */
.frm__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.15rem}
.fld--full{grid-column:1/-1}
.frm__submit{margin:1.5rem 0 0}
.frm__alert{
  margin:0 0 1.25rem;padding:.85rem 1rem;background:rgba(174,13,16,.07);
  border-left:2px solid var(--red);font-size:.9rem;color:var(--red-700);
}
.frm .fld--check{margin-top:1.35rem;padding-top:1.35rem;border-top:1px solid var(--rule)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.frm button[disabled]{opacity:.6;cursor:progress}

/* ── Dokumentseiten ─────────────────────────────────────── */
.doc{padding:clamp(3rem,6vw,5rem) 0 var(--sec-y)}
.doc h1{font-size:clamp(1.9rem,1.3rem + 2.4vw,2.7rem);font-variation-settings:'wdth' 112;margin-bottom:.75rem}
.doc__upd{font-family:var(--ff-mono);font-size:.78rem;color:var(--ink-50);margin-bottom:2.5rem}
.doc h2{font-size:1.15rem;font-variation-settings:'wdth' 106;margin:2.5rem 0 .85rem;padding-top:1.25rem;border-top:1px solid var(--rule)}
.doc p{font-size:.95rem;line-height:1.7;color:var(--ink-70);margin-bottom:1em}
.doc a{color:var(--navy);text-decoration:underline;text-underline-offset:.18em}
.doc code{font-family:var(--ff-mono);font-size:.85em;background:var(--paper-2);padding:.1em .35em;border-radius:2px}
.doc strong{color:var(--ink)}

/* ── Meldeseiten ────────────────────────────────────────── */
.msg{padding:clamp(4rem,10vw,8rem) 0}
.msg h1{font-size:clamp(2rem,1.4rem + 2.8vw,3.2rem);font-variation-settings:'wdth' 114;margin-bottom:1rem}
.msg__h2{font-size:1.05rem;font-variation-settings:'wdth' 106;margin:2.5rem 0 1rem}
.msg .ct__steps{color:var(--ink-70)}
.msg .ct__steps li::marker{color:var(--red)}
.msg__back{margin-top:2.5rem}

/* ── Footer ─────────────────────────────────────────────── */
.ft{background:var(--navy);color:#fff;margin-top:0}
.ft__in{
  max-width:var(--wrap);margin-inline:auto;padding:clamp(2.75rem,5vw,4rem) var(--gutter);
  display:grid;grid-template-columns:1.6fr 1fr 1.2fr 1fr;gap:clamp(1.75rem,3vw,3rem);
}
.ft__brand img{width:180px;height:auto;margin-bottom:1.1rem}
.ft__tag{font-size:.88rem;line-height:1.6;color:rgba(255,255,255,.6);max-width:22rem}
.ft__col h2{
  font-family:var(--ff-mono);font-size:.72rem;font-weight:500;letter-spacing:.13em;
  text-transform:uppercase;color:var(--navy-300);margin-bottom:.9rem;
}
.ft__h2-2{margin-top:1.75rem}
.ft__col ul{list-style:none;display:grid;gap:.5rem}
.ft__col a{text-decoration:none;font-size:.88rem;color:rgba(255,255,255,.82);border-bottom:1px solid transparent}
.ft__col a:hover{color:#fff;border-bottom-color:var(--red)}
.ft__muted{font-size:.82rem;color:rgba(255,255,255,.45)}
.ft__legal{border-top:1px solid var(--rule-dark);background:var(--navy-900)}
.ft__legal-in{max-width:var(--wrap);margin-inline:auto;padding:1.75rem var(--gutter)}
.ft__legal p{font-size:.76rem;line-height:1.65;color:rgba(255,255,255,.42);max-width:74rem}
.ft__copy{margin-top:.85rem!important;font-family:var(--ff-mono);font-size:.72rem!important}

/* ── Cookie-Hinweis ─────────────────────────────────────── */
.cookie{
  position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:120;max-width:34rem;
  background:var(--white);border:1px solid var(--rule);box-shadow:var(--shadow);
  padding:1.1rem 1.25rem;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;
}
.cookie p{margin:0;font-size:.82rem;line-height:1.55;color:var(--ink-70);flex:1 1 16rem}
.cookie a{color:var(--navy);text-decoration:underline;text-underline-offset:.18em}
.cookie[hidden]{display:none}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width:1080px){
  .hdr__nav ul{gap:1.1rem}
  .hdr__nav a{font-size:.85rem}
}

@media (max-width:960px){
  .hero{grid-template-columns:1fr}
  .hero__text{max-width:none;padding-left:var(--gutter);padding-right:var(--gutter);order:2;
    padding-inline:max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)))}
  .hero__img{order:1;min-height:14rem;max-height:20rem}
  .hero__img::after{background:linear-gradient(180deg,rgba(4,20,43,.25) 0%,rgba(4,20,43,.15) 55%,var(--navy-900) 100%)}
  .calc__box{grid-template-columns:1fr}
  .ct__grid{grid-template-columns:1fr}
  .moment,.example{grid-template-columns:1fr}
  .moment__img,.example__img{max-width:32rem}
  .ft__in{grid-template-columns:1fr 1fr}
  .ft__brand{grid-column:1/-1}
}

@media (max-width:860px){
  .hdr__cta{display:none}
  .burger{display:block;margin-left:auto}
  .hdr__in{position:relative;flex-wrap:nowrap}
  .hdr__nav{
    display:none;
    position:absolute;top:100%;left:0;right:0;
    background:var(--paper);border-bottom:1px solid var(--rule);
    flex-direction:column;align-items:stretch;gap:0;
    padding:.5rem var(--gutter) 1.5rem;margin-left:0;
    box-shadow:0 18px 40px -20px rgba(4,20,43,.4);
    max-height:calc(100vh - 4rem);overflow-y:auto;-webkit-overflow-scrolling:touch;
  }
  .hdr__nav.is-open{display:flex}
  .hdr__nav ul{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .hdr__nav li{border-bottom:1px solid var(--rule)}
  .hdr__nav a{display:block;padding:.95rem 0;font-size:1rem;border-bottom:0}
  .hdr__nav a:hover{border-bottom:0;color:var(--red)}
  .hdr__nav-contact{display:list-item}
  .langsw{margin-top:1.25rem;gap:.35rem}
  .langsw a{padding:.55rem .8rem;border:1px solid var(--rule)}
  .langsw a.is-on{border-color:var(--navy)}
}

@media (max-width:640px){
  :root{--sec-y:3.25rem}
  .hdr__logo img{width:158px}
  .frm__grid{grid-template-columns:1fr}
  .sec-head--ptn{grid-template-columns:1fr}
  .ptn__logo{grid-column:1;grid-row:auto;margin-top:1.25rem}
  .ft__in{grid-template-columns:1fr;gap:2rem}
  .cookie{left:.5rem;right:.5rem;bottom:.5rem;padding:1rem}
  .hero__trust{grid-template-columns:1fr 1fr;gap:1rem}
  .rates__val{font-size:1.35rem}
}

@media print{
  .hdr,.cookie,.hero__img,.btn,.frm{display:none!important}
  body{background:#fff;color:#000}
  .ct,.calc__out,.ft,.hero{background:#fff!important;color:#000!important}
}
