/* ===================================================================
   MELEK MILLER CARE — Design System
   Healthcare staffing, Germany. Signature motif: the faceted cut-corner,
   drawn directly from the sliced letterforms in the wordmark.
   =================================================================== */

/* ---------- Design tokens ---------- */
:root{
  /* Brand (sourced from the logo mark) */
  --brand: #B2101D;
  --brand-dark: #8A0E18;
  --brand-darker: #6C0B13;
  --brand-soft: #FBEAEA;
  --brand-soft-2: #F5DADB;

  /* Clinical blue + healing green — supporting medical-tech palette */
  --blue: #4D7EA8;
  --blue-text: #2F5C7D;
  --blue-soft: #E8F1F6;
  --green: #4F9D7C;
  --green-text: #2A7357;
  --green-soft: #E9F5EF;

  /* Neutrals */
  --bg: #FFFFFF;
  --bg-soft: #F5F8F9;
  --bg-soft-2: #EFF3F4;
  --bg-deep: #0F1B24;
  --bg-deep-2: #16242F;
  --ink: #12202B;
  --ink-soft: #56646C;
  --ink-faint: #8B979D;
  --border: #E1E7EA;
  --border-strong: #CCD5D9;
  --white: #FFFFFF;

  /* Type */
  --font-display: "Manrope", "Segoe UI", Arial, sans-serif;
  --font-body: "Inter", "Segoe UI", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "Courier New", monospace;

  /* Spacing scale */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.5rem;
  --sp-8: 3rem;
  --sp-9: 4rem;
  --sp-10: 5rem;
  --sp-11: 7rem;
  --sp-12: 9rem;

  /* Layout */
  --maxw: 1232px;
  --maxw-narrow: 760px;
  --cut: 22px;        /* signature corner-cut size, desktop */
  --cut-sm: 14px;      /* signature corner-cut size, small components */
  --radius-soft: 2px;  /* near-zero radius keeps the precision feel */

  /* Motion */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur-fast: .18s;
  --dur: .4s;

  /* Shadow */
  --shadow-sm: 0 1px 2px rgba(15,27,36,.06), 0 1px 1px rgba(15,27,36,.04);
  --shadow-md: 0 8px 24px -8px rgba(15,27,36,.16);
  --shadow-lg: 0 24px 48px -16px rgba(15,27,36,.22);
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing: border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth; }
html,body{ height:100%; }
body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--bg);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img,svg,video{ display:block; max-width:100%; height:auto; }
a{ color: inherit; text-decoration: none; }
button{ font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input,textarea,select{ font: inherit; color: inherit; }
ul,ol{ list-style: none; padding:0; }
table{ border-collapse: collapse; width:100%; }

h1,h2,h3,h4{
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -0.01em;
  color: var(--ink);
}
h1{ font-size: clamp(2.4rem, 1.85rem + 2.4vw, 3.8rem); letter-spacing: -0.02em; }
h2{ font-size: clamp(1.9rem, 1.55rem + 1.5vw, 2.65rem); }
h3{ font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem); }
h4{ font-size: 1.05rem; font-weight: 700; }
p{ color: var(--ink-soft); }
strong{ color: var(--ink); font-weight: 700; }

/* visually-hidden but available to assistive tech */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:var(--sp-4); top:-60px;
  background:var(--brand); color:#fff; padding:.8em 1.3em;
  font-weight:700; font-size:.9rem; z-index:1000;
  transition: top var(--dur-fast) var(--ease);
}
.skip-link:focus{ top: var(--sp-4); }

:focus-visible{ outline: 2.5px solid var(--blue); outline-offset: 3px; }

/* ---------- Layout helpers ---------- */
.container{
  width: 100%;
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 1rem + 2vw, 2.5rem);
}
.container--narrow{ max-width: var(--maxw-narrow); }

.section{ padding-block: clamp(3.5rem, 3rem + 3vw, 7rem); }
.section--tight{ padding-block: clamp(2.5rem, 2rem + 2vw, 4.5rem); }
.section--soft{ background: var(--bg-soft); }
.section--deep{ background: var(--bg-deep); color: #fff; }
.section--deep p{ color: #AEBBC4; }
.section--deep h2, .section--deep h3{ color:#fff; }
.section--brand{ background: var(--brand); color:#fff; }

.grid{ display:grid; gap: var(--sp-6); }
.grid-2{ grid-template-columns: repeat(2,1fr); }
.grid-3{ grid-template-columns: repeat(3,1fr); }
.grid-4{ grid-template-columns: repeat(4,1fr); }
@media (max-width: 880px){
  .grid-2,.grid-3,.grid-4{ grid-template-columns: 1fr; }
}
@media (min-width: 881px) and (max-width: 1080px){
  .grid-4{ grid-template-columns: repeat(2,1fr); }
}

.stack{ display:flex; flex-direction:column; }
.cluster{ display:flex; align-items:center; gap: var(--sp-3); flex-wrap:wrap; }

/* ---------- Eyebrow / labels ---------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-family: var(--font-mono);
  font-size: .76rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--brand);
  font-weight: 600;
  margin-bottom: var(--sp-4);
}
.eyebrow::before{
  content:"";
  width: 22px; height: 2px;
  background: var(--brand);
  display:inline-block;
}
.eyebrow.is-blue{ color: var(--blue-text); }
.eyebrow.is-blue::before{ background: var(--blue); }
.eyebrow.is-green{ color: var(--green-text); }
.eyebrow.is-green::before{ background: var(--green); }
.eyebrow.is-onDark{ color: #EBC4C8; }
.eyebrow.is-onDark::before{ background:#EBC4C8; }

.section-head{ max-width: 640px; margin-bottom: var(--sp-9); }
.section-head.is-center{ margin-inline:auto; text-align:center; }
.section-head p{ margin-top: var(--sp-4); font-size:1.08rem; }

/* ---------- Buttons ---------- */
.btn{
  --cutc: var(--cut-sm);
  position: relative;
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: .96rem;
  letter-spacing: .01em;
  padding: .95em 1.7em;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cutc)), calc(100% - var(--cutc)) 100%, 0 100%);
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
  white-space: nowrap;
}
.btn svg{ width:1.05em; height:1.05em; flex-shrink:0; }
.btn:active{ transform: translateY(1px); }

.btn--primary{ background: var(--brand); color:#fff; }
.btn--primary:hover{ background: var(--brand-dark); }

.btn--ghost-on-brand{ background: rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.4); clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cutc)), calc(100% - var(--cutc)) 100%, 0 100%); }
.btn--ghost-on-brand:hover{ background: rgba(255,255,255,.18); }

.btn--secondary{ background: var(--ink); color:#fff; }
.btn--secondary:hover{ background:#0a141c; }

.btn--outline{ background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--border-strong); }
.btn--outline:hover{ box-shadow: inset 0 0 0 1.5px var(--ink); }

.btn--white{ background: #fff; color: var(--brand); }
.btn--white:hover{ background: #F4DEE0; }

.btn--lg{ padding: 1.05em 2.1em; font-size: 1.02rem; --cutc: 18px; }
.btn--sm{ padding: .68em 1.25em; font-size: .86rem; --cutc: 10px; }
.btn--block{ width:100%; }

.text-link{
  display:inline-flex; align-items:center; gap:.4em;
  font-weight: 700; color: var(--brand);
  border-bottom: 1.5px solid transparent;
  transition: border-color var(--dur-fast) var(--ease), gap var(--dur-fast) var(--ease);
}
.text-link:hover{ border-color: currentColor; gap:.6em; }
.text-link svg{ width:1em; height:1em; }

/* ---------- Faceted panel (signature shape) ---------- */
.facet{
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%);
}
.facet-tl{
  clip-path: polygon(var(--cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut));
}
.facet-frame{ position:relative; }
.facet-frame::after{
  content:""; position:absolute; inset:0;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%);
  box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.18);
  pointer-events:none;
}

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 100;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.site-header.is-scrolled{ border-color: var(--border); box-shadow: 0 1px 0 rgba(15,27,36,.02); }

