:root{
  --ink:#17242B;
  --ink-2:#123544;
  --paper:#EFEEE7;
  --paper-2:#FBFAF7;

  --teal:#2E7398;
  --teal-bright:#3F92BD;
  --sky:#1E93C2;
  --sky-bright:#25AEE6;
  --green:#5E8F34;
  --green-bright:#76A73E;
  --gold:#B87A16;
  --gold-bright:#E5A024;
  --red:#BF1F2D;

  --text:#1B2429;
  --text-on-ink:#EDEFEC;
  --muted:#5C6570;
  --muted-on-ink:#AEBAC0;
  --line:rgba(23,36,43,0.14);
  --line-on-ink:rgba(237,239,236,0.16);
  --maxw:1120px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper-2);
  color:var(--text);
  font-family:'Public Sans', -apple-system, sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Fraunces', Georgia, serif;
  font-weight:400;
  letter-spacing:-0.01em;
  color:var(--ink);
}
a{color:inherit; text-decoration:none;}
p{text-align:justify;}
img,svg{display:block; max-width:100%;}

.en{display:none;}
body.lang-en .en{display:inline;}
body.lang-en .fr{display:none;}
.en-b{display:none;}
body.lang-en .en-b{display:block;}
body.lang-en .fr-b{display:none;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
a:focus-visible, button:focus-visible{ outline:2px solid var(--gold-bright); outline-offset:3px; }

/* ---------- Header ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(251,250,247,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{ max-width:var(--maxw); margin:0 auto; padding:10px 32px; display:flex; align-items:center; justify-content:space-between; }
.brand img{height:56px; width:auto; display:block;}
.nav-links{display:flex; align-items:center; gap:32px;}
.nav-links > a{ font-size:13px; letter-spacing:0.04em; color:var(--muted); transition:color 0.2s ease; }
.nav-links > a:hover, .nav-links > a.active{color:var(--teal);}
.nav-mobile-hide{display:flex; align-items:center; gap:28px;}

.has-dropdown{position:relative;}
.dropdown-btn{
  font-size:13px; letter-spacing:0.04em; color:var(--muted); background:none; border:none;
  font-family:inherit; cursor:pointer; display:flex; align-items:center; gap:5px; padding:0;
}
.dropdown-btn:hover, .has-dropdown.open .dropdown-btn{color:var(--teal);}
.dropdown-btn svg{width:9px; height:9px; transition:transform 0.2s ease;}
.has-dropdown.open .dropdown-btn svg{transform:rotate(180deg);}
.dropdown-menu{
  position:absolute; top:calc(100% + 18px); left:50%; transform:translateX(-50%);
  background:var(--paper-2); border:1px solid var(--line); min-width:270px;
  box-shadow:0 18px 40px rgba(18,33,59,0.14);
  opacity:0; visibility:hidden; transform:translateX(-50%) translateY(6px);
  transition:opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  padding:8px;
}
.has-dropdown.open .dropdown-menu{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);}
.dropdown-menu a{
  display:flex; flex-direction:column; gap:2px; padding:11px 14px; font-size:13.5px; color:var(--text);
  border-left:2px solid transparent;
}
.dropdown-menu a:hover{background:var(--paper); border-left-color:var(--teal);}
.dropdown-menu a small{font-size:11.5px; color:var(--muted); font-weight:400;}
.dropdown-menu a.active{border-left-color:var(--gold-bright);}

.lang-toggle{
  display:flex; align-items:center; border:1px solid var(--line);
  border-radius:999px; overflow:hidden; font-size:12px; font-weight:600; letter-spacing:0.06em;
}
.lang-toggle button{
  padding:6px 13px; background:transparent; border:none; cursor:pointer;
  color:var(--muted); font-family:inherit; font-size:12px; font-weight:600; letter-spacing:0.06em;
}
.lang-toggle button.active{background:var(--teal); color:#fff;}
.mobile-toggle{display:none; background:none; border:none; cursor:pointer; padding:4px;}
.mobile-toggle svg{width:22px; height:22px;}

@media (max-width:900px){
  .nav-links{
    position:fixed; top:77px; left:0; right:0; bottom:0; background:var(--paper-2);
    flex-direction:column; align-items:flex-start; padding:28px 32px; gap:4px;
    transform:translateX(100%); transition:transform 0.25s ease; overflow-y:auto;
  }
  body.menu-open .nav-links{transform:translateX(0);}
  .nav-links > a{padding:14px 0; width:100%; border-bottom:1px solid var(--line); font-size:15px;}
  .has-dropdown{width:100%;}
  .dropdown-btn{padding:14px 0; width:100%; border-bottom:1px solid var(--line); font-size:15px; justify-content:space-between;}
  .dropdown-menu{
    position:static; transform:none; box-shadow:none; border:none; opacity:1; visibility:visible;
    max-height:0; overflow:hidden; padding:0; min-width:0;
  }
  .has-dropdown.open .dropdown-menu{max-height:600px; padding:6px 0 6px 14px;}
  .mobile-toggle{display:block;}
  .lang-toggle{margin-top:18px;}
}

/* ---------- Hero (home) ---------- */
.hero{ position:relative; padding:168px 0 120px; background:var(--ink-2); color:var(--text-on-ink); overflow:hidden; }
.hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 82% 12%, rgba(229,160,36,0.20), transparent 50%),
    radial-gradient(ellipse at 100% 70%, rgba(37,174,230,0.14), transparent 55%);
  pointer-events:none;
}
.hero-inner{position:relative; max-width:720px;}
.hero-logo{width:220px; height:auto; margin-bottom:34px;}

/* ---------- Page header (inner pages) ---------- */
.page-hero{ position:relative; padding:150px 0 76px; background:var(--ink-2); color:var(--text-on-ink); overflow:hidden; }
.page-hero::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(ellipse at 88% 0%, rgba(229,160,36,0.18), transparent 50%);
  pointer-events:none;
}
.page-hero-inner{position:relative; max-width:760px;}
.breadcrumb{font-size:12px; color:var(--muted-on-ink); margin-bottom:18px;}
.breadcrumb a{color:var(--sky-bright);}
.page-hero h1{font-size:clamp(28px,4vw,42px); color:var(--text-on-ink); font-weight:400; line-height:1.18; margin-bottom:16px;}
.page-hero .lede{font-size:16.5px; color:var(--muted-on-ink); max-width:600px;}

.eyebrow{
  font-size:12px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--gold-bright); font-weight:600; margin-bottom:22px; display:flex; align-items:center; gap:10px;
}
.eyebrow::before{content:""; width:28px; height:1px; background:var(--gold-bright);}
.hero h1{ font-size:clamp(34px, 5vw, 54px); line-height:1.12; font-weight:400; color:var(--text-on-ink); margin-bottom:26px; }
.hero h1 em{font-style:italic; color:var(--sky-bright);}
.hero p.lede{ font-size:18px; color:var(--muted-on-ink); max-width:520px; margin-bottom:40px; }
.cta-row{display:flex; gap:16px; flex-wrap:wrap;}
.btn{
  display:inline-flex; align-items:center; gap:10px; padding:14px 26px;
  font-size:13px; letter-spacing:0.04em; font-weight:600; border-radius:1px;
  transition:all 0.2s ease; cursor:pointer; border:1px solid transparent;
}
.btn-primary{background:var(--gold-bright); color:#20180a;}
.btn-primary:hover{background:#f0b23a;}
.btn-ghost{border-color:var(--line-on-ink); color:var(--text-on-ink);}
.btn-ghost:hover{border-color:var(--sky-bright); color:var(--sky-bright);}
.btn-outline{border-color:var(--line); color:var(--ink);}
.btn-outline:hover{border-color:var(--teal); color:var(--teal);}

/* ---------- Sections generic ---------- */
section{padding:100px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head .eyebrow{color:var(--teal);}
.section-head .eyebrow::before{background:var(--teal);}
.section-head h2{font-size:clamp(26px,3.4vw,38px); font-weight:400;}
.section-head p.sub{color:var(--muted); font-size:15.5px; margin-top:16px; max-width:560px;}
.section-on-paper{background:var(--paper);}

.reveal{opacity:0; transform:translateY(18px); transition:opacity 0.7s ease, transform 0.7s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1; transform:none; transition:none;} html{scroll-behavior:auto;} }

/* ---------- Service cards (home) ---------- */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.svc-card{background:var(--paper-2); padding:34px 28px; display:block; border-top:3px solid var(--card-accent, var(--teal)); transition:background 0.2s ease;}
.svc-card:hover{background:var(--paper);}
.svc-card:nth-child(6n+1){--card-accent:var(--teal);}
.svc-card:nth-child(6n+2){--card-accent:var(--green-bright);}
.svc-card:nth-child(6n+3){--card-accent:var(--gold-bright);}
.svc-card:nth-child(6n+4){--card-accent:var(--sky-bright);}
.svc-card:nth-child(6n+5){--card-accent:var(--red);}
.svc-card:nth-child(6n+6){--card-accent:var(--teal-bright);}
.svc-card .tag{font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--card-accent); font-weight:600; margin-bottom:12px;}
.svc-card h3{font-size:18px; font-weight:500; margin-bottom:12px; line-height:1.3;}
.svc-card p{font-size:14px; color:var(--muted); line-height:1.6; margin-bottom:16px;}
.svc-card .go{font-size:12.5px; color:var(--ink); font-weight:600; display:inline-flex; align-items:center; gap:6px;}
@media (max-width:900px){.svc-grid{grid-template-columns:1fr;}}

/* ---------- Two column ---------- */
.two-col{display:grid; grid-template-columns:1.05fr 0.95fr; gap:64px; align-items:start;}
.two-col.reverse{grid-template-columns:0.95fr 1.05fr;}
.two-col.reverse .col-b{order:-1;}
@media (max-width:900px){ .two-col, .two-col.reverse{grid-template-columns:1fr;} .two-col.reverse .col-b{order:0;} }
.col p{color:var(--muted); font-size:15px; margin-bottom:16px; text-align:justify;}
.col p:last-child{margin-bottom:0;}
.col h3{font-size:19px; font-weight:500; margin-bottom:14px;}

/* ---------- Point list ---------- */
.point-list{display:flex; flex-direction:column; gap:0; margin-top:8px;}
.point{padding:20px 0; border-top:1px solid var(--line); display:flex; gap:16px; align-items:flex-start;}
.point:last-child{border-bottom:1px solid var(--line);}
.point .dot{width:7px; height:7px; border-radius:50%; background:var(--teal); margin-top:8px; flex-shrink:0;}
.point p{font-size:14.5px; color:var(--text); margin:0;}

/* ---------- Question grid (used on assurance/general) ---------- */
.q-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.q-item{background:var(--paper-2); border:1px solid var(--line); padding:18px 20px; font-size:14px; color:var(--text); font-style:italic;}
@media (max-width:700px){.q-grid{grid-template-columns:1fr;}}

/* ---------- Stat / value pills ---------- */
.pill-row{display:flex; gap:12px; flex-wrap:wrap; margin-top:20px;}
.pill{font-size:12px; letter-spacing:0.04em; padding:9px 16px; border:1px solid var(--line); border-radius:999px; color:var(--ink);}

/* ---------- Story cards ---------- */
.story-grid{display:grid; grid-template-columns:1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
.story{background:var(--paper-2); padding:40px 36px; display:grid; grid-template-columns:120px 1fr; gap:28px;}
.story-tag{font-family:'Fraunces',serif; font-style:italic; font-size:15px; color:var(--teal);}
.story p{font-size:14.5px; color:var(--muted); margin-bottom:12px; line-height:1.7;}
.story p:last-child{margin-bottom:0;}
.story .signature{color:var(--ink); font-weight:600; font-size:13px; margin-top:14px;}
@media (max-width:700px){.story{grid-template-columns:1fr; gap:10px;}}

/* ---------- Myth / quote block ---------- */
.myth-block{ background:var(--ink-2); color:var(--text-on-ink); padding:72px 56px; }
.myth-block .eyebrow{color:var(--gold-bright);}
.myth-block h2{color:var(--text-on-ink); font-size:clamp(24px,3vw,32px); margin-bottom:24px;}
.myth-block p{color:var(--muted-on-ink); font-size:15.5px; line-height:1.8; margin-bottom:16px; max-width:760px;}
.myth-block .closing{ font-family:'Fraunces',serif; font-style:italic; color:var(--sky-bright); font-size:19px; margin-top:24px; max-width:640px; }
@media (max-width:700px){.myth-block{padding:52px 28px;}}

/* ---------- About quote ---------- */
.about-quote{
  font-family:'Fraunces', serif; font-size:clamp(20px,2.4vw,26px); font-style:italic;
  color:var(--ink); line-height:1.4; border-left:2px solid var(--gold-bright); padding-left:28px;
}
.swatch-row{display:flex; gap:10px; margin-top:28px;}
.swatch{width:30px; height:30px; border-radius:50%;}

/* ---------- CTA band ---------- */
.cta-band{ background:var(--ink-2); color:var(--text-on-ink); padding:64px 0; text-align:center; }
.cta-band h2{color:var(--text-on-ink); font-size:clamp(22px,3vw,30px); margin-bottom:22px;}
.cta-band .cta-row{justify-content:center;}

/* ---------- Contact ---------- */
.contact-wrap{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
.contact-email{
  font-family:'Fraunces', serif; font-size:clamp(24px,3vw,32px); color:var(--ink);
  display:inline-block; margin:20px 0 28px; border-bottom:1px solid var(--teal); padding-bottom:6px;
}
.contact-note{font-size:14px; color:var(--muted); max-width:380px;}
.contact-details{display:flex; flex-direction:column; gap:22px;}
.cdet-label{font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal); font-weight:600; margin-bottom:6px;}
.cdet-value{font-size:14.5px; color:var(--text);}
@media (max-width:860px){.contact-wrap{grid-template-columns:1fr; gap:40px;}}

/* ---------- Professional contact picker ---------- */
.pro-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin:28px 0 24px;}
.pro-card{background:var(--paper-2);}
.pro-card label{display:flex; gap:14px; padding:22px 24px; cursor:pointer; align-items:flex-start;}
.pro-card:hover{background:var(--paper);}
.pro-card input[type="checkbox"]{margin-top:4px; width:16px; height:16px; accent-color:var(--teal); flex-shrink:0; cursor:pointer;}
.pro-name{display:block; font-weight:600; font-size:14.5px; color:var(--ink); margin-bottom:4px;}
.pro-name small{font-weight:400; color:var(--muted); font-size:12px;}
.pro-card p{font-size:13.5px; color:var(--muted); margin:0; text-align:left;}
.pro-hint{font-size:13.5px; color:var(--muted); font-style:italic; margin-bottom:6px;}
#pro-contact-btn:disabled{opacity:0.4; cursor:not-allowed;}
@media (max-width:700px){.pro-grid{grid-template-columns:1fr;}}

/* ---------- Footer ---------- */
footer{background:var(--ink-2); color:var(--muted-on-ink); padding:52px 0 30px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:36px; border-bottom:1px solid var(--line-on-ink);}
.footer-grid img{height:46px; width:auto; margin-bottom:14px;}
.footer-grid p{font-size:13px; color:var(--muted-on-ink); max-width:280px; line-height:1.7;}
.footer-col h4{font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-bright); margin-bottom:14px; font-weight:600;}
.footer-col a{display:block; font-size:13.5px; color:var(--muted-on-ink); margin-bottom:10px;}
.footer-col a:hover{color:var(--text-on-ink);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:12px; padding-top:22px;}
@media (max-width:760px){.footer-grid{grid-template-columns:1fr; gap:28px;}}
