/* FrankiFlow V2 visual layer — presentation only.
   Loaded after the existing site styles. No pricing, enquiry, Supabase or print logic lives here. */

:root{
  --v2-navy:#071d2f;
  --v2-navy-2:#0d2c43;
  --v2-teal:#0aa39a;
  --v2-teal-2:#19b9ae;
  --v2-mint:#e9f7f3;
  --v2-cloud:#f4f7f8;
  --v2-paper:#fbfcfb;
  --v2-ink:#102b3b;
  --v2-muted:#647987;
  --v2-line:#d8e3e5;
  --v2-radius-sm:14px;
  --v2-radius:22px;
  --v2-radius-lg:34px;
  --v2-shadow-soft:0 14px 40px rgba(5,29,47,.07);
  --v2-shadow:0 28px 80px rgba(5,29,47,.13);
  --v2-shadow-deep:0 34px 90px rgba(3,22,36,.22);
}

html{scroll-padding-top:96px}
body{background:var(--v2-paper);color:var(--v2-ink)}
.container{width:min(1240px,calc(100% - 48px))}
.calc-container{width:min(1240px,calc(100% - 48px))}

/* Header */
.site-header,.calc-site-header{
  background:rgba(251,252,251,.84)!important;
  border-bottom:1px solid rgba(7,29,47,.065)!important;
  box-shadow:0 6px 30px rgba(7,29,47,.035)!important;
  backdrop-filter:blur(24px) saturate(1.2)!important;
}
.site-header .nav,.calc-site-header .nav{
  min-height:86px!important;
  width:min(1240px,calc(100% - 48px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.site-header .brand,.calc-site-header .brand{width:220px}
.site-header .nav-links,.calc-site-header .nav-links{gap:28px!important}
.site-header .nav-links a,.calc-site-header .nav-links a{
  position:relative;
  font-size:13px!important;
  font-weight:720!important;
  color:#405a69!important;
}
.site-header .nav-links a::before,.calc-site-header .nav-links a::before{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-10px;
  height:2px;border-radius:999px;
  background:var(--v2-teal);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s ease;
}
.site-header .nav-links a:hover::before,.calc-site-header .nav-links a:hover::before{transform:scaleX(1)}
.language-switch{border:1px solid rgba(7,29,47,.07);background:#eef4f4!important}

/* Shared type */
.hero h1,.modern-head h2,.calculator-banner h2,.modern-contact h2,.calc-hero h1{
  text-wrap:balance;
}
.lead,.section-head p,.calculator-banner p,.contact-copy>p,.calc-hero p{
  text-wrap:pretty;
}
.eyebrow,.calc-eyebrow{
  font-weight:850!important;
  letter-spacing:.15em!important;
}
.btn,.btn-calc,.card-link,.text-arrow{
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease,color .18s ease!important;
}
.btn:hover,.btn-calc:hover{transform:translateY(-2px)!important}

/* Homepage hero */
.hero{
  min-height:740px;
  display:flex;
  align-items:center;
  padding:112px 0 118px!important;
  background:
    radial-gradient(circle at 79% 14%,rgba(25,185,174,.13),transparent 25%),
    radial-gradient(circle at 18% 82%,rgba(7,29,47,.055),transparent 28%),
    linear-gradient(180deg,#fff 0%,#f7faf9 74%,#f4f8f7 100%)!important;
}
.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(460px,.92fr)!important;gap:94px!important}
.hero-copy{max-width:700px!important}
.hero-kicker{
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--v2-teal)!important;
}
.hero h1{
  max-width:700px!important;
  margin:20px 0 28px!important;
  font-size:clamp(50px,5.4vw,74px)!important;
  line-height:.93!important;
  letter-spacing:-.067em!important;
  font-weight:850!important;
}
.hero h1 em{
  color:var(--v2-teal)!important;
  position:relative;
}
.hero h1 em::after{
  content:"";
  position:absolute;
  left:2px;right:4px;bottom:-5px;
  height:8px;border-radius:999px;
  background:linear-gradient(90deg,rgba(10,163,154,.22),rgba(10,163,154,0));
}
.lead{
  max-width:620px!important;
  font-size:19px!important;
  line-height:1.78!important;
  color:#5d7381!important;
}
.hero-ctas{gap:12px!important;margin:36px 0 29px!important}
.btn-lg{min-height:54px;padding:15px 22px!important;border-radius:15px!important}
.btn-primary{
  background:linear-gradient(135deg,var(--v2-navy),#0c3349)!important;
  box-shadow:0 14px 34px rgba(7,29,47,.17)!important;
}
.btn-primary:hover{box-shadow:0 20px 42px rgba(7,29,47,.22)!important}
.btn-ghost{background:rgba(255,255,255,.7)!important;border-color:#cad8da!important}
.trust-row{gap:12px 20px!important;color:#70838e!important}
.trust-row span:before{background:#fff!important;border:1px solid #bce0dc;color:#087f79!important}

.hero-visual{min-height:590px!important}
.hero-photo{
  inset:10px 40px 22px 12px!important;
  border-radius:46px!important;
  background-color:#e9f3f0!important;
  box-shadow:0 38px 100px rgba(7,29,47,.12)!important;
}
.hero-dashboard{
  left:72px!important;
  right:-4px!important;
  top:70px!important;
  padding:26px!important;
  border-radius:28px!important;
  border:1px solid rgba(216,227,229,.92)!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 34px 82px rgba(7,29,47,.18)!important;
  backdrop-filter:blur(22px);
}
.dashboard-price-card{
  padding:24px!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 95% 0,rgba(25,185,174,.16),transparent 36%),
    linear-gradient(145deg,var(--v2-navy),#0b3448)!important;
}
.dashboard-price-card strong{font-size:27px!important}
.dashboard-price-card a{
  min-height:43px;
  align-items:center;
  background:var(--v2-teal-2)!important;
  color:#062c31!important;
}
.dashboard-services{gap:10px!important}
.dashboard-services>div{border-radius:16px!important;padding:11px 12px!important}
.floating-card{box-shadow:0 20px 54px rgba(7,29,47,.12)!important;border-color:#dbe5e6!important}
.floating-offer{left:-12px!important;bottom:54px!important;padding:17px 21px!important}
.floating-trust{right:-18px!important;top:20px!important}

/* Trust strip */
.signal-strip{
  position:relative;
  overflow:hidden;
  background:linear-gradient(100deg,#061927 0%,#082b40 70%,#073e48 100%)!important;
}
.signal-strip::after{
  content:"";
  position:absolute;
  width:420px;height:180px;
  right:-110px;top:-80px;
  border-radius:50%;
  background:rgba(25,185,174,.09);
  filter:blur(5px);
}
.signal-grid{min-height:122px!important}
.signal-grid>div{position:relative;padding:27px 30px!important}
.signal-grid>div+div::before{
  content:"";
  position:absolute;left:0;top:28px;bottom:28px;width:1px;
  background:rgba(255,255,255,.09);
}
.signal-grid strong{font-size:31px!important;color:#75ddd5!important}

/* Section rhythm */
.section{padding:124px 0!important}
.section-head{margin-bottom:54px!important;gap:72px!important;align-items:end!important}
.modern-head h2{
  max-width:840px!important;
  font-size:clamp(42px,4.75vw,64px)!important;
  line-height:1!important;
  letter-spacing:-.055em!important;
}
.section-head p{font-size:15px!important;line-height:1.8!important}
.eyebrow{font-size:11px!important;color:var(--v2-teal)!important}

/* Services */
.services-section{background:#fff!important}
.modern-services{
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:18px!important;
}
.modern-services .service-card{grid-column:span 4}
.modern-services .service-featured,.modern-services .service-dark{grid-column:span 6}
.service-card{
  min-height:330px!important;
  padding:30px!important;
  border-radius:24px!important;
  border:1px solid #dfe8e9!important;
  box-shadow:none!important;
  display:flex!important;
  flex-direction:column;
}
.service-card:hover{
  transform:translateY(-5px)!important;
  border-color:#acd4cf!important;
  box-shadow:0 24px 56px rgba(7,29,47,.08)!important;
}
.service-featured{
  background:
    radial-gradient(circle at 100% 0,rgba(10,163,154,.11),transparent 33%),
    linear-gradient(145deg,#eef9f6,#fff 70%)!important;
}
.service-dark{
  color:#fff!important;
  background:
    radial-gradient(circle at 100% 0,rgba(25,185,174,.18),transparent 38%),
    linear-gradient(145deg,#071d2f,#0c3449)!important;
}
.service-card h3{margin:44px 0 12px!important;font-size:26px!important;letter-spacing:-.035em!important}
.service-card p{line-height:1.75!important}
.service-card .card-link{margin-top:auto!important}
.service-number{font-variant-numeric:tabular-nums}

/* Calculator CTA */
.calculator-cta-section{
  padding:104px 0!important;
  background:linear-gradient(180deg,#f3f7f7,#edf4f3)!important;
}
.calculator-banner{
  position:relative;
  overflow:hidden;
  grid-template-columns:1.06fr .94fr!important;
  gap:66px!important;
  padding:70px!important;
  border-radius:34px!important;
  background:
    radial-gradient(circle at 94% 6%,rgba(25,185,174,.21),transparent 31%),
    linear-gradient(135deg,#061a2a,#092f44 70%,#08414a)!important;
  box-shadow:0 34px 84px rgba(7,29,47,.18)!important;
}
.calculator-banner h2{font-size:clamp(42px,4.1vw,58px)!important;letter-spacing:-.052em!important}
.calculator-preview{
  transform:rotate(1.5deg);
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:24px!important;
  box-shadow:0 30px 70px rgba(0,0,0,.25)!important;
}
.calculator-preview:hover{transform:rotate(0deg) translateY(-3px)}

/* About / FAQ */
.about-main-section,.faq-section{background:#fff!important}
.about-accordion{max-width:1060px!important}
.about-accordion-item,.faq-grid details{
  transition:background .18s ease,border-color .18s ease!important;
}
.about-accordion-item:hover,.faq-grid details:hover{background:#f9fbfb!important}
.faq-grid{max-width:1080px;margin-left:auto;margin-right:auto}

/* Contact */
.contact-section{background:linear-gradient(180deg,#f3f7f6,#edf4f3)!important}
.modern-contact{
  border-radius:34px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 2% 2%,rgba(25,185,174,.18),transparent 29%),
    linear-gradient(135deg,#061a2a,#0a3044)!important;
  box-shadow:0 34px 84px rgba(7,29,47,.15)!important;
}
.contact-form{
  border-radius:26px!important;
  box-shadow:0 24px 60px rgba(0,0,0,.17)!important;
}
.field input,.field select,.field textarea{
  border-radius:13px!important;
  border-color:#d3dfe1!important;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--v2-teal)!important;
  box-shadow:0 0 0 4px rgba(10,163,154,.09)!important;
}

/* Footer */
.site-footer{
  background:
    radial-gradient(circle at 90% 0,rgba(25,185,174,.08),transparent 24%),
    #061a2a!important;
}

/* Calculator */
.calculator-body{background:#f1f5f5!important}
.calc-hero{
  padding:82px 0 76px!important;
  background:
    radial-gradient(circle at 87% 4%,rgba(25,185,174,.26),transparent 31%),
    linear-gradient(135deg,#061a2a 0%,#092b40 63%,#08444f 100%)!important;
}
.calc-hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);
}
.calc-hero-grid{grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr)!important;gap:72px!important}
.calc-hero h1{
  max-width:820px!important;
  font-size:clamp(48px,5.35vw,72px)!important;
  line-height:.97!important;
  letter-spacing:-.055em!important;
}
.calc-hero p{max-width:680px!important;font-size:17px!important}
.calc-hero-mark{width:280px!important;height:210px!important}
.calc-hero-mark:before{border-radius:44px!important;transform:rotate(4deg)}
.calc-trust{gap:12px 22px!important}

.calc-section{padding:68px 0 104px!important}
.calculator-layout{grid-template-columns:minmax(0,1fr) 420px!important;gap:32px!important}
.calc-form{gap:18px!important}
.calc-card{
  position:relative;
  padding:34px!important;
  border:1px solid #dbe5e6!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 10px 36px rgba(7,29,47,.04)!important;
}
.calc-card::before{
  content:"";
  position:absolute;
  left:-1px;top:32px;bottom:32px;
  width:3px;border-radius:999px;
  background:linear-gradient(180deg,var(--v2-teal),rgba(10,163,154,.08));
  opacity:.55;
}
.calc-card:hover{border-color:#bfd5d6!important;box-shadow:0 16px 44px rgba(7,29,47,.06)!important}
.step-head{gap:17px!important;margin-bottom:29px!important}
.step-head>span{
  width:40px!important;height:40px!important;
  border-radius:12px!important;
  background:#e5f5f2!important;
  color:#087b76!important;
  box-shadow:inset 0 0 0 1px rgba(10,163,154,.08);
}
.step-head h2{font-size:23px!important;letter-spacing:-.025em!important}
.step-head p{line-height:1.6!important}
.service-options{gap:11px!important}
.service-choice{
  min-height:84px!important;
  padding:16px!important;
  border-radius:15px!important;
  background:#fff!important;
}
.service-choice:hover{border-color:#9bcac6!important;background:#fbfefd!important}
.service-choice.active{
  border-color:var(--v2-teal)!important;
  background:linear-gradient(145deg,#edf9f6,#fff)!important;
  box-shadow:inset 0 0 0 1px rgba(10,163,154,.12)!important;
}
.service-choice .choice-icon{width:44px!important;height:44px!important;border-radius:12px!important}
.addon,.toggle-row{
  min-height:74px;
  border-radius:15px!important;
  background:#fff;
}
.addon:hover,.toggle-row:hover{border-color:#acd2cf!important;background:#fbfefd}
.window-area{border:1px solid #dce8e8;background:#f3faf8!important}
.checklist-include{border-radius:15px!important}
.checklist-preview{border-radius:20px!important}

/* Sticky live-price card */
.result-column{top:106px!important}
.result-card{
  padding:30px!important;
  border:1px solid rgba(255,255,255,.08);
  border-radius:30px!important;
  background:
    radial-gradient(circle at 96% 0,rgba(25,185,174,.22),transparent 31%),
    linear-gradient(155deg,#061a2a,#0a344a 70%,#09505b)!important;
  box-shadow:0 34px 90px rgba(4,25,42,.25)!important;
}
.result-card::before{
  width:300px!important;height:300px!important;
  right:-155px!important;top:-145px!important;
  background:rgba(25,185,174,.12)!important;
}
.result-primary{padding:30px 0 26px!important}
.result-primary strong{font-size:52px!important;letter-spacing:-.055em!important}
.result-secondary{padding:22px 0!important}
.result-secondary strong{font-size:27px!important}
.promotion-box{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px!important;
  background:linear-gradient(135deg,#0b9894,#14b8ad)!important;
  box-shadow:0 12px 26px rgba(0,0,0,.09),inset 0 1px rgba(255,255,255,.16)!important;
}
.breakdown-row{padding:10px 0!important}
.result-actions{gap:10px!important;margin-top:24px!important}
.result-actions .btn-calc{min-height:46px}
.result-actions .btn-calc.primary{
  background:var(--v2-teal-2)!important;
  color:#052833!important;
  box-shadow:0 10px 28px rgba(25,185,174,.16)!important;
}
.result-actions .btn-calc.secondary{background:rgba(240,250,248,.97)!important}
.calc-business-card{border-radius:26px!important;box-shadow:0 18px 50px rgba(7,29,47,.07)!important}

/* Reveal motion is progressive enhancement; content stays visible without JS. */
.v2-reveal{
  opacity:1;
  transform:none;
}
html.v2-motion-ready .v2-reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.22,1,.36,1);
}
html.v2-motion-ready .v2-reveal.is-visible{opacity:1;transform:none}
html.v2-motion-ready .v2-reveal[data-v2-delay="1"]{transition-delay:.06s}
html.v2-motion-ready .v2-reveal[data-v2-delay="2"]{transition-delay:.12s}
html.v2-motion-ready .v2-reveal[data-v2-delay="3"]{transition-delay:.18s}

@media(max-width:1100px){
  .hero-grid{grid-template-columns:1fr .9fr!important;gap:54px!important}
  .hero h1{font-size:clamp(48px,6.2vw,66px)!important}
  .modern-services .service-card,.modern-services .service-featured,.modern-services .service-dark{grid-column:span 6}
  .calculator-banner{padding:52px!important;gap:44px!important}
  .calculator-layout{grid-template-columns:minmax(0,1fr) 380px!important}
}

@media(max-width:900px){
  .container,.calc-container{width:min(100% - 34px,1240px)}
  .site-header .brand,.calc-site-header .brand{width:190px}
  .hero{min-height:auto;padding:82px 0 90px!important}
  .hero-grid{grid-template-columns:1fr!important}
  .hero-copy{max-width:760px!important}
  .hero-visual{min-height:520px!important;max-width:650px;width:100%;margin:0 auto}
  .modern-services .service-card,.modern-services .service-featured,.modern-services .service-dark{grid-column:span 6}
  .calculator-banner{grid-template-columns:1fr!important}
  .calculator-preview{max-width:600px}
  .calculator-layout{grid-template-columns:1fr!important}
  .result-column{position:relative!important;top:auto!important}
  .result-card{max-width:720px;margin:0 auto}
  .calc-hero-grid{grid-template-columns:1fr!important}
  .calc-hero-mark{display:none!important}
}

@media(max-width:680px){
  html{scroll-padding-top:78px}
  .container,.calc-container{width:min(100% - 24px,1240px)}
  .site-header .nav,.calc-site-header .nav{min-height:72px!important}
  .site-header .brand,.calc-site-header .brand{width:150px}
  .hero{padding:58px 0 70px!important}
  .hero h1{font-size:clamp(44px,13vw,60px)!important;line-height:.96!important}
  .lead{font-size:17px!important;line-height:1.67!important}
  .hero-ctas{display:grid!important;grid-template-columns:1fr}
  .hero-ctas .btn{width:100%}
  .hero-visual{min-height:430px!important}
  .hero-photo{inset:0 12px 16px 0!important;border-radius:30px!important}
  .hero-dashboard{left:20px!important;right:0!important;top:40px!important;padding:18px!important;border-radius:22px!important}
  .floating-trust{display:none!important}
  .floating-offer{left:0!important;bottom:28px!important}
  .signal-grid{grid-template-columns:1fr 1fr!important}
  .signal-grid>div{padding:20px 12px!important}
  .signal-grid>div+div::before{display:none}
  .section{padding:82px 0!important}
  .section-head{gap:22px!important;margin-bottom:38px!important}
  .modern-head h2{font-size:clamp(36px,10vw,48px)!important}
  .modern-services{display:grid!important;grid-template-columns:1fr!important}
  .modern-services .service-card,.modern-services .service-featured,.modern-services .service-dark{grid-column:auto!important}
  .service-card{min-height:290px!important}
  .calculator-cta-section{padding:72px 0!important}
  .calculator-banner{padding:34px 24px!important;border-radius:26px!important}
  .modern-contact{border-radius:26px!important}
  .calc-hero{padding:54px 0 58px!important}
  .calc-hero h1{font-size:clamp(42px,12vw,56px)!important}
  .calc-section{padding:34px 0 66px!important}
  .calc-card{padding:22px!important;border-radius:20px!important}
  .calc-card::before{top:22px;bottom:22px}
  .result-card{padding:24px!important;border-radius:24px!important}
  .result-primary strong{font-size:45px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html.v2-motion-ready .v2-reveal{opacity:1!important;transform:none!important}
}

@media print{
  .v2-reveal{opacity:1!important;transform:none!important}
}


/* V2 responsive audit repairs — Oct 2026 */

/* Keep language controls and mobile navigation comfortably tappable. */
.site-header .language-switch,
.calc-site-header .language-switch{
  display:flex;
  align-items:center;
  flex:none;
}
.site-header .language-switch button,
.calc-site-header .language-switch button{
  min-height:36px;
}

/* Make disclosure rows usable as touch controls without changing their typography. */
.about-accordion-item summary,
.faq-grid summary{
  min-height:44px;
  display:flex;
  align-items:center;
}
.card-link{min-height:44px}

/* Mobile live price bar is hidden on wide screens. */
.mobile-price-bar{display:none}

@media(max-width:900px){
  /* Tablet/mobile controls and trust stats must stay inside their rails. */
  .site-header .menu-btn,.calc-site-header .menu-btn{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    padding:0!important;
    flex:0 0 44px!important;
    display:grid!important;
    place-items:center;
  }
  .site-header .language-switch,.calc-site-header .language-switch{min-height:44px}
  .signal-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    min-height:0!important;
  }
  .signal-grid>div{
    min-width:0;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:center;
    align-items:start!important;
    gap:5px!important;
    padding:20px 18px!important;
  }
  .signal-grid strong{display:block}
  .signal-grid span{display:block;min-width:0;overflow-wrap:anywhere}
  .calculator-body{
    padding-bottom:0!important;
    scroll-padding-top:112px;
  }
  .mobile-price-bar{
    position:sticky;
    z-index:45;
    top:96px;
    left:auto;
    bottom:auto;
    transform:none;
    width:min(680px,calc(100% - 28px));
    min-height:68px;
    margin:0 auto 18px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
    padding:10px 12px 10px 16px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:20px;
    color:#fff;
    background:
      radial-gradient(circle at 92% 0,rgba(25,185,174,.22),transparent 38%),
      linear-gradient(145deg,#061a2a,#0a344a);
    box-shadow:0 18px 48px rgba(4,25,42,.28);
    text-align:left;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-price-bar:focus-visible{
    outline:3px solid rgba(25,185,174,.42);
    outline-offset:3px;
  }
  .mobile-price-copy{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:12px;
    align-items:center;
    min-width:0;
  }
  .mobile-price-kicker{
    display:block;
    font-size:9px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:.1em;
    color:#81ddd6;
    text-transform:uppercase;
  }
  .mobile-price-values{
    display:flex;
    align-items:baseline;
    gap:13px;
    min-width:0;
  }
  .mobile-price-values span{min-width:0}
  .mobile-price-values small{
    display:block;
    margin-bottom:2px;
    color:#9eb7c2;
    font-size:9px;
    line-height:1.15;
    font-weight:700;
  }
  .mobile-price-values strong{
    display:block;
    color:#fff;
    font-size:16px;
    line-height:1.1;
    white-space:nowrap;
    font-variant-numeric:tabular-nums;
  }
  .mobile-price-jump{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border-radius:14px;
    background:var(--v2-teal-2);
    color:#052833;
    font-size:20px;
    font-weight:900;
  }
}

@media(max-width:680px){
  /* Header: preserve branding while giving all primary controls real touch area. */
  .site-header .nav,.calc-site-header .nav{
    min-height:76px!important;
    gap:8px!important;
  }
  .site-header .brand,.calc-site-header .brand{
    width:min(148px,42vw)!important;
  }
  .site-header .nav-actions,.calc-site-header .nav-actions{
    gap:6px!important;
    margin-left:auto;
  }
  .site-header .nav-whatsapp,.calc-site-header .nav-whatsapp{
    display:none!important;
  }
  .site-header .language-switch,.calc-site-header .language-switch{
    min-height:44px;
    padding:3px!important;
    border-radius:11px!important;
  }
  .site-header .language-switch button,.calc-site-header .language-switch button{
    min-width:36px;
    min-height:38px;
    padding:6px 8px!important;
    font-size:11px!important;
    border-radius:8px!important;
  }
  .site-header .menu-btn,.calc-site-header .menu-btn{
    display:grid!important;
    place-items:center;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
    padding:0!important;
    border-radius:12px!important;
    font-size:18px!important;
  }
  .site-header .nav-links.open,.calc-site-header .nav-links.open{
    max-height:calc(100dvh - 76px);
    overflow:auto;
    overscroll-behavior:contain;
  }

  /* Hero: dashboard participates in layout, so it cannot collide with the next section. */
  .hero{
    padding:48px 0 58px!important;
  }
  .hero-grid{
    gap:32px!important;
  }
  .hero h1{
    font-size:clamp(38px,10.5vw,46px)!important;
    line-height:1!important;
  }
  .lead{
    font-size:16px!important;
    line-height:1.62!important;
  }
  .hero-visual{
    min-height:0!important;
    height:auto!important;
    max-width:520px;
    width:100%;
    margin:0 auto!important;
    padding:18px 0 68px 18px;
    isolation:isolate;
  }
  .hero-photo{
    position:absolute!important;
    inset:0 8px 18px 0!important;
    border-radius:28px!important;
    z-index:-1;
  }
  .hero-dashboard{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:100%!important;
    margin:18px 0 0!important;
    padding:16px!important;
    border-radius:21px!important;
  }
  .dashboard-top{
    gap:8px!important;
    margin-bottom:12px!important;
  }
  .dashboard-top h3{font-size:18px!important}
  .status-badge{
    padding:6px 8px!important;
    font-size:9px!important;
  }
  .dashboard-price-card{
    padding:16px!important;
    border-radius:16px!important;
  }
  .dashboard-price-card strong{font-size:20px!important}
  .dashboard-price-card a{
    min-height:44px;
    padding:10px 12px!important;
  }
  .dashboard-services{
    gap:8px!important;
    margin-top:10px!important;
  }
  .dashboard-services>div{
    min-width:0;
    padding:8px 10px!important;
    gap:8px!important;
  }
  .dashboard-services p{min-width:0}
  .dashboard-services b{font-size:11px!important}
  .dashboard-services small{font-size:9px!important}
  .floating-trust{display:none!important}
  .floating-offer{
    left:0!important;
    right:auto!important;
    bottom:16px!important;
    padding:11px 14px!important;
    border-radius:14px!important;
  }

  /* Trust stats: stack value over copy so two columns can shrink safely. */
  .signal-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    min-height:0!important;
  }
  .signal-grid>div{
    min-width:0;
    min-height:112px;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:center;
    align-items:start!important;
    gap:5px!important;
    padding:18px 12px!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
  }
  .signal-grid>div:first-child{padding-left:12px!important}
  .signal-grid>div:nth-last-child(-n+2){border-bottom:0!important}
  .signal-grid strong{
    display:block;
    font-size:26px!important;
    line-height:1!important;
  }
  .signal-grid span{
    display:block;
    min-width:0;
    font-size:12px!important;
    line-height:1.4!important;
    overflow-wrap:anywhere;
  }

  /* Reduce repetitive mobile height without shrinking content. */
  .section{padding:72px 0!important}
  .service-card{
    min-height:0!important;
    padding:22px!important;
  }
  .service-card h3{
    margin:26px 0 10px!important;
    font-size:23px!important;
  }
  .service-card p{
    font-size:14px;
    line-height:1.6!important;
  }
  .service-card .card-link{
    margin-top:20px!important;
    padding-top:12px!important;
  }
  .about-accordion-item summary,
  .faq-grid summary{
    min-height:48px;
    padding-top:8px;
    padding-bottom:8px;
  }

  /* Calculator: get users to Step 01 sooner. */
  .calc-hero{
    padding:38px 0 42px!important;
  }
  .calc-hero h1{
    font-size:clamp(38px,10.5vw,48px)!important;
    line-height:1!important;
    margin-top:12px!important;
    margin-bottom:14px!important;
  }
  .calc-hero p{
    font-size:15px!important;
    line-height:1.62!important;
  }
  .calc-trust{
    gap:8px 14px!important;
    margin-top:20px!important;
    font-size:12px!important;
  }
  .calc-section{
    padding:22px 0 60px!important;
  }
  .mobile-price-bar{top:134px}
  .calc-card{
    padding:21px!important;
  }
  .step-head{
    margin-bottom:22px!important;
  }
  .step-head>span{
    width:44px!important;
    height:44px!important;
    flex:0 0 44px;
  }
  .service-choice{
    min-height:76px!important;
    padding:14px!important;
  }
  .addon,.toggle-row,.checklist-include{
    min-height:72px;
  }
  .result-actions .btn-calc{
    min-height:48px;
  }
}

@media(max-width:400px){
  .site-header .brand,.calc-site-header .brand{width:min(136px,39vw)!important}
  .site-header .language-switch button,.calc-site-header .language-switch button{
    min-width:34px;
    padding-left:6px!important;
    padding-right:6px!important;
  }
  .signal-grid span{font-size:11.5px!important}
  .mobile-price-bar{
    width:calc(100% - 20px);
    gap:8px;
    padding-left:12px;
    padding-right:9px;
  }
  .mobile-price-copy{
    gap:8px;
  }
  .mobile-price-values{
    gap:9px;
  }
  .mobile-price-values strong{font-size:14px}
  .mobile-price-jump{
    width:42px;
    height:42px;
  }
}

@media print{
  .mobile-price-bar{display:none!important}
}


/* V2 branch-deploy refresh: 2026-10-03 */


/* Transparent footer brand asset */
.site-footer .footer-brand .brand,
.site-footer .footer-brand .brand img{
  background:transparent!important;
}
.site-footer .footer-brand .brand img{
  object-fit:contain;
}


/* Promo percent must match Rabatt/discount typography */
.floating-offer strong [data-promo-percent]{
  font-size:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  letter-spacing:inherit!important;
  color:inherit!important;
}


/* Calculator hero contrast correction */
.calc-hero h1{
  color:#ffffff!important;
}
.calc-hero h1 em{
  color:#58d3c8!important;
}
.calc-hero p{
  color:rgba(236,247,249,.90)!important;
}
.calc-eyebrow{
  color:#63ddd3!important;
}
.calc-trust{
  color:rgba(244,250,252,.94)!important;
}
.calc-hero-mark{
  opacity:.72;
}
.calc-hero-mark img{
  filter:drop-shadow(0 14px 36px rgba(0,0,0,.18))!important;
}