:root{
  --bg:#0b1118;
  --bg-soft:#101924;
  --bg-card:#121c29;
  --surface:#f4f1ea;
  --surface-2:#ede8df;
  --text:#f5f7fb;
  --text-dark:#101722;
  --muted:#b8c2d2;
  --muted-dark:#516072;
  --line:rgba(255,255,255,.08);
  --line-dark:rgba(16,23,34,.10);
  --blue:#1698ff;
  --red:#ef2d2d;
  --shadow:0 18px 42px rgba(0,0,0,.28);
  --radius:28px;
  --radius-sm:20px;
  --max:1180px;
  --ease:.38s cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea{font:inherit}
.wrap{width:min(var(--max), calc(100% - 34px));margin:0 auto}
.scroll-progress{position:fixed;left:0;top:0;height:4px;background:linear-gradient(90deg,var(--blue),var(--red));width:0;z-index:120}
.site-header{position:sticky;top:0;z-index:100;background:rgba(8,12,18,.72);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.06);transition:padding var(--ease),background var(--ease),box-shadow var(--ease)}
.site-header.scrolled{background:rgba(8,12,18,.92);box-shadow:0 10px 30px rgba(0,0,0,.28)}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 0;transition:padding var(--ease)}
.site-header.scrolled .bar{padding:10px 0}
.brand{display:inline-flex;align-items:center;gap:14px;position:relative}
.brand::before{content:"";position:absolute;left:-18px;top:50%;transform:translateY(-50%);width:140px;height:140px;border-radius:50%;background:radial-gradient(circle, rgba(22,152,255,.18), transparent 64%);filter:blur(12px);pointer-events:none}
.brand img{height:54px;width:auto;position:relative;z-index:1}
.nav{display:flex;align-items:center;gap:26px}
.nav>a,.drop-toggle{font-weight:750;color:#eef3fa;position:relative}
.nav>a::after,.drop-toggle::after{content:"";position:absolute;left:0;bottom:-8px;width:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--red));transition:width var(--ease)}
.nav>a:hover::after,.drop:hover .drop-toggle::after{width:100%}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:16px;background:linear-gradient(135deg,#ff4646,#d81818);color:#fff;font-weight:800;box-shadow:0 12px 26px rgba(215,23,23,.22);transition:transform var(--ease), box-shadow var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(215,23,23,.28)}
.btn.dark{background:#0f1824;color:#fff;border:1px solid rgba(255,255,255,.12);box-shadow:none}
.btn.light{background:#fff;color:#0d1520;box-shadow:0 10px 28px rgba(0,0,0,.12)}
.nav-toggle{display:none;background:none;border:0;color:#fff;font-size:30px;line-height:1}
.drop{position:relative}
.drop-menu{position:absolute;top:calc(100% + 18px);left:0;min-width:320px;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:rgba(11,17,24,.98);box-shadow:0 24px 60px rgba(0,0,0,.36);opacity:0;transform:translateY(10px);pointer-events:none;transition:all var(--ease)}
.drop:hover .drop-menu,.drop:focus-within .drop-menu{opacity:1;transform:translateY(0);pointer-events:auto}
.drop-menu a{display:block;padding:12px 14px;border-radius:14px;color:#f4f8fc}
.drop-menu a span{display:block;font-size:13px;color:#97a5bb;margin-top:4px}
.drop-menu a:hover{background:rgba(255,255,255,.04)}
.mobile-panel{display:none;padding:0 0 16px}
.mobile-panel a{display:block;padding:11px 0;color:#fff;border-top:1px solid rgba(255,255,255,.08)}
.hero{position:relative;overflow:hidden;min-height:92vh;background:
linear-gradient(90deg, rgba(6,10,15,.95) 0%, rgba(6,10,15,.84) 36%, rgba(6,10,15,.48) 66%, rgba(6,10,15,.22) 100%),
url('assets/img/hero-home.jpg') center/cover no-repeat;}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 72%, #0b1118 100%)}
.hero-inner{position:relative;z-index:2;padding:70px 0 110px}
.hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:30px;align-items:center;min-height:calc(92vh - 90px)}
.hero-copy{max-width:690px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#a6d3ff;margin-bottom:18px}
.eyebrow::before{content:"";width:34px;height:2px;background:linear-gradient(90deg,var(--blue),var(--red));border-radius:999px}
h1{font-size:clamp(44px,7vw,84px);line-height:.98;margin:0 0 20px;letter-spacing:-.03em}
.hero p{font-size:clamp(18px,2vw,24px);max-width:640px;color:#e3eaf4;margin:0 0 28px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:40px}
.hero-checks{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:16px 26px;max-width:700px}
.hero-check{display:flex;gap:12px;align-items:flex-start;color:#edf3fb}
.hero-check i{font-style:normal;font-size:20px;font-weight:900;color:var(--blue)}
.hero-ghost{min-height:52px;padding:0 22px;border-radius:16px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#fff;font-weight:800}
.hero-card{justify-self:end;max-width:720px;width:100%;position:relative;padding:0;background:none;border:0;backdrop-filter:none;box-shadow:none}
.hero-card::after{content:"";position:absolute;left:26px;right:26px;bottom:-12px;height:72px;border-radius:999px;background:linear-gradient(90deg,rgba(22,152,255,.18),rgba(239,45,45,.18));filter:blur(24px);z-index:-1}
.hero-card img{width:100%;height:min(62vh,620px);object-fit:cover;border-radius:30px;box-shadow:0 28px 60px rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.08)}
.hero-card .meta{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:absolute;left:18px;right:18px;bottom:18px;margin-top:0}
.hero-card .meta div{padding:16px;border-radius:18px;background:rgba(8,13,20,.72);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08)}
.hero-card .meta strong{display:block;font-size:28px}
.section{padding:88px 0}
.surface{background:var(--surface);color:var(--text-dark)}
.surface .muted{color:var(--muted-dark)}
.section-title{font-size:clamp(32px,4vw,54px);line-height:1.03;margin:0 0 14px;letter-spacing:-.03em}
.section-sub{font-size:18px;color:var(--muted);max-width:760px;margin:0}
.surface .section-sub{color:var(--muted-dark)}
.kicker{font-size:14px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--blue);margin-bottom:12px}
.scrolly{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:start;margin-top:40px}
.scrolly-preview{position:sticky;top:102px;background:var(--bg-soft);border:1px solid var(--line);border-radius:30px;overflow:hidden;box-shadow:var(--shadow)}
.scrolly-preview img{width:100%;aspect-ratio:16/10;object-fit:cover}
.scrolly-preview .copy{padding:26px 24px 28px}
.scrolly-preview .copy h3{font-size:36px;line-height:1.02;margin:0 0 12px}
.scrolly-preview .copy p{margin:0 0 18px;color:var(--muted)}
.steps{display:grid;gap:18px}
.step{padding:24px;border-radius:24px;border:1px solid var(--line-dark);background:#fff;cursor:pointer;transition:transform var(--ease),box-shadow var(--ease),border-color var(--ease),background var(--ease)}
.step.active,.step:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(16,23,34,.10);border-color:rgba(22,152,255,.26);background:#fbfaf7}
.step strong{display:block;font-size:28px;line-height:1.04;margin-bottom:10px}
.step p{margin:0;color:#516072}
.step small{display:inline-block;margin-top:12px;font-weight:800;color:var(--red)}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:38px}
.service-card{position:relative;overflow:hidden;border-radius:30px;min-height:340px;background:#101822;box-shadow:var(--shadow)}
.service-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.service-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(5,8,13,.10), rgba(5,8,13,.78) 74%, rgba(5,8,13,.92) 100%);z-index:1}
.service-card .content{position:absolute;left:0;right:0;bottom:0;padding:24px;z-index:2}
.service-card h3{font-size:36px;line-height:1.02;margin:0 0 10px}
.service-card p{margin:0;color:#dbe4ef;max-width:520px;opacity:.92;max-height:0;overflow:hidden;transition:max-height var(--ease), opacity var(--ease), margin var(--ease)}
.service-card .tag{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.10);padding:8px 12px;border-radius:999px;margin-bottom:12px}
.service-card .cta-row{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.service-card .cta-row span{font-weight:800}
.service-card:hover img{transform:scale(1.06)}
.service-card:hover p,.service-card:focus-within p{max-height:120px;margin-top:8px}
.mini-features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.mini{padding:22px;border-radius:22px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.mini strong{display:block;font-size:22px;margin-bottom:8px}
.page-hero{padding:92px 0 58px;background:linear-gradient(90deg, rgba(6,10,15,.96), rgba(6,10,15,.60)), #0b1118}
.page-hero-grid{display:grid;grid-template-columns:1fr .9fr;gap:30px;align-items:center}
.page-hero .visual{border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
.page-hero .visual img{width:100%;aspect-ratio:16/11;object-fit:cover}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.method{padding:24px;border-radius:22px;background:#fff;border:1px solid var(--line-dark);box-shadow:0 10px 24px rgba(16,23,34,.06)}
.method h4{font-size:22px;margin:0 0 10px}
.method p{margin:0;color:#506072}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.time-card{padding:24px;border-radius:22px;background:var(--bg-soft);border:1px solid var(--line)}
.time-card .num{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--red));color:#fff;font-weight:900;margin-bottom:14px}
.time-card h4{font-size:22px;margin:0 0 8px}
.time-card p{margin:0;color:var(--muted)}
.cta-band{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;padding:30px;border-radius:28px;background:linear-gradient(90deg,#101822,#0e1620);color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)}
.cta-band h3{font-size:34px;line-height:1.05;margin:0 0 8px}
.cta-band p{margin:0;color:#c5d1e0}
.phone{font-size:30px;font-weight:900}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .75s ease, transform .75s ease}
.reveal.visible{opacity:1;transform:none}
.footer{padding:26px 0 44px;background:#081019;border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:28px;color:#c6d0df}
.footer-grid h4{margin:0 0 10px;font-size:18px}
.footer-grid p,.footer-grid a{margin:0;color:#9fb0c4}
.footer-logo{max-width:280px;margin-bottom:14px}
.legal{margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:#90a2b6}
.contact-card{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.contact-box{padding:28px;border-radius:24px;background:#fff;border:1px solid var(--line-dark);box-shadow:0 10px 24px rgba(16,23,34,.06)}
.contact-box h3{margin:0 0 8px;font-size:30px}
.contact-box p{margin:0 0 16px;color:#506072}
.contact-box ul{margin:0;padding-left:18px;color:#506072}
.form-grid{display:grid;gap:16px}
.input{width:100%;padding:14px 16px;border-radius:14px;border:1px solid #d8dee8;background:#fff}
.input:focus{outline:none;border-color:#8fc8ff;box-shadow:0 0 0 4px rgba(22,152,255,.10)}
textarea.input{min-height:140px;resize:vertical}
@media (max-width: 1024px){
  .hero-grid,.page-hero-grid,.scrolly,.contact-card{grid-template-columns:1fr}
  .hero-card{justify-self:start;max-width:100%}
  .hero-card img{height:min(58vh,560px)}
  .scrolly-preview{position:relative;top:auto}
  .method-grid,.timeline,.mini-features,.footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 760px){
  .nav{display:none}
  .nav-toggle{display:block}
  .mobile-panel.open{display:block}
  .hero{min-height:auto}
  .hero-inner{padding:54px 0 80px}
  .hero-card img{height:auto;max-height:none}
  .hero-grid,.page-hero-grid,.service-grid,.method-grid,.timeline,.mini-features,.footer-grid,.contact-card{grid-template-columns:1fr}
  .hero-checks{grid-template-columns:1fr}
  .site-header .bar{padding:12px 0}
  .brand img{height:44px}
  h1{font-size:52px}
  .section{padding:72px 0}
}


/* ===== v8.1 enhancements ===== */
.header-hotline{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:0 0 14px;color:#eef5ff}
.header-hotline .pulse{width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(239,45,45,.8);animation:pulseRing 1.8s infinite}
.header-hotline strong{font-size:15px;font-weight:900;letter-spacing:.02em}
.header-hotline a{font-weight:900;color:#fff;padding:9px 14px;border-radius:999px;background:linear-gradient(135deg,rgba(22,152,255,.16),rgba(239,45,45,.16));border:1px solid rgba(255,255,255,.12);transition:transform var(--ease), background var(--ease)}
.header-hotline a:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(22,152,255,.24),rgba(239,45,45,.24))}
.header-hotline .hotline-note{font-size:14px;color:#b9c7d8}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(239,45,45,.75)}70%{box-shadow:0 0 0 14px rgba(239,45,45,0)}100%{box-shadow:0 0 0 0 rgba(239,45,45,0)}}
.drop::before{content:"";position:absolute;left:-14px;right:-14px;top:100%;height:22px}
.drop-menu{top:calc(100% + 10px)}
.drop.open .drop-menu,.drop:hover .drop-menu,.drop:focus-within .drop-menu{opacity:1;transform:translateY(0);pointer-events:auto}
.drop.open .drop-toggle::after,.drop:hover .drop-toggle::after{width:100%}
.drop-menu a{position:relative;padding-right:44px}
.drop-menu a::after{content:'→';position:absolute;right:14px;top:50%;transform:translateY(-50%) translateX(-4px);opacity:0;transition:all var(--ease);font-weight:900}
.drop-menu a:hover::after{opacity:1;transform:translateY(-50%) translateX(0)}
.hero-hotline{display:inline-flex;align-items:center;gap:10px;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);backdrop-filter:blur(8px);margin-bottom:18px}
.hero-hotline strong{font-size:15px;letter-spacing:.01em}
.hero-hotline span{color:#c0ccdc;font-size:14px}
.hero-hotline a{font-weight:900;color:#fff}
.hero-hotline .pulse{width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(239,45,45,.8);animation:pulseRing 1.8s infinite}
.hotline-float{position:fixed;right:20px;bottom:20px;z-index:130;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:linear-gradient(135deg,#101822,#0a1119);border:1px solid rgba(255,255,255,.10);box-shadow:0 18px 42px rgba(0,0,0,.28);color:#fff;transition:transform var(--ease), box-shadow var(--ease)}
.hotline-float:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(0,0,0,.34)}
.hotline-float .pulse{width:12px;height:12px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(239,45,45,.8);animation:pulseRing 1.8s infinite}
.hotline-float strong{display:block;font-size:15px;line-height:1.05}
.hotline-float span{display:block;font-size:12px;color:#b9c7d8;line-height:1.1;margin-top:4px}
.hero-card,.service-card,.method,.mini,.time-card,.contact-box,.step{will-change:transform}
.service-card{transition:transform var(--ease), box-shadow var(--ease)}
.service-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px rgba(0,0,0,.28)}
.scrolly-preview img{transition:opacity .35s ease, transform .55s ease}
.scrolly-preview.swap img{opacity:.5;transform:scale(1.03)}
.step{position:relative}
.step::after{content:'↗';position:absolute;right:22px;top:22px;font-size:18px;font-weight:900;color:var(--red);opacity:0;transform:translateY(4px);transition:all var(--ease)}
.step:hover::after,.step.active::after{opacity:1;transform:none}
.cta-band.hotline-emphasis{align-items:center;background:linear-gradient(90deg,#0b1420,#111d2b 52%, #162334 100%)}
.cta-band.hotline-emphasis .phone{font-size:34px;letter-spacing:.01em}
.cta-band.hotline-emphasis h3{display:flex;align-items:center;gap:12px}
.cta-band.hotline-emphasis h3 .pulse{width:12px;height:12px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(239,45,45,.8);animation:pulseRing 1.8s infinite}
.footer .footer-hotline{margin-top:12px;display:inline-flex;align-items:center;gap:10px;font-weight:900;color:#fff}
.footer .footer-hotline .pulse{width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(239,45,45,.8);animation:pulseRing 1.8s infinite}
.contact-quick{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:18px}
.quick-card{padding:18px 20px;border-radius:18px;background:#f8fbff;border:1px solid #dbe6f4}
.quick-card strong{display:block;font-size:18px;margin-bottom:6px;color:#0d1520}
.quick-card p{margin:0;color:#546476}
@media (max-width:760px){
  .header-hotline{padding-bottom:12px;gap:10px}
  .header-hotline strong{width:100%}
  .hotline-float{right:14px;left:14px;bottom:14px;justify-content:center}
  .contact-quick{grid-template-columns:1fr}
}


/* ===== v8.3 about + mega menu ===== */
.drop-menu.mega-menu{width:min(1040px, calc(100vw - 48px));left:50%;transform:translate(-50%,10px);padding:18px;border-radius:26px;background:linear-gradient(180deg, rgba(8,14,21,.98), rgba(13,22,33,.98));border:1px solid rgba(255,255,255,.10);box-shadow:0 30px 70px rgba(0,0,0,.42)}
.drop:hover .drop-menu.mega-menu,.drop:focus-within .drop-menu.mega-menu,.drop.open .drop-menu.mega-menu{transform:translate(-50%,0)}
.mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mega-card{position:relative;display:block;min-height:198px;border-radius:20px;overflow:hidden;background:linear-gradient(180deg,#0d1520,#121d2a);border:1px solid rgba(255,255,255,.07);padding:0}
.mega-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform var(--ease),opacity var(--ease)}
.mega-card .overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(5,8,12,.18), rgba(5,8,12,.84));z-index:1}
.mega-card .copy{position:absolute;left:0;right:0;bottom:0;padding:16px 16px 18px;z-index:2}
.mega-card strong{display:block;font-size:18px;line-height:1.08;color:#fff}
.mega-card span{display:block;font-size:13px;color:#bfd0e4;margin-top:6px}
.mega-card:hover{border-color:rgba(22,152,255,.28);box-shadow:0 18px 44px rgba(0,0,0,.28)}
.mega-card:hover img{transform:scale(1.06)}
.mega-card::after{content:'';position:absolute;left:16px;right:16px;top:16px;height:2px;background:linear-gradient(90deg,var(--blue),var(--red));z-index:2;opacity:.72}
.mega-card--all{display:flex;align-items:flex-end;justify-content:flex-start;background:radial-gradient(circle at 15% 20%, rgba(22,152,255,.20), transparent 30%),linear-gradient(180deg,#0d1c2b,#0b1320)}
.mega-card--all .copy{position:relative;padding:20px}
.mega-card--all .arrow{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);margin-bottom:16px;color:#fff}
.hero .trust-inline{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.trust-inline{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.trust-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);color:#f5f8fc;font-weight:700;font-size:14px;backdrop-filter:blur(8px)}
.trust-chip i{font-style:normal;color:var(--blue);font-weight:900}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.testimonial-card{padding:26px;border-radius:24px;background:linear-gradient(180deg,#0f1824,#111c29);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow);transition:transform var(--ease), box-shadow var(--ease)}
.testimonial-card:hover{transform:translateY(-4px);box-shadow:0 22px 48px rgba(0,0,0,.28)}
.testimonial-card .stars{font-size:18px;letter-spacing:.12em;color:#ffd54f;margin-bottom:14px}
.testimonial-card h3{margin:0 0 10px;font-size:24px}
.testimonial-card p{margin:0;color:#c8d3e2}
.footer-grid--4{grid-template-columns:1.1fr .9fr .8fr .9fr}
.about-hero{background:linear-gradient(90deg, rgba(6,10,15,.96), rgba(6,10,15,.70)), linear-gradient(135deg,#0b1118,#101924)}
.about-grid{grid-template-columns:1fr .95fr}
.about-hero-visual{border-radius:28px;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.08)}
.about-hero-visual img{width:100%;aspect-ratio:16/11;object-fit:cover}
.placeholder-note{margin-top:14px!important;font-size:13px!important;color:#9fb0c4!important;max-width:700px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.stat-card{padding:24px;border-radius:24px;background:#fff;border:1px solid var(--line-dark);box-shadow:0 12px 30px rgba(16,23,34,.06)}
.stat-card strong{display:block;font-size:46px;line-height:1;margin-bottom:10px;color:#0f1824}
.stat-card span{display:block;color:#556476;font-weight:600}
.stat-card em{font-style:normal;color:#8b98a8;font-weight:500}
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.value-card{padding:28px;border-radius:26px;background:linear-gradient(180deg,#111a27,#0e1722);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)}
.value-card h3{margin:0 0 12px;font-size:28px;line-height:1.08}
.value-card p{margin:0;color:#c2cedd}
.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.cert-card{padding:24px;border-radius:24px;background:#fff;border:1px solid var(--line-dark);box-shadow:0 12px 30px rgba(16,23,34,.06)}
.cert-badge{display:inline-flex;align-items:center;justify-content:center;min-width:72px;padding:8px 12px;border-radius:999px;color:#fff;font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.cert-badge.blue{background:linear-gradient(135deg,var(--blue),#0f6dff)}
.cert-badge.red{background:linear-gradient(135deg,var(--red),#b91519)}
.cert-card h3{margin:0 0 10px;font-size:24px;color:#0f1824}
.cert-card p{margin:0;color:#556476}
@media (max-width:1024px){
  .drop-menu.mega-menu{width:min(880px, calc(100vw - 36px))}
  .mega-grid,.testimonial-grid,.stats-grid,.value-grid,.cert-grid,.footer-grid--4{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .testimonial-grid,.stats-grid,.value-grid,.cert-grid,.footer-grid--4{grid-template-columns:1fr}
  .hero .trust-inline,.trust-inline{gap:8px}
  .trust-chip{font-size:13px;padding:9px 12px}
}

.header-trust{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.header-trust span{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#d6e0ee}.hero-copy .trust-inline{margin-top:20px}@media (max-width:760px){.header-trust{width:100%;}}


/* final professional cleanup */
.header-trust{display:flex;gap:10px;flex-wrap:wrap;margin-left:auto}
.header-trust span{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#d7e0ec;font-size:12px;font-weight:700}
.cert-card h3{margin-top:16px;margin-bottom:10px;font-size:26px;line-height:1.1;color:#0f1824}
.cert-card p{margin:0;color:#5b697a}
.footer-logo{height:64px;max-width:none}
.brand img{height:56px;opacity:1}
.legal span:first-child{color:#b8c4d4}
@media (max-width:760px){.header-trust{margin-left:0;width:100%}.brand img{height:48px}}


/* ===== v2 refinement pass ===== */
.nav{gap:22px}
.nav > a, .drop-toggle{white-space:nowrap}
.header-hotline{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.header-hotline .hotline-note{color:#c5d1e1}
.header-trust span{background:rgba(255,255,255,.05);font-size:11px}
.hero-hotline, .header-hotline a{white-space:nowrap}
.why-clay-surface{background:var(--surface-2);color:var(--text-dark)}
.why-clay-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:34px}
.why-clay-card{background:#fff;border:1px solid var(--line-dark);border-radius:26px;padding:26px;box-shadow:0 12px 30px rgba(16,23,34,.06)}
.why-clay-card h3{margin:0 0 10px;font-size:28px;color:#0f1824}
.why-clay-card p{margin:0;color:#556476;line-height:1.68}
.service-card::before{background:linear-gradient(180deg, rgba(5,8,13,.06), rgba(5,8,13,.56) 42%, rgba(5,8,13,.94) 100%)}
.service-card .content{padding:26px 24px 24px}
.service-card h3,.service-card p,.service-card .cta-row span,.service-card .tag{color:#fff !important;text-shadow:0 3px 18px rgba(0,0,0,.42)}
.service-card .tag{background:rgba(9,15,23,.48);border-color:rgba(255,255,255,.12)}
.service-card .cta-row{color:#fff}
.jobs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:26px}
.job-card{background:#fff;border:1px solid var(--line-dark);border-radius:28px;padding:28px;box-shadow:0 14px 34px rgba(16,23,34,.06)}
.job-card h3{margin:8px 0 10px;font-size:30px;color:#0f1824;line-height:1.08}
.job-card p{margin:0 0 14px;color:#556476;line-height:1.68}
.job-card ul{margin:0;padding-left:18px;color:#334155}
.job-card li{margin:8px 0}
.job-badge{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;background:linear-gradient(135deg,var(--blue),#0f6dff);color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.career-grid{grid-template-columns:1.05fr .95fr}
.career-values .value-card{background:linear-gradient(180deg,#111a27,#0e1722)}
.career-values .value-card p{color:#c8d3e2}
.career-cta .hero-actions{justify-content:flex-end}
.cert-note{margin:22px 0 0;color:#64748b;font-size:14px;line-height:1.65;max-width:900px}
.placeholder-note{color:#9fb0c4!important}
@media (max-width:1024px){.why-clay-grid,.jobs-grid{grid-template-columns:1fr 1fr}.career-grid{grid-template-columns:1fr}.nav{gap:18px}}
@media (max-width:760px){.why-clay-grid,.jobs-grid{grid-template-columns:1fr}.header-hotline{gap:10px}.header-trust{display:none}.hero .trust-inline{display:flex}.why-clay-card h3{font-size:24px}.job-card h3{font-size:26px}}

.service-card .content{background:linear-gradient(180deg, rgba(8,12,18,0) 0%, rgba(8,12,18,.10) 18%, rgba(8,12,18,.78) 78%, rgba(8,12,18,.93) 100%);}
.mega-card .copy{background:linear-gradient(180deg, rgba(8,12,18,0) 0%, rgba(8,12,18,.76) 100%);}



/* ===== Screen-fix pass ===== */
.nav>a[aria-current="page"]::after,
.drop-toggle[aria-current="page"]::after{width:100% !important}

.page-hero{padding:102px 0 68px}
.page-hero-grid{grid-template-columns:1fr 1.08fr;gap:42px;align-items:center}
.page-hero .visual,
.about-hero-visual{border-radius:34px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.page-hero .visual img,
.about-hero-visual img{
  width:100%;
  aspect-ratio: 4 / 3;
  min-height: 460px;
  object-fit: cover;
  object-position: center;
}
.about-grid,.career-grid{grid-template-columns:1fr 1.06fr;gap:42px}
.about-hero-visual{position:relative}
.about-hero-visual::after{
  content:"";
  position:absolute; inset:auto 0 0 0;
  height:45%;
  background:linear-gradient(180deg, rgba(5,11,20,0), rgba(5,11,20,.35));
  pointer-events:none;
}
.service-card::before{
  background:linear-gradient(180deg, rgba(5,8,13,.14), rgba(5,8,13,.72) 52%, rgba(5,8,13,.94) 100%) !important;
}
.service-card .content{
  background:linear-gradient(180deg, rgba(5,11,20,0) 0%, rgba(5,11,20,.12) 25%, rgba(5,11,20,.36) 100%);
}
.service-card h3,
.service-card p,
.service-card .tag,
.service-card .cta-row span{
  color:#fff !important;
  text-shadow:0 3px 18px rgba(0,0,0,.42);
}
.service-card p{font-size:1rem;line-height:1.62}
.service-card .tag{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.18);
  backdrop-filter: blur(6px);
}
.steps .step{
  min-height:unset;
}
.steps .step strong{display:block;font-size:2rem;line-height:1.02;color:#101722;margin-bottom:.5rem}
.steps .step p{color:#536375}
.why-clay-surface .value-card h3{font-size:1.4rem}
.why-clay-surface .value-card p{font-size:1rem;line-height:1.7}
.career-grid .about-hero-visual img{object-position:center 24%}
.team-callout{
  margin-top:18px;
  display:inline-flex; align-items:center; gap:10px;
  padding:12px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  color:#fff; font-weight:700;
}
.team-callout i{
  display:inline-grid;place-items:center;
  width:28px;height:28px;border-radius:50%;
  background:linear-gradient(135deg,var(--blue),var(--red));
  font-style:normal;color:#fff;font-weight:900;
}
.cert-note{
  margin-top:18px;
  padding:16px 18px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(16,23,34,.08);
  color:#5f6f81;
  font-size:.96rem;
  line-height:1.65;
}
.cert-note strong{color:#0f1824}
@media (max-width: 960px){
  .page-hero-grid,.about-grid,.career-grid{grid-template-columns:1fr}
  .page-hero .visual img,.about-hero-visual img{min-height:340px}
}


/* ===== Final pass based on user review ===== */

.nav > a[aria-current="page"]::after,
.drop-toggle[aria-current="page"]::after{width:100% !important}

.hero-grid{grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center}
.team-hero-card{max-width:880px;justify-self:end;position:relative}
.team-hero-card img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:34px;
  background:#0c1420;
}
.team-hero-card::after{left:40px;right:40px;bottom:-18px;height:88px}
.team-hero-card .team-badge{
  position:absolute;left:22px;bottom:22px;z-index:3;
  display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;
  background:rgba(8,13,20,.78);border:1px solid rgba(255,255,255,.10);color:#fff;font-weight:800;
  backdrop-filter:blur(10px)
}
.about-grid,.career-grid{grid-template-columns:.88fr 1.12fr;gap:44px;align-items:center}
.team-visual{border-radius:34px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.08);background:#0d1520}
.team-visual img{
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
}
.page-hero{padding:110px 0 72px}
.page-hero-grid{grid-template-columns:.92fr 1.08fr;gap:44px;align-items:center}
.page-hero .visual.service-hero-visual img{
  width:100%;
  height:560px !important;
  min-height:560px !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:34px;
}
.home-services .service-grid-home{grid-template-columns:repeat(2,1fr);gap:22px;margin-top:34px}
.home-services .service-card{min-height:360px}
.home-services .service-card:nth-child(5){grid-column:1/-1;min-height:340px}
.home-services .service-card .content{padding:28px 26px 24px;background:linear-gradient(180deg, rgba(5,11,20,0) 0%, rgba(5,11,20,.14) 20%, rgba(5,11,20,.82) 78%, rgba(5,11,20,.96) 100%)}
.home-services .service-card h3{font-size:34px}
.home-services .service-card p{max-height:200px !important;margin-top:8px;color:#f3f7fc !important}
.home-services .service-card .cta-row{margin-top:14px}
.service-card h3,.service-card p,.service-card .tag,.service-card .cta-row span{color:#fff !important;text-shadow:0 3px 18px rgba(0,0,0,.48)}
.service-card::before{background:linear-gradient(180deg, rgba(5,8,13,.10), rgba(5,8,13,.66) 48%, rgba(5,8,13,.94) 100%) !important}
.service-card .tag{background:rgba(9,15,23,.56) !important;border-color:rgba(255,255,255,.16) !important}
.cert-note{font-size:13px;color:#64748b;background:#fff;padding:14px 16px;border-radius:16px;border:1px solid rgba(16,23,34,.08)}
.cert-note strong{color:#0f1824}
@media (max-width:1024px){
  .hero-grid,.about-grid,.career-grid,.page-hero-grid{grid-template-columns:1fr}
  .team-hero-card,.team-visual,.page-hero .visual{max-width:none;justify-self:stretch}
  .page-hero .visual.service-hero-visual img{height:440px !important;min-height:440px !important}
}
@media (max-width:760px){
  .home-services .service-grid-home{grid-template-columns:1fr}
  .home-services .service-card:nth-child(5){grid-column:auto;min-height:300px}
  .team-hero-card img,.team-visual img{border-radius:24px}
  .page-hero .visual.service-hero-visual img{height:320px !important;min-height:320px !important}
}


/* ===== Image sizing + team image corrections ===== */
.hero .wrap,
.page-hero .wrap{
  width:min(1320px, calc(100% - 34px));
}
.hero-grid{
  grid-template-columns:.78fr 1.22fr !important;
  gap:42px !important;
}
.hero-card{
  max-width:none !important;
  width:100% !important;
}
.team-hero-card{
  max-width:none !important;
  width:100% !important;
  align-self:stretch !important;
}
.team-hero-card img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:34px !important;
  background:#0c1420 !important;
}
.team-badge{
  display:none !important;
}
.about-grid,
.career-grid,
.page-hero-grid{
  grid-template-columns:.82fr 1.18fr !important;
  gap:52px !important;
  align-items:center !important;
}
.about-hero-visual,
.team-visual,
.page-hero .visual,
.page-hero .visual.service-hero-visual{
  border-radius:34px !important;
  overflow:hidden !important;
}
.about-hero-visual img,
.team-visual img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:auto !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center center !important;
}
.page-hero .visual img,
.page-hero .visual.service-hero-visual img{
  width:100% !important;
  height:clamp(480px, 62vh, 760px) !important;
  min-height:clamp(480px, 62vh, 760px) !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
}
@media (max-width: 1100px){
  .hero-grid,
  .about-grid,
  .career-grid,
  .page-hero-grid{
    grid-template-columns:1fr !important;
  }
  .team-hero-card,
  .team-visual,
  .page-hero .visual{
    width:100% !important;
  }
}


/* ===== FINAL LAYOUT OVERRIDE ===== */
:root{
  --max: 1480px;
  --radius: 30px;
  --radius-sm: 22px;
}
html,body{overflow-x:hidden}
.wrap{width:min(var(--max), calc(100% - 48px)) !important; margin:0 auto}
.site-header .wrap{width:min(1500px, calc(100% - 48px)) !important}
.hero .wrap, .page-hero .wrap{width:min(1500px, calc(100% - 48px)) !important}

.site-header{
  background:rgba(8,12,18,.82);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.site-header.scrolled{
  background:rgba(8,12,18,.94);
}
.brand::before{display:none}
.brand img{
  height:62px !important;
  width:auto;
  opacity:1 !important;
  filter:none !important;
}
.nav{gap:24px}
.nav > a, .drop-toggle{font-size:17px}
.btn{
  border-radius:18px;
}
.header-hotline{
  gap:16px;
  padding-bottom:14px;
}
.header-hotline a{
  box-shadow:none;
}
.header-trust{gap:10px}
.header-trust span{
  font-size:12px;
  padding:7px 12px;
  white-space:nowrap;
}

.hero{
  min-height:100svh;
}
.hero-inner{
  padding:72px 0 96px;
}
.hero-grid{
  grid-template-columns:.76fr 1.24fr !important;
  gap:56px !important;
  align-items:center !important;
  min-height:calc(100svh - 118px);
}
.hero-copy{
  max-width:760px !important;
}
.hero-card,
.team-hero-card{
  width:100% !important;
  max-width:none !important;
  justify-self:stretch !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  align-self:center !important;
}
.hero-card::after,
.team-hero-card::after{
  display:none !important;
}
.hero-card img,
.team-hero-card img{
  width:100% !important;
  height:clamp(560px, 68vh, 760px) !important;
  min-height:clamp(560px, 68vh, 760px) !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:36px !important;
  background:transparent !important;
  box-shadow:0 26px 60px rgba(0,0,0,.30) !important;
  border:1px solid rgba(255,255,255,.08);
}
.team-badge{display:none !important}

.page-hero{
  padding:110px 0 76px;
}
.page-hero-grid,
.about-grid,
.career-grid{
  grid-template-columns:.74fr 1.26fr !important;
  gap:58px !important;
  align-items:center !important;
}
.page-hero .visual,
.about-hero-visual,
.team-visual{
  width:100% !important;
  max-width:none !important;
  justify-self:stretch !important;
  border-radius:34px !important;
  overflow:hidden !important;
}
.page-hero .visual img,
.about-hero-visual img,
.team-visual img{
  width:100% !important;
  height:clamp(520px, 64vh, 720px) !important;
  min-height:clamp(520px, 64vh, 720px) !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:34px !important;
  background:transparent !important;
}
.about-hero-visual img,
.team-visual img{
  object-position:center 36% !important;
}
.career-grid .about-hero-visual img,
.career-grid .team-visual img{
  object-position:center 34% !important;
}
.home-services .service-grid-home{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:24px !important;
}
.home-services .service-card{
  min-height:420px !important;
}
.home-services .service-card:nth-child(5){
  grid-column:1/-1 !important;
  min-height:380px !important;
}
.service-card .content{
  padding:30px 28px 26px !important;
}
.service-card h3{font-size:36px !important}
.service-card p{
  color:#fff !important;
  max-height:none !important;
}
.service-card::before{
  background:linear-gradient(180deg, rgba(5,10,16,.08) 0%, rgba(5,10,16,.42) 42%, rgba(5,10,16,.86) 100%) !important;
}
.mega-menu{
  min-width:840px !important;
  max-width:980px !important;
}
.mega-grid{
  grid-template-columns:repeat(3,1fr) !important;
}
.mega-card img{
  height:146px !important;
  object-fit:cover !important;
}
.hero-checks{
  max-width:860px !important;
  gap:16px 20px !important;
}
.trust-inline{
  gap:12px !important;
}
.hotline-float{
  right:18px;
  bottom:18px;
}
.footer-logo{
  height:70px !important;
  max-width:none !important;
}
.why-clay-grid{
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:20px;
}
@media (max-width: 1220px){
  .hero-grid,
  .page-hero-grid,
  .about-grid,
  .career-grid{
    grid-template-columns:1fr !important;
    gap:36px !important;
  }
  .hero-copy{max-width:none !important}
  .hero-card img,
  .team-hero-card img,
  .page-hero .visual img,
  .about-hero-visual img,
  .team-visual img{
    height:clamp(420px, 52vh, 620px) !important;
    min-height:clamp(420px, 52vh, 620px) !important;
  }
  .why-clay-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media (max-width: 760px){
  :root{--max:100vw}
  .wrap,.site-header .wrap,.hero .wrap,.page-hero .wrap{width:min(100%, calc(100% - 22px)) !important}
  .site-header .bar{padding:12px 0 !important}
  .brand img{height:50px !important}
  .nav{display:none !important}
  .nav-toggle{display:block !important}
  .mobile-panel.open{display:block !important}
  .header-hotline{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
  }
  .header-hotline a{
    width:100%;
    justify-content:center;
  }
  .header-trust{
    width:100%;
    overflow:auto;
    flex-wrap:nowrap !important;
    padding-bottom:4px;
  }
  .header-trust span{
    flex:0 0 auto;
  }
  .hero{min-height:auto}
  .hero-inner{padding:42px 0 72px !important}
  h1{font-size:clamp(38px,12vw,58px) !important}
  .hero p{font-size:18px !important}
  .hero-card img,
  .team-hero-card img{
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:4/3 !important;
  }
  .page-hero .visual img,
  .about-hero-visual img,
  .team-visual img{
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:16/11 !important;
  }
  .hero-grid,
  .page-hero-grid,
  .about-grid,
  .career-grid,
  .home-services .service-grid-home,
  .service-grid,
  .method-grid,
  .timeline,
  .mini-features,
  .footer-grid,
  .testimonial-grid,
  .why-clay-grid,
  .value-grid,
  .stats-grid,
  .jobs-grid{
    grid-template-columns:1fr !important;
  }
  .home-services .service-card,
  .home-services .service-card:nth-child(5){
    min-height:320px !important;
    grid-column:auto !important;
  }
  .mega-menu{display:none !important}
  .hotline-float{
    right:12px;left:12px;bottom:12px;justify-content:center;
  }
}


/* ===== BLUE GRADIENT THEME ===== */
body{
  background:
    radial-gradient(circle at 18% 8%, rgba(57,129,255,.18), transparent 22%),
    radial-gradient(circle at 84% 12%, rgba(87,72,255,.16), transparent 20%),
    linear-gradient(180deg,#07101a 0%, #0a1423 48%, #0d1828 100%) !important;
}
.hero{
  background:
    radial-gradient(circle at 16% 18%, rgba(30,144,255,.18), transparent 28%),
    radial-gradient(circle at 76% 12%, rgba(95,82,255,.22), transparent 26%),
    radial-gradient(circle at 88% 74%, rgba(18,126,255,.10), transparent 24%),
    linear-gradient(90deg, rgba(7,12,18,.94) 0%, rgba(7,12,18,.84) 38%, rgba(7,12,18,.48) 68%, rgba(7,12,18,.14) 100%),
    linear-gradient(180deg,#07111c 0%, #0b1626 100%) !important;
}
.page-hero,
.about-hero,
.career-hero{
  background:
    radial-gradient(circle at 10% 12%, rgba(33,127,255,.16), transparent 22%),
    radial-gradient(circle at 86% 18%, rgba(97,83,255,.16), transparent 24%),
    linear-gradient(90deg, rgba(8,13,20,.96), rgba(8,13,20,.68)),
    linear-gradient(135deg,#08111d,#0d1b2f) !important;
}
.header-hotline a{
  background:linear-gradient(135deg,rgba(22,152,255,.22),rgba(93,87,255,.18)) !important;
}
.hero-card img,
.team-hero-card img,
.page-hero .visual img,
.about-hero-visual img,
.team-visual img{
  border:1px solid rgba(80,140,255,.18) !important;
  box-shadow:0 30px 70px rgba(6,14,30,.38), 0 0 0 1px rgba(120,160,255,.05) inset !important;
}


/* ===== CLAY LOCAL SEO / IMAGE PLACEMENT UPDATE ===== */
body{
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
}
.service-card img,
.mega-card img{
  object-position:center 30% !important;
}
.service-card--leckortung img,
.mega-card--leckortung img,
.page-leckortung .service-hero-visual img{
  object-position:center 26% !important;
}
.service-card--trocknung img,
.mega-card--trocknung img,
.page-gebaeudetrocknung .service-hero-visual img{
  object-position:center 18% !important;
}
.service-card--demontage img,
.mega-card--demontage img,
.page-demontage-rueckbau .service-hero-visual img{
  object-position:center 22% !important;
}
.service-card--schimmel img,
.mega-card--schimmel img,
.page-schimmelsanierung .service-hero-visual img{
  object-position:center 30% !important;
}
.service-card--brand img,
.mega-card--brand img,
.page-brandschadensanierung .service-hero-visual img{
  object-position:center 28% !important;
}
.page-leistungen .service-hero-visual img,
.page-index .team-hero-card img,
.page-karriere .team-visual img,
.page-ueber-uns .team-showcase-visual img{
  object-position:center 34% !important;
}
.page-kontakt .service-hero-visual img,
.page-ueber-uns .about-customer-visual img{
  object-position:center 42% !important;
}
.home-services .service-grid-home .service-card{
  min-height:430px !important;
}
.home-services .service-grid-home .service-card:nth-child(5){
  min-height:390px !important;
}
.consulting-grid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:26px;
  align-items:center;
  margin-top:28px;
}
.consulting-visual,
.service-inline-visual{
  position:relative;
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 24px 58px rgba(8,16,28,.18);
  border:1px solid rgba(255,255,255,.06);
  background:#0f1724;
}
.consulting-visual img,
.service-inline-visual img{
  width:100%;
  display:block;
  height:100%;
  object-fit:cover;
}
.consulting-visual img{
  min-height:520px;
}
.consulting-copy p{
  margin:0 0 16px;
  color:#546476;
  line-height:1.74;
}
.local-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:22px 0 0;
}
.local-pills span{
  display:inline-flex;
  align-items:center;
  padding:9px 14px;
  border-radius:999px;
  background:#f2f7ff;
  border:1px solid #d9e7f8;
  color:#0f1824;
  font-weight:700;
  font-size:14px;
}
.service-inline-visual{
  margin-top:26px;
}
.service-inline-visual img{
  max-height:460px;
  object-position:center 34%;
}
.service-inline-visual .caption{
  padding:14px 18px 18px;
  color:#dbe6f3;
  background:linear-gradient(180deg, rgba(10,18,28,.2), rgba(10,18,28,.88));
  font-size:15px;
  line-height:1.6;
}
.legal-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}
.legal-grid--stack{
  grid-template-columns:1fr;
}
.contact-detail-list{
  margin:0;
  padding-left:18px;
  color:#506072;
}
.contact-detail-list li{
  margin:10px 0;
}
.contact-detail-list a{
  color:#136cd0;
  font-weight:700;
}
.location-box{
  background:linear-gradient(180deg,#f8fbff,#ffffff);
}
.team-showcase-grid{
  margin-top:0;
}
.team-showcase-visual img{
  object-position:center 34%;
}
.quick-card a{
  color:inherit;
}
@media (max-width: 1024px){
  .consulting-grid,
  .legal-grid{
    grid-template-columns:1fr;
  }
  .consulting-visual img{
    min-height:380px;
  }
}
@media (max-width: 760px){
  .consulting-grid{
    gap:18px;
  }
  .consulting-visual img{
    min-height:280px;
  }
  .local-pills{
    gap:8px;
  }
  .local-pills span{
    font-size:13px;
    padding:8px 12px;
  }
  .service-inline-visual img{
    max-height:none;
    min-height:260px;
  }
}


/* v9 fixes */
.section.surface .value-card h3,
.section.surface .testimonial-card h3,
.section.surface .time-card h4,
.section.surface .cta-band h3,
.section.surface .contact-box h3{color:#f7fbff}
.section.surface .value-card p,
.section.surface .testimonial-card p,
.section.surface .time-card p{color:#d7e0ec}
.why-clay-surface .section-sub{color:#4b5f73 !important}
.consulting-copy{padding:8px 0}
.consulting-copy .section-title{margin-bottom:18px}
.consulting-copy p{color:#6c7d90;max-width:62ch}
.consulting-copy .hero-actions{margin-top:26px;margin-bottom:0;padding-top:4px;gap:16px 14px}
.consulting-copy .local-pills{margin:26px 0 0}
.location-box h3,.location-box p{color:#152131 !important}
.location-box h3{font-size:clamp(32px,4vw,54px);line-height:1.03;margin:0 0 14px;letter-spacing:-.03em}
.service-inline-visual img{object-position:center 24%}
.page-leckortung .service-inline-visual img{object-position:center 18% !important;max-height:520px}
.page-leckortung .service-inline-visual .caption{font-size:16px}
.page-leckortung .time-card h4{color:#f7fbff}
.page-ueber-uns .value-card h3,.page-ueber-uns .testimonial-card h3{color:#fff !important}
.page-index .btn.dark,.page-kontakt .btn.dark{border-color:rgba(255,255,255,.18);background:#101a28}
.page-index .consulting-copy .btn.dark,.page-kontakt .hero-actions .btn.dark{min-width:170px}
.page-kontakt .hero-actions .btn.dark{scroll-margin-top:120px}
.contact-form-card{margin-top:26px;background:#fff;border:1px solid rgba(16,23,34,.08);border-radius:28px;padding:28px;box-shadow:0 14px 34px rgba(16,23,34,.08)}
.contact-form-card h3{margin:0 0 10px;color:#101722;font-size:34px}
.contact-form-card p{margin:0 0 18px;color:#556476}
.contact-form{display:grid;gap:16px}
.contact-form .grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.contact-form .grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.contact-form label{display:grid;gap:8px;font-weight:700;color:#172334}
.contact-form small{display:block;color:#617184;font-weight:500}
.contact-form .consent{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:18px;background:#f7fbff;border:1px solid #dbe6f4;color:#47576a}
.contact-form .consent input{margin-top:4px}
.contact-form .helper{font-size:14px;color:#607285;margin-top:-4px}
.hp-field{position:absolute !important;left:-10000px !important;opacity:0 !important;height:0 !important;width:0 !important;overflow:hidden !important}

.upload-group{display:grid;gap:10px;padding:16px;border:1px solid #dbe6f4;border-radius:18px;background:#f7fbff}
.upload-group>strong{color:#172334;font-size:16px}
.captcha-wrap{display:grid;gap:10px;padding:16px;border:1px solid #dbe6f4;border-radius:18px;background:#f7fbff;color:#172334}
.captcha-wrap>strong{font-size:16px}
.captcha-wrap iframe{max-width:100%}
@media (max-width:760px){.upload-group{padding:14px}.captcha-wrap{padding:14px}}
@media (max-width:760px){.contact-form .grid-2,.contact-form .grid-3{grid-template-columns:1fr}.contact-form-card h3{font-size:28px}}


/* v3 requested fixes */
.page-leckortung .service-hero-visual img{
  object-position:center 46% !important;
}
.page-leckortung .service-inline-visual--secondary{
  background:#f3f7fb !important;
}
.page-leckortung .service-inline-visual--secondary img{
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#f3f7fb !important;
}
.service-card--leckortung img,
.mega-card--leckortung img{
  object-position:center 42% !important;
}
.service-card--trocknung img,
.mega-card--trocknung img{
  object-position:center 34% !important;
}
.page-gebaeudetrocknung .service-hero-visual img{
  object-position:center center !important;
}


/* v4 fixes: contact readability, mailto CTA, bautrocknung hero fit */
.page-kontakt .contact-box h3,
.page-kontakt .contact-box strong,
.page-kontakt .contact-box strong a{
  color:#101722 !important;
}
.page-kontakt .contact-box p,
.page-kontakt .contact-box ul,
.page-kontakt .contact-box li,
.page-kontakt .quick-card p,
.page-kontakt .quick-card p a{
  color:#506072 !important;
}
.page-kontakt .quick-card strong a{
  color:#0d1520 !important;
  text-decoration:none;
}
.page-kontakt .hero-actions .btn.dark{
  scroll-margin-top:0;
}
.page-gebaeudetrocknung .service-hero-visual{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#0b1421 !important;
}
.page-gebaeudetrocknung .service-hero-visual img{
  width:100% !important;
  height:clamp(420px,56vh,680px) !important;
  min-height:clamp(420px,56vh,680px) !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#0b1421 !important;
}
@media (max-width:760px){
  .page-gebaeudetrocknung .service-hero-visual img{
    height:320px !important;
    min-height:320px !important;
  }
}

/* v5 mobile refinement: desktop untouched, mobile improved */
@media (max-width: 760px){
  html{
    scroll-padding-top:88px;
  }
  body{
    padding-bottom:calc(108px + env(safe-area-inset-bottom, 0px));
  }

  h1,
  .section-title,
  .location-box h3{
    overflow-wrap:anywhere;
    word-break:normal;
    hyphens:auto;
  }

  h1{
    font-size:clamp(30px, 10.2vw, 44px) !important;
    line-height:1.05 !important;
    letter-spacing:-.04em !important;
    margin-bottom:16px !important;
  }

  .section-title,
  .location-box h3{
    font-size:clamp(28px, 8.8vw, 40px) !important;
    line-height:1.08 !important;
    margin-bottom:14px !important;
  }

  .section{
    padding:58px 0 !important;
  }

  .site-header .wrap,
  .hero .wrap,
  .page-hero .wrap,
  .wrap{
    width:min(100%, calc(100% - 20px)) !important;
  }

  .site-header .bar{
    gap:14px !important;
    padding:10px 0 !important;
  }

  .brand img{
    height:42px !important;
  }

  .nav-toggle{
    font-size:34px !important;
    padding:4px 0 4px 10px;
  }

  .mobile-panel{
    padding-bottom:8px;
  }

  .mobile-panel a{
    padding:14px 0 !important;
    font-size:17px;
  }

  .header-hotline{
    gap:8px !important;
    padding:0 0 10px !important;
  }

  .header-hotline .pulse,
  .hero-hotline .pulse,
  .hotline-float .pulse,
  .cta-band.hotline-emphasis h3 .pulse{
    flex:0 0 auto !important;
    width:14px !important;
    height:14px !important;
    min-width:14px !important;
    min-height:14px !important;
    border-radius:50% !important;
  }

  .header-hotline strong{
    width:100% !important;
    font-size:14px !important;
    line-height:1.35 !important;
  }

  .header-hotline a{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    min-height:54px !important;
    padding:0 18px !important;
    border-radius:18px !important;
    font-size:clamp(18px, 7vw, 24px) !important;
    line-height:1 !important;
  }

  .header-hotline .hotline-note{
    font-size:13px !important;
    line-height:1.35 !important;
  }

  .site-header.scrolled .brand img{
    height:38px !important;
  }

  .site-header.scrolled .header-hotline{
    padding-bottom:8px !important;
  }

  .site-header.scrolled .header-hotline strong,
  .site-header.scrolled .header-hotline .hotline-note{
    display:none !important;
  }

  .site-header.scrolled .header-hotline a{
    min-height:46px !important;
    font-size:18px !important;
    padding:0 16px !important;
  }

  .hero,
  .page-hero{
    min-height:auto !important;
  }

  .hero-inner{
    padding:34px 0 56px !important;
  }

  .page-hero{
    padding:40px 0 44px !important;
  }

  .hero-grid,
  .page-hero-grid,
  .about-grid,
  .career-grid{
    gap:20px !important;
  }

  .eyebrow{
    font-size:12px !important;
    gap:8px !important;
    margin-bottom:14px !important;
  }

  .hero p,
  .page-hero p,
  .consulting-copy p,
  .section-sub{
    font-size:16px !important;
    line-height:1.68 !important;
  }

  .page-index .hero-hotline,
  .page-leistungen .hero-hotline,
  .page-leckortung .hero-hotline,
  .page-gebaeudetrocknung .hero-hotline,
  .page-schimmelsanierung .hero-hotline,
  .page-brandschadensanierung .hero-hotline,
  .page-demontage-rueckbau .hero-hotline,
  .page-ueber-uns .hero-hotline,
  .page-karriere .hero-hotline,
  .page-kontakt .hero-hotline{
    display:none !important;
  }

  .hero-actions,
  .consulting-copy .hero-actions,
  .page-kontakt .hero-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    width:100% !important;
    margin-bottom:24px !important;
  }

  .hero-actions .btn,
  .hero-actions .btn.dark,
  .hero-actions .hero-ghost{
    width:100% !important;
    min-height:56px !important;
    justify-content:center !important;
    font-size:18px !important;
  }

  .hero-checks{
    gap:12px !important;
  }

  .hero-check{
    gap:10px !important;
    font-size:15px !important;
    line-height:1.5 !important;
  }

  .hero-check i{
    font-size:18px !important;
    line-height:1 !important;
    margin-top:2px;
  }

  .hero .trust-inline,
  .trust-inline,
  .local-pills{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
    width:100% !important;
  }

  .trust-chip,
  .local-pills span{
    width:100% !important;
    justify-content:center !important;
    min-height:44px !important;
    padding:10px 12px !important;
    font-size:13px !important;
    text-align:center !important;
  }

  .hero-card img,
  .team-hero-card img,
  .page-hero .visual img,
  .about-hero-visual img,
  .team-visual img{
    aspect-ratio:4 / 3 !important;
    border-radius:24px !important;
  }

  .home-services .service-card,
  .home-services .service-card:nth-child(5),
  .service-card{
    min-height:292px !important;
    border-radius:24px !important;
  }

  .service-card .content{
    padding:20px 18px 18px !important;
  }

  .service-card h3{
    font-size:28px !important;
  }

  .service-card p{
    font-size:15px !important;
    line-height:1.55 !important;
  }

  .consulting-grid{
    gap:16px !important;
  }

  .consulting-visual,
  .service-inline-visual,
  .cta-band,
  .contact-box,
  .contact-form-card,
  .why-clay-card,
  .value-card,
  .testimonial-card,
  .time-card,
  .method{
    border-radius:24px !important;
  }

  .consulting-visual img{
    min-height:250px !important;
  }

  .cta-band{
    padding:24px 20px !important;
    gap:16px !important;
  }

  .cta-band h3,
  .cta-band.hotline-emphasis h3{
    font-size:clamp(22px, 8.6vw, 34px) !important;
    line-height:1.08 !important;
    align-items:flex-start !important;
    gap:12px !important;
  }

  .cta-band.hotline-emphasis h3 .pulse{
    margin-top:.26em !important;
  }

  .cta-band.hotline-emphasis .phone{
    font-size:clamp(30px, 10vw, 42px) !important;
    line-height:1 !important;
  }

  .cta-band .btn{
    width:100% !important;
  }

  .footer{
    padding-bottom:40px !important;
  }

  .hotline-float{
    left:10px !important;
    right:10px !important;
    bottom:calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius:22px !important;
    padding:12px 14px 12px 16px !important;
    justify-content:space-between !important;
    gap:12px !important;
    min-height:72px !important;
    transform:none !important;
  }

  .hotline-float:hover{
    transform:none !important;
  }

  .hotline-float strong{
    font-size:16px !important;
  }

  .hotline-float span{
    font-size:13px !important;
    margin-top:3px !important;
  }

  .hotline-float::after{
    content:"Jetzt anrufen";
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    min-width:108px;
    min-height:44px;
    padding:0 14px;
    border-radius:14px;
    background:linear-gradient(135deg,#ff4a4a,#d81818);
    color:#fff;
    font-size:14px;
    font-weight:800;
    box-shadow:0 10px 22px rgba(215,23,23,.20);
  }
}

@media (max-width: 420px){
  h1{
    font-size:clamp(28px, 10.8vw, 40px) !important;
  }

  .section-title,
  .location-box h3{
    font-size:clamp(26px, 9vw, 34px) !important;
  }

  .hero .trust-inline,
  .trust-inline,
  .local-pills{
    grid-template-columns:1fr !important;
  }

  .hotline-float{
    min-height:68px !important;
    padding:11px 12px 11px 14px !important;
  }

  .hotline-float::after{
    min-width:96px;
    font-size:13px;
    padding:0 12px;
  }
}


/* v6 image framing + legal readability */
.page-impressum .contact-box,
.page-datenschutz .contact-box{
  background:#ffffff !important;
  border:1px solid rgba(16,23,34,.08) !important;
  box-shadow:0 12px 30px rgba(16,23,34,.06) !important;
}
.page-impressum .contact-box h3,
.page-datenschutz .contact-box h3,
.page-impressum .section.surface .contact-box h3,
.page-datenschutz .section.surface .contact-box h3{
  color:#101722 !important;
  text-shadow:none !important;
  line-height:1.1 !important;
}
.page-impressum .contact-box strong,
.page-datenschutz .contact-box strong{
  color:#101722 !important;
}
.page-impressum .contact-box p,
.page-datenschutz .contact-box p,
.page-impressum .contact-box li,
.page-datenschutz .contact-box li,
.page-impressum .contact-box a,
.page-datenschutz .contact-box a{
  color:#5a697b !important;
  text-shadow:none !important;
}
.page-impressum .contact-box a,
.page-datenschutz .contact-box a{
  font-weight:700;
}

.page-gebaeudetrocknung .service-hero-visual,
.page-leckortung .service-hero-visual{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#0b1421 !important;
}
.page-gebaeudetrocknung .service-hero-visual img,
.page-leckortung .service-hero-visual img{
  width:100% !important;
  height:clamp(420px,56vh,680px) !important;
  min-height:clamp(420px,56vh,680px) !important;
  object-fit:contain !important;
  object-position:center center !important;
  padding:12px !important;
  background:#0b1421 !important;
}
.service-card--leckortung,
.service-card--trocknung,
.mega-card--leckortung,
.mega-card--trocknung{
  background:#0c1420 !important;
}
.service-card--leckortung img,
.service-card--trocknung img,
.mega-card--leckortung img,
.mega-card--trocknung img{
  object-fit:contain !important;
  object-position:center center !important;
  padding:12px 12px 0 !important;
  background:#0c1420 !important;
}
.service-card--leckortung:hover img,
.service-card--trocknung:hover img,
.mega-card--leckortung:hover img,
.mega-card--trocknung:hover img{
  transform:none !important;
}
@media (max-width:760px){
  .page-gebaeudetrocknung .service-hero-visual img,
  .page-leckortung .service-hero-visual img{
    height:320px !important;
    min-height:320px !important;
    padding:10px !important;
  }
  .page-index .service-card--leckortung,
  .page-index .service-card--trocknung,
  .page-leistungen .service-card--leckortung,
  .page-leistungen .service-card--trocknung{
    min-height:276px !important;
  }
  .page-index .service-card--leckortung img,
  .page-index .service-card--trocknung img,
  .page-leistungen .service-card--leckortung img,
  .page-leistungen .service-card--trocknung img{
    padding:10px 10px 0 !important;
  }
  .page-impressum .contact-box h3,
  .page-datenschutz .contact-box h3{
    font-size:clamp(24px,8vw,34px) !important;
    line-height:1.12 !important;
  }
}

/* v7 image fit cleanup + legal headings contrast */
.page-impressum .contact-box h3,
.page-datenschutz .contact-box h3,
.page-impressum .contact-box h4,
.page-datenschutz .contact-box h4{
  color:#101722 !important;
  -webkit-text-fill-color:#101722 !important;
  opacity:1 !important;
  text-shadow:none !important;
}
.page-impressum .contact-box,
.page-datenschutz .contact-box{
  background:#ffffff !important;
}
.page-impressum .contact-box *,
.page-datenschutz .contact-box *{
  mix-blend-mode:normal !important;
}

.page-gebaeudetrocknung .service-hero-visual,
.page-leckortung .service-hero-visual{
  display:block !important;
  background:transparent !important;
}
.page-gebaeudetrocknung .service-hero-visual img,
.page-leckortung .service-hero-visual img{
  width:100% !important;
  height:clamp(420px,56vh,680px) !important;
  min-height:clamp(420px,56vh,680px) !important;
  object-fit:cover !important;
  padding:0 !important;
  background:transparent !important;
}
.page-leckortung .service-hero-visual img{object-position:68% center !important;}
.page-gebaeudetrocknung .service-hero-visual img{object-position:center 18% !important;}
.page-schimmelsanierung .service-hero-visual img{object-position:58% center !important;}
.page-brandschadensanierung .service-hero-visual img{object-position:60% center !important;}
.page-demontage-rueckbau .service-hero-visual img{object-position:54% 22% !important;}

.service-card,
.mega-card{
  background:#101822 !important;
}
.service-card img,
.mega-card img{
  object-fit:cover !important;
  padding:0 !important;
  background:transparent !important;
}
.service-card--leckortung img,
.mega-card--leckortung img{object-position:68% center !important;}
.service-card--trocknung img,
.mega-card--trocknung img{object-position:center 22% !important;}
.service-card--schimmel img,
.mega-card--schimmel img{object-position:58% center !important;}
.service-card--brand img,
.mega-card--brand img{object-position:60% center !important;}
.service-card--demontage img,
.mega-card--demontage img{object-position:54% 22% !important;}

.page-index .service-card,
.page-leistungen .service-card{
  min-height:340px !important;
}
.page-index .service-card:nth-child(5),
.page-leistungen .service-card:nth-child(5){
  min-height:320px !important;
}

@media (max-width:760px){
  .page-gebaeudetrocknung .service-hero-visual img,
  .page-leckortung .service-hero-visual img{
    height:340px !important;
    min-height:340px !important;
  }
   .page-index .service-card,
  .page-leistungen .service-card{
    min-height:300px !important;
  }
  .page-index .service-card:nth-child(5),
  .page-leistungen .service-card:nth-child(5){
    min-height:300px !important;
  }
  .page-index .service-card--leckortung img,
  .page-leistungen .service-card--leckortung img{object-position:72% center !important;}
  .page-index .service-card--trocknung img,
  .page-leistungen .service-card--trocknung img{object-position:center 18% !important;}
  .page-index .service-card--schimmel img,
  .page-leistungen .service-card--schimmel img{object-position:62% center !important;}
  .page-index .service-card--brand img,
  .page-leistungen .service-card--brand img{object-position:62% center !important;}
  .page-index .service-card--demontage img,
  .page-leistungen .service-card--demontage img{object-position:56% 18% !important;}
}

/* v7b stronger legal heading contrast */
.page-impressum .contact-box h3,
.page-datenschutz .contact-box h3{
  font-weight:800 !important;
  color:#101722 !important;
  -webkit-text-fill-color:#101722 !important;
  opacity:1 !important;
}


/* v9 final bautrocknung hero image fix */
.page-gebaeudetrocknung .service-hero-visual picture{display:block;width:100%;height:100%;}
.page-gebaeudetrocknung .service-hero-visual img{object-position:center center !important;}
@media (max-width:760px){
  .page-gebaeudetrocknung .service-hero-visual img{object-position:center 32% !important;}
}

.form-status{
  min-height: 0;
  padding: 0;
  border-radius: 16px;
  font-weight: 800;
  line-height: 1.45;
}
.form-status:not(:empty){
  padding: 14px 16px;
  border: 1px solid rgba(24, 86, 158, .18);
  background: #f6fbff;
  color: #172334;
}
.form-status.error{
  border-color: rgba(239, 43, 48, .32);
  background: #fff5f5;
  color: #9b1c1f;
}
.form-status.ok{
  border-color: rgba(46, 125, 50, .28);
  background: #f1fbf3;
  color: #1f6b2b;
}
.contact-form button[disabled]{
  opacity: .72;
  cursor: wait;
}

/* Formular-Sicherheitsfrage */
.security-question label{display:grid;gap:8px;max-width:260px;font-weight:800;color:#172334}
.security-question input{max-width:180px}