:root{
  --bg:#FFFFFF;
  --alt:#F8FAFC;
  --text:#0F172A;
  --muted:#475569;
  --border:#E2E8F0;
  --orange:#F97316;
  --blue:#2563EB;
  --radius:18px;
  --max:1120px;
  --shadow: 0 10px 26px rgba(2,6,23,.10);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(900px 520px at 15% 0%, rgba(37,99,235,.10), transparent 60%),
    radial-gradient(900px 520px at 85% 10%, rgba(249,115,22,.10), transparent 60%),
    var(--bg);
  color:var(--text);
  line-height:1.55;
}
a{color:inherit}
.container{max-width:var(--max); margin:0 auto; padding:0 18px}
.muted{color:var(--muted)}
.small{font-size:.95rem}
.tiny{font-size:.85rem}
.lead{font-size:1.1rem}
.mt{margin-top:18px}
code{background:rgba(2,6,23,.05); padding:2px 6px; border-radius:8px}

.topbar{
  position:sticky; top:0; z-index:50;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px;
}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none}
.brand__logo{width:36px; height:36px}
.brand__text{font-weight:950; letter-spacing:.2px}
.nav{display:none; gap:16px}
.nav a{color:var(--muted); text-decoration:none; font-weight:800}
.nav a:hover{color:var(--text); text-decoration:underline}
.topbar__cta{display:flex; gap:10px}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px;
  border-radius:14px;
  text-decoration:none;
  font-weight:900;
  letter-spacing:.2px;
  border: 1px solid var(--border);
  background: #fff;
  box-shadow: var(--shadow);
}
.btn:hover{transform: translateY(-1px)}
.btn:active{transform: translateY(0px)}
.btn--ghost{background: #fff}
.btn--primary{
  border-color: rgba(249,115,22,.35);
  background: linear-gradient(180deg, rgba(249,115,22,.14), rgba(37,99,235,.08));
}
.btn--big{padding:14px 16px; border-radius:16px; font-size:1.05rem}

.hero{padding:46px 0 10px}
.hero__content{padding:16px 0 26px}
.pill{
  display:inline-flex; align-items:center;
  padding:8px 12px; border-radius:999px;
  background: rgba(2,6,23,.04);
  border:1px solid var(--border);
  font-weight:900;
  color:var(--muted);
}
h1{
  margin:14px 0 10px;
  font-size: clamp(2.0rem, 4vw, 3.1rem);
  line-height:1.06;
  letter-spacing:-.6px;
}
.accentOrange{color:var(--orange)}
.accentBlue{color:var(--blue)}
.subhead{max-width:60ch; font-size:1.1rem; color:var(--muted)}
.ctaRow{display:flex; gap:12px; flex-wrap:wrap; margin:18px 0 18px}

.trust{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-top:12px;
}
.trust__item{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:12px 14px;
  box-shadow: var(--shadow);
}
.trust__kicker{display:block; color:var(--muted); font-size:.92rem; font-weight:800}
.trust__value{display:block; font-weight:1000}

.hero__note{
  margin-top:14px;
  display:flex; gap:10px; align-items:flex-start;
  padding:12px 14px;
  border:1px dashed rgba(249,115,22,.45);
  background: rgba(249,115,22,.06);
  border-radius: var(--radius);
}
.dot{width:10px; height:10px; border-radius:50%; margin-top:6px}
.dot--orange{background: var(--orange)}

.section{padding:42px 0}
.section--alt{
  background: var(--alt);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
h2{margin:0 0 10px; font-size:1.9rem; letter-spacing:-.2px}
.cards{
  margin-top:18px;
  display:grid;
  grid-template-columns: 1fr;
  gap:12px;
}
.card{
  background: #fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: var(--shadow);
}
.card h3{margin:0 0 6px}
.card p{margin:0; color:var(--muted)}
.note{
  margin-top:18px;
  padding:14px 16px;
  border-radius: var(--radius);
  border:1px solid rgba(37,99,235,.22);
  background: rgba(37,99,235,.06);
}
.note a{font-weight:1000}

.steps{display:grid; grid-template-columns:1fr; gap:12px; margin-top:16px}
.step{
  display:flex; gap:12px; align-items:flex-start;
  background: #fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:14px;
  box-shadow: var(--shadow);
}
.step__num{
  width:38px; height:38px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-weight:1000;
  color:#fff;
  background: linear-gradient(135deg, var(--orange), var(--blue));
}
.step__body h3{margin:0 0 4px}
.step__body p{margin:0; color:var(--muted)}
.miniFaq{display:grid; grid-template-columns:1fr; gap:12px; margin-top:16px}
.miniFaq__item{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:14px;
  box-shadow: var(--shadow);
}
.miniFaq__item h4{margin:0 0 6px}
.miniFaq__item p{margin:0; color:var(--muted)}

.tagRow{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px}
.tag{
  padding:8px 12px;
  border-radius:999px;
  background: #fff;
  border:1px solid var(--border);
  font-weight:900;
  color:var(--muted);
}

.contactGrid{display:grid; grid-template-columns:1fr; gap:14px; margin-top:16px}
.contactCard{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: var(--shadow);
}
.contactBig{font-size:1.5rem; font-weight:1000; margin:6px 0 12px}
.contactBtns{display:flex; gap:10px; flex-wrap:wrap}
.fineprint{margin-top:14px; color:var(--muted); font-size:.95rem}

.form{
  background:#fff;
  border:1px solid var(--border);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: var(--shadow);
}
label{display:block; font-weight:950; margin-bottom:12px}
input,textarea{
  width:100%;
  margin-top:6px;
  background: #fff;
  color: var(--text);
  border:1px solid var(--border);
  border-radius: 14px;
  padding:12px 12px;
  font-size:1rem;
}
textarea{resize:vertical; min-height:120px}

.footer{
  padding:26px 0;
  border-top:1px solid var(--border);
  background: #fff;
}
.footer__row{
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  align-items:center;
}
.footer__brand{font-weight:1000}
.footer__links{display:flex; gap:14px}
.footer__links a{color:var(--muted); text-decoration:none; font-weight:900}
.footer__links a:hover{text-decoration:underline; color:var(--text)}

@media (min-width: 860px){
  .nav{display:flex}
  .trust{grid-template-columns: repeat(3, 1fr)}
  .cards{grid-template-columns: repeat(3, 1fr)}
  .steps{grid-template-columns: repeat(3, 1fr)}
  .step{flex-direction:column}
  .miniFaq{grid-template-columns: repeat(2, 1fr)}
  .contactGrid{grid-template-columns: 1fr 1fr}
}


/* ===== HERO PHOTO (full width) ===== */
.heroPhoto{
  position: relative;
  width: 100%;
}

.heroPhoto__media{
  height: clamp(320px, 44vw, 620px);
  width: 100%;
  background-image: url("hero-photo.jpg");
  background-size: cover;
  background-position: center;
}

.heroPhoto__overlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
}

.heroPhoto__overlay::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.78) 42%, rgba(255,255,255,0.22) 72%, rgba(255,255,255,0.00) 100%);
}

.heroPhoto__content{
  position: relative;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 12px;
}

.heroPhoto__kicker{
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  color: var(--blue-700, #13457f);
  margin: 0 0 10px;
}

.heroPhoto__title{
  margin: 0 0 8px;
  font-size: clamp(36px, 4.4vw, 64px);
  line-height: 1.05;
  color: var(--blue-900, #0b2f57);
}

.heroPhoto__sub{
  margin: 0 0 16px;
  font-size: 18px;
  color: #1e2a39;
}

.heroPhoto__buttons{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.pill--service{
  display:inline-block;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(11,47,87,0.12);
  box-shadow: 0 10px 25px rgba(11,27,43,0.08);
  padding: 10px 14px;
  border-radius: 999px;
  font-size: 13px;
  color:#1e2a39;
}

@media (max-width: 700px){
  .heroPhoto__overlay::before{
    background: linear-gradient(180deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.78) 54%, rgba(255,255,255,0.12) 100%);
  }
  .heroPhoto__media{
    height: 420px;
  }
}


/* ===== Decorative Swooshes (visible) ===== */
.swoosh{
  width: 100%;
  position: relative;
  height: 72px;
  overflow: hidden;
  z-index: 2;
}

.swoosh::before{
  content:"";
  position:absolute;
  inset:-2px -10vw;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}

.swoosh--top::before{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 220' preserveAspectRatio='none'><path d='M-40,120 C220,40 520,10 820,40 1120,70 1280,120 1480,70 L1480,0 L-40,0 Z' fill='%231b5cb2'/><path d='M-40,150 C240,70 560,40 860,65 1140,88 1320,130 1480,92' fill='none' stroke='%23ff8a2b' stroke-width='26' stroke-linecap='round' opacity='0.98'/></svg>");
}

.swoosh--mid{
  height: 64px;
}
.swoosh--mid::before{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 160' preserveAspectRatio='none'><path d='M0,80 C260,30 520,130 780,105 1040,80 1220,25 1440,60 L1440,160 L0,160 Z' fill='%231b5cb2'/><path d='M0,110 C300,60 600,160 860,130 1120,100 1260,60 1440,90 L1440,160 L0,160 Z' fill='%23ff8a2b' opacity='0.95'/></svg>");
}

.swoosh--bottom{
  height: 96px;
  z-index: 1;
}
.swoosh--bottom::before{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 220' preserveAspectRatio='none'><path d='M0,120 C240,60 520,190 760,160 1000,130 1220,40 1440,90 L1440,220 L0,220 Z' fill='%231b5cb2'/><path d='M0,170 C280,110 560,230 820,200 1080,170 1260,110 1440,140 L1440,220 L0,220 Z' fill='%23ff8a2b' opacity='0.95'/></svg>");
}

@media (max-width: 700px){
  .swoosh{ height: 64px; }
  .swoosh--bottom{ height: 74px; }
}


/* Overlay top swoosh on hero image */
.heroPhoto{
  position: relative;
  overflow: hidden;
}
.swoosh--overlay{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 6;
  pointer-events: none;
}

.swoosh--top::before{
  transform: translateX(-2%);
}