.nav{
  display:flex; align-items:center; justify-content:space-between;
  gap: var(--sp-6);
  padding-block: .9rem;
}
.nav__logo{ display:flex; align-items:center; flex-shrink:0; position:relative; z-index:20; }
.nav__logo img{ height: 46px; width:auto; }

.logotype{ display:inline-flex; align-items:center; gap:.65em; font-family: var(--font-display); line-height:1; }
.logotype__name{ font-weight:800; font-size:1.34rem; color: var(--brand); letter-spacing:-0.01em; }
.logotype__divider{ width:1.5px; height:19px; background: var(--border-strong); flex-shrink:0; }
.logotype__tag{ font-family: var(--font-mono); font-weight:600; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color: var(--ink-faint); }
.footer-brand .logotype__name{ color: var(--brand); }
.footer-brand .logotype__divider{ background: rgba(255,255,255,.22); }
.footer-brand .logotype__tag{ color:#8C9BA5; }

.nav__links{ display:flex; align-items:center; gap: var(--sp-7); }
.nav__links > a.btn{ display:none; }
.nav__links a.btn{ color:#fff; }
.nav__links a{
  font-family: var(--font-display);
  font-weight: 600; font-size: .95rem;
  color: var(--ink-soft);
  padding-block: .3rem;
  border-bottom: 2px solid transparent;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.nav__links a:hover{ color: var(--ink); }
.nav__links a[aria-current="page"]{ color: var(--brand); border-color: var(--brand); }

.nav__cta{ display:flex; align-items:center; gap: var(--sp-4); position:relative; z-index:20; }
.nav__phone{ display:flex; align-items:center; gap:.5em; font-weight:600; font-size:.92rem; color:var(--ink-soft); }
.nav__phone svg{ width:1rem; height:1rem; color: var(--green-text); }

.nav__toggle{
  display:none; flex-direction:column; gap:5px; padding:.5rem;
}
.nav__toggle span{ width:22px; height:2px; background:var(--ink); transition: transform var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease); }
.nav__toggle[aria-expanded="true"] span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__toggle[aria-expanded="true"] span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 940px){
  .nav__phone{ display:none; }
  .nav__cta > a.btn{ display:none; }
  .nav__toggle{ display:flex; }
  .nav__links{
    position:fixed; top:0; left:0; right:0; height:100vh; height:100dvh;
    background: #fff; flex-direction:column; align-items:flex-start;
    padding: 84px var(--sp-5) var(--sp-7); gap: var(--sp-2);
    transform: translateX(100%); transition: transform var(--dur) var(--ease);
    overflow-y:auto; z-index: 10;
  }
  .nav__links.is-open{ transform: translateX(0); }
  .nav__links a{ width:100%; padding: .9rem 0; font-size:1.15rem; border-bottom:1px solid var(--border); }
  .nav__links > a.btn{ margin-top: var(--sp-4); display:inline-flex; width:auto; border-bottom:none; }
}

/* ---------- Hero ---------- */
.hero{ position:relative; overflow:hidden; padding-block: clamp(2.5rem, 2rem + 3vw, 5rem) clamp(3rem,2.5rem + 3vw, 6rem); }
.hero__grid{
  display:grid; grid-template-columns: 1.05fr .95fr; gap: var(--sp-11);
  align-items:center;
}
@media (max-width: 980px){ .hero__grid{ grid-template-columns:1fr; gap: var(--sp-9); } }

.hero__eyebrow{ margin-bottom: var(--sp-5); }
.hero h1{ margin-bottom: var(--sp-5); }
.hero__lede{ font-size: 1.18rem; max-width: 560px; margin-bottom: var(--sp-7); }
.hero__cta{ display:flex; gap: var(--sp-4); flex-wrap:wrap; margin-bottom: var(--sp-8); }

.hero__trust{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--sp-6) var(--sp-7); padding-top: var(--sp-6); border-top:1px solid var(--border); max-width: 480px; }
.hero__trust-item{ display:flex; flex-direction:column; }
.hero__trust-item b{ font-family:var(--font-display); font-size:1.7rem; font-weight:800; color:var(--ink); line-height:1; }
.hero__trust-item span{ font-size:.82rem; color: var(--ink-faint); margin-top:.4em; max-width:140px; }

.hero__art{ position:relative; }
.hero__art-frame{
  position:relative; aspect-ratio: 4/4.6; background: var(--bg-deep);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 56px), calc(100% - 56px) 100%, 0 100%);
  overflow:hidden;
}
.hero__art-frame img{ width:100%; height:100%; object-fit:cover; opacity:.92; }
.hero__art-frame svg{ width:100%; height:100%; display:block; }
.hero__art-frame::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(195deg, rgba(178,16,29,.32), rgba(15,27,36,.55) 60%);
  mix-blend-mode: multiply;
}
.hero__art-card{
  position:absolute; left: -28px; bottom: 40px;
  background:#fff; padding: var(--sp-5) var(--sp-6); width: 240px;
  box-shadow: var(--shadow-lg);
  clip-path: polygon(16px 0, 100% 0, 100% 100%, 0 100%, 0 16px);
}
.hero__art-card .eyebrow{ margin-bottom:.5rem; }
.hero__art-card strong{ font-family:var(--font-display); font-size:1.05rem; display:block; margin-bottom:.2rem; }
.hero__art-card p{ font-size:.85rem; margin:0; }
.hero__art-badge{
  position:absolute; top: 24px; right: -18px;
  background: var(--green); color:#fff;
  padding: .7em 1.1em; font-family:var(--font-display); font-weight:700; font-size:.82rem;
  display:flex; align-items:center; gap:.5em;
  clip-path: polygon(0 0,100% 0,100% 100%, 10px 100%, 0 calc(100% - 10px));
  box-shadow: var(--shadow-md);
}
.hero__art-badge svg{ width:1rem; height:1rem; }

@media (max-width: 980px){
  .hero__art-card{ left:0; }
  .hero__art-badge{ right:0; }
}

/* ---------- Logo strip ---------- */
.logo-strip{ padding-block: var(--sp-7); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.logo-strip__row{ display:flex; align-items:center; justify-content:space-between; gap: var(--sp-6); flex-wrap:wrap; }
.logo-strip__label{ font-family: var(--font-mono); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color: var(--ink-faint); }
@media (max-width: 700px){
  .logo-strip__label{ width:100%; }
  .logo-strip__marks{ gap: var(--sp-5); }
}
.logo-strip__marks{ display:flex; gap: var(--sp-8); flex-wrap:wrap; opacity:.7; }
.logo-strip__marks span{ font-family: var(--font-display); font-weight:800; font-size:1.1rem; color: var(--ink-soft); letter-spacing:-0.01em; }

/* ---------- Cards: services / values ---------- */
.card{
  background: #fff;
  border: 1px solid var(--border);
  padding: var(--sp-7);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%);
  transition: box-shadow var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
  height:100%;
}
.card:hover{ box-shadow: var(--shadow-md); border-color: var(--border-strong); transform: translateY(-3px); }

.card__icon{
  width:52px; height:52px; display:flex; align-items:center; justify-content:center;
  background: var(--brand-soft); color: var(--brand); margin-bottom: var(--sp-5);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}
.card__icon svg{ width:24px; height:24px; }
.card__icon.is-blue{ background: var(--blue-soft); color: var(--blue-text); }
.card__icon.is-green{ background: var(--green-soft); color: var(--green-text); }

.card h3{ margin-bottom: var(--sp-3); }
.card p{ font-size: .96rem; margin-bottom: var(--sp-4); }
.card__list{ display:flex; flex-direction:column; gap:.55rem; margin-top:auto; }
.card__list li{ display:flex; gap:.6em; font-size:.88rem; color: var(--ink-soft); align-items:flex-start; }
.card__list svg{ width:1rem; height:1rem; color: var(--green-text); flex-shrink:0; margin-top:.18rem; }

.card--onDeep{ background: var(--bg-deep-2); border-color: rgba(255,255,255,.08); }
.card--onDeep h3,.card--onDeep strong{ color:#fff; }
.card--onDeep p{ color:#AEBBC4; }

/* ---------- Numbered process ---------- */
.process{ counter-reset: step; }
.process__item{ display:flex; gap: var(--sp-5); position:relative; padding-bottom: var(--sp-8); }
.process__item:last-child{ padding-bottom:0; }
.process__item::before{
  counter-increment: step; content: counter(step,decimal-leading-zero);
  font-family: var(--font-mono); font-weight:600; font-size:.85rem;
  color: var(--brand); flex-shrink:0;
  width:44px; height:44px; border:1.5px solid var(--brand-soft-2);
  display:flex; align-items:center; justify-content:center;
  background:#fff; position:relative; z-index:1;
}
.process__item:not(:last-child)::after{
  content:""; position:absolute; left:22px; top:44px; bottom:0;
  width:1.5px; background: var(--border-strong);
}
.process__item h4{ margin-bottom:.4rem; }
.process__item p{ font-size:.94rem; max-width:480px; }

/* ---------- Stat grid ---------- */
.stat-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: var(--sp-6); }
@media (max-width: 880px){ .stat-grid{ grid-template-columns: repeat(2,1fr); } }
.stat{ padding-block: var(--sp-5); border-top: 2px solid var(--brand); }
.stat b{ display:block; font-family: var(--font-display); font-size: clamp(1.9rem,1.6rem + 1vw,2.6rem); font-weight:800; }
.stat span{ font-size:.85rem; color: var(--ink-faint); }

/* ---------- Testimonials ---------- */
.testi{
  background:#fff; border:1px solid var(--border); padding: var(--sp-7);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%);
  display:flex; flex-direction:column; height:100%;
}
.testi__quote{ font-family: var(--font-display); font-size:1.08rem; font-weight:600; color: var(--ink); line-height:1.5; margin-bottom: var(--sp-6); }
.testi__quote::before{ content:"\201C"; color: var(--brand); }
.testi__person{ display:flex; align-items:center; gap: var(--sp-4); margin-top:auto; }
.testi__avatar{
  width:46px; height:46px; flex-shrink:0; background: var(--blue-soft); color: var(--blue-text);
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:800;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 8px 100%, 0 calc(100% - 8px));
}
.testi__person strong{ display:block; font-size:.94rem; }
.testi__person span{ font-size:.82rem; color: var(--ink-faint); }
.testi__stars{ display:flex; gap:.15em; color: var(--brand); margin-bottom: var(--sp-4); }
.testi__stars svg{ width:.95rem; height:.95rem; }

/* ---------- Split CTA banner ---------- */
.split-cta{ display:grid; grid-template-columns: 1fr 1fr; }
@media (max-width: 880px){ .split-cta{ grid-template-columns:1fr; } }
.split-cta__panel{ padding: var(--sp-10) clamp(1.5rem,1rem + 3vw, 4rem); position:relative; }
.split-cta__panel.is-brand{ background: var(--brand); color:#fff; }
.split-cta__panel.is-ink{ background: var(--bg-deep); color:#fff; }
.split-cta__panel .eyebrow{ color: rgba(255,255,255,.75); }
.split-cta__panel .eyebrow::before{ background: rgba(255,255,255,.75); }
.split-cta__panel h2{ color:#fff; margin-bottom: var(--sp-4); }
.split-cta__panel p{ color: rgba(255,255,255,.82); margin-bottom: var(--sp-6); max-width:420px; }

/* ---------- Badge / pill ---------- */
.badge{
  display:inline-flex; align-items:center; gap:.5em;
  font-family: var(--font-mono); font-size:.74rem; letter-spacing:.06em; text-transform:uppercase;
  padding:.5em .9em; background: var(--green-soft); color: var(--green-text); font-weight:600;
}
.badge svg{ width:.9rem; height:.9rem; }
.badge.is-blue{ background: var(--blue-soft); color: var(--blue-text); }
.badge.is-brand{ background: var(--brand-soft); color: var(--brand); }

/* ---------- Forms ---------- */
.form-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); }
@media (max-width:700px){ .form-grid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:.5rem; margin-bottom: var(--sp-5); }
.field.is-full{ grid-column: 1 / -1; }
.field label{ font-size:.86rem; font-weight:700; color: var(--ink); }
.field .hint{ font-size:.78rem; color: var(--ink-faint); font-weight:400; }
.field input,.field select,.field textarea{
  border:1.5px solid var(--border-strong); background:#fff; padding: .85em 1em;
  font-size:.96rem; color: var(--ink); width:100%; transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.field input::placeholder,.field textarea::placeholder{ color: var(--ink-faint); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-soft); }
.field textarea{ resize: vertical; min-height: 120px; }
.field.has-error input,.field.has-error select,.field.has-error textarea{ border-color: var(--brand); }
.field__error{ font-size:.8rem; color: var(--brand); display:none; }
.field.has-error .field__error{ display:block; }

.radio-group{ display:flex; gap: var(--sp-3); flex-wrap:wrap; }
.radio-card{
  flex:1; min-width:150px; border:1.5px solid var(--border-strong); padding: var(--sp-4); cursor:pointer;
  display:flex; align-items:center; gap:.7em; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.radio-card:has(input:checked){ border-color: var(--brand); background: var(--brand-soft); }
.radio-card input{ accent-color: var(--brand); width:1.05em; height:1.05em; }
.radio-card span{ font-size:.92rem; font-weight:600; }

.file-drop{
  border:1.5px dashed var(--border-strong); padding: var(--sp-7); text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:.6rem; cursor:pointer;
  transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.file-drop:hover, .file-drop.is-dragover{ border-color: var(--brand); background: var(--brand-soft); }
.file-drop svg{ width:1.8rem; height:1.8rem; color: var(--ink-faint); }
.file-drop strong{ font-size:.92rem; }
.file-drop span{ font-size:.8rem; color: var(--ink-faint); }
.file-drop input{ display:none; }
.file-drop__name{ font-size:.84rem; font-weight:700; color: var(--green-text); }

.cf-check.has-error .field__error{ display:block; }
.cf-check.field{ flex-direction:row; align-items:flex-start; gap:.7em; margin-bottom: var(--sp-5); flex-wrap:wrap; }
.cf-check.field input{ margin-top:.25em; }
.checkbox-row input{ margin-top:.25em; accent-color: var(--brand); width:1.05em; height:1.05em; flex-shrink:0; }
.checkbox-row a{ color: var(--brand); font-weight:600; text-decoration: underline; }

.form-note{ display:flex; align-items:flex-start; gap:.7em; font-size:.84rem; color: var(--ink-faint); margin-top: var(--sp-5); }
.form-note svg{ width:1.1rem; height:1.1rem; flex-shrink:0; margin-top:.1rem; color: var(--blue-text); }

.form-success{
  display:none; align-items:flex-start; gap: var(--sp-4);
  background: var(--green-soft); border:1px solid #BFE3D2; padding: var(--sp-6);
  margin-bottom: var(--sp-6);
}
.form-success.is-visible{ display:flex; }
.form-success svg{ width:1.6rem; height:1.6rem; color: var(--green-text); flex-shrink:0; }
.form-success strong{ display:block; margin-bottom:.2rem; }
.form-success p{ font-size:.92rem; margin:0; }

/* ---------- FAQ accordion ---------- */
.faq-item{ border-bottom:1px solid var(--border); }
.faq-item__q{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap: var(--sp-4);
  padding: var(--sp-5) 0; text-align:left; font-family: var(--font-display); font-weight:700; font-size:1rem; color: var(--ink);
}
.faq-item__q svg{ width:1.1rem; height:1.1rem; color: var(--brand); flex-shrink:0; transition: transform var(--dur-fast) var(--ease); }
.faq-item[data-open="true"] .faq-item__q svg{ transform: rotate(45deg); }
.faq-item__a{ max-height:0; overflow:hidden; transition: max-height var(--dur) var(--ease); }
.faq-item__a-in{ padding-bottom: var(--sp-5); max-width: 640px; }

/* ---------- Footer ---------- */
.site-footer{ background: var(--bg-deep); color:#C4CDD3; }
.footer-top{ padding-block: var(--sp-11) var(--sp-9); display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--sp-8); }
@media (max-width: 880px){ .footer-top{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .footer-top{ grid-template-columns: 1fr; } }
.footer-brand img{ height:42px; width:auto; margin-bottom: var(--sp-5); }
.footer-brand p{ color:#8C9BA5; font-size:.92rem; max-width:280px; margin-bottom: var(--sp-5); }
.footer-social{ display:flex; gap: var(--sp-3); }
.footer-social a{
  width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.16); color:#fff; transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.footer-social a:hover{ background: var(--brand); border-color: var(--brand); }
.footer-social svg{ width:1.05rem; height:1.05rem; }
.footer-col h4{ color:#fff; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; font-family:var(--font-mono); font-weight:600; margin-bottom: var(--sp-5); }
.footer-col ul{ display:flex; flex-direction:column; gap: var(--sp-3); }
.footer-col a{ font-size:.92rem; color:#AEBBC4; transition: color var(--dur-fast) var(--ease); }
.footer-col a:hover{ color:#fff; }
.footer-contact li{ display:flex; align-items:flex-start; gap:.7em; font-size:.92rem; color:#AEBBC4; }
.footer-contact svg{ width:1rem; height:1rem; flex-shrink:0; margin-top:.2rem; color: var(--green); }

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1); padding-block: var(--sp-5);
  display:flex; align-items:center; justify-content:space-between; gap: var(--sp-4); flex-wrap:wrap;
}
.footer-bottom small{ font-size:.82rem; color:#7E8C96; }
.footer-bottom-links{ display:flex; gap: var(--sp-6); flex-wrap:wrap; }
.footer-bottom-links a{ font-size:.82rem; color:#7E8C96; }
.footer-bottom-links a:hover{ color:#fff; }
.footer-license{ display:flex; align-items:center; gap:.5em; font-size:.78rem; color:#7E8C96; font-family: var(--font-mono); }
.footer-license svg{ width:.95rem; height:.95rem; color: var(--green); }

/* ---------- Cookie banner ---------- */
.cookie-banner{
  position:fixed; left: var(--sp-5); right: var(--sp-5); bottom: var(--sp-5); z-index: 200;
  max-width: 560px; background: var(--bg-deep); color:#fff; padding: var(--sp-6);
  box-shadow: var(--shadow-lg);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%);
  transform: translateY(140%); transition: transform var(--dur) var(--ease);
}
.cookie-banner.is-visible{ transform: translateY(0); }
.cookie-banner p{ color:#AEBBC4; font-size:.88rem; margin-bottom: var(--sp-5); }
.cookie-banner p a{ color:#fff; text-decoration:underline; }
.cookie-banner__row{ display:flex; gap: var(--sp-3); flex-wrap:wrap; }

/* ---------- Page hero (interior pages) ---------- */
.page-hero{ padding-block: clamp(2.5rem,2rem + 3vw,4.5rem) clamp(2rem,1.5rem + 2vw,3rem); border-bottom:1px solid var(--border); }
.breadcrumb{ display:flex; align-items:center; gap:.5em; font-size:.84rem; color: var(--ink-faint); margin-bottom: var(--sp-5); font-family: var(--font-mono); }
.breadcrumb a{ color: var(--ink-faint); }
.breadcrumb a:hover{ color: var(--brand); }
.page-hero h1{ max-width: 760px; }
.page-hero__lede{ font-size:1.1rem; max-width:620px; margin-top: var(--sp-4); }

/* ---------- Utility ---------- */
.mt-0{ margin-top:0 !important; }
.center{ text-align:center; margin-inline:auto; }
.muted{ color: var(--ink-faint); }
.divider{ height:1px; background: var(--border); width:100%; }
.tag-row{ display:flex; flex-wrap:wrap; gap: var(--sp-3); }
.tag{ font-size:.82rem; font-weight:600; padding:.5em 1em; background: var(--bg-soft-2); color: var(--ink-soft); }
.tag.is-active{ background: var(--brand); color:#fff; }

[data-animate]{ opacity:0; transform: translateY(18px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
[data-animate].is-visible{ opacity:1; transform:none; }
[data-animate-stagger] > *{ transition-delay: calc(var(--i, 0) * 80ms); }

@media (max-width: 640px){
  .hero__trust{ gap: var(--sp-5); }
  .stat-grid{ gap: var(--sp-5); }
}