/* ==========================================================================
   Confiance LLC — Design System "Reserve"
   Every color, size and spacing value on the site comes from this block.
   Change a token here and it changes everywhere.
   ========================================================================== */
:root{
  /* Ground */
  --bg:          #151313;
  --bg-raised:   #1D1B1B;
  --bg-card:     #211E1E;

  /* Ink */
  --ink:         #F0ECEA;
  --ink-2:       #A9A09C;
  --ink-3:       #6F6764;

  /* Structure */
  --line:        #2C2827;
  --line-2:      #3A3534;

  /* Brand */
  --maroon:      #B23A54;
  --maroon-deep: #7A1F35;
  --gold:        #C7A46A;

  /* Type */
  --sans: "Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;

  /* Scale */
  --step--1: 0.82rem;
  --step-0:  1rem;
  --step-1:  1.18rem;
  --step-2:  clamp(1.3rem, 2.2vw, 1.6rem);
  --step-3:  clamp(1.6rem, 3vw, 2.15rem);
  --step-4:  clamp(2.3rem, 5.2vw, 4rem);

  /* Rhythm */
  --gap:      1rem;
  --gap-2:    1.5rem;
  --gap-3:    2.5rem;
  --section:  clamp(3.5rem, 7vw, 6rem);
  --measure:  66rem;
  --read:     62ch;

  --ease: cubic-bezier(.16,.8,.3,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{margin:0;letter-spacing:-.025em;text-wrap:balance;font-weight:600;}
p{margin:0 0 var(--gap);}
:where(a,button,input,select,textarea,summary):focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;
}

.wrap{max-width:var(--measure);margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem);}
.read{max-width:var(--read);}
.eyebrow{
  font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin:0 0 var(--gap-2);
}
.rule{border:0;border-top:1px solid var(--line);margin:0;}

/* ---------------- Header ---------------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(21,19,19,.88);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .25s ease, background .25s ease;
}
.site-header.condensed{border-bottom-color:var(--line);background:rgba(21,19,19,.96);}
.site-header .bar{
  display:flex;align-items:center;gap:1.25rem;
  padding:1.35rem 0;transition:padding .25s var(--ease);
}
.site-header.condensed .bar{padding:.8rem 0;}
.brand{display:flex;align-items:center;gap:.85rem;}
.brand img{height:36px;width:auto;transition:height .25s var(--ease);}
.site-header.condensed .brand img{height:28px;}
.brand .name{
  font-size:.95rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
}
.nav{margin-left:auto;display:flex;align-items:center;gap:1.6rem;}
.nav a{
  font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;
  color:var(--ink-2);transition:color .18s;
}
.nav a:hover{color:var(--gold);}
.nav .tel{color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:.04em;}
.nav-toggle{display:none;}

/* ---------------- Buttons ---------------- */
.btn{
  display:inline-block;border:1px solid var(--maroon);background:var(--maroon);color:#fff;
  font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;padding:.9rem 1.9rem;cursor:pointer;
  transition:background .2s, color .2s, transform .2s var(--ease);
}
.btn:hover{background:transparent;color:var(--maroon);transform:translateY(-2px);}
.btn-ghost{
  display:inline-block;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);
  font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:.9rem 1.9rem;transition:border-color .2s,color .2s,transform .2s var(--ease);
}
.btn-ghost:hover{border-color:var(--ink-2);color:var(--ink);transform:translateY(-2px);}

/* ---------------- Hero ---------------- */
.hero{padding:clamp(3.5rem,8vw,6.5rem) 0 clamp(3rem,6vw,5rem);}
.hero h1{font-size:var(--step-4);line-height:1.01;max-width:16ch;margin-bottom:var(--gap-2);}
.hero .lede{
  font-family:var(--serif);font-size:clamp(1.05rem,1.8vw,1.22rem);color:var(--ink-2);
  max-width:48ch;line-height:1.6;margin-bottom:var(--gap-3);
}
.hero .acts{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;}
.hero .acts .tel-note{font-size:.85rem;color:var(--ink-3);margin:0 0 0 .5rem;}
.hero .acts .tel-note a{color:var(--ink-2);border-bottom:1px solid var(--line-2);}
.hero .acts .tel-note a:hover{color:var(--gold);border-bottom-color:var(--gold);}

/* ---------------- Sections ---------------- */
.section{padding:var(--section) 0;border-top:1px solid var(--line);}
.section > .wrap > h2{font-size:var(--step-3);line-height:1.12;max-width:20ch;margin-bottom:var(--gap-2);}
.section .intro{font-family:var(--serif);font-size:var(--step-1);color:var(--ink-2);max-width:var(--read);line-height:1.6;}

/* Coverage grid */
.coverage{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:var(--gap-3);}
.coverage > div{background:var(--bg);padding:1.5rem 1.6rem;transition:background .22s;}
.coverage > div:hover{background:var(--bg-raised);}
.coverage h3{font-size:.98rem;margin-bottom:.5rem;letter-spacing:-.01em;}
.coverage p{font-size:.87rem;color:var(--ink-2);line-height:1.6;margin:0;}

/* Audience blocks */
.audiences{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:2.25rem;margin-top:var(--gap-3);}
.audiences article h3{font-size:1.05rem;margin-bottom:.6rem;}
.audiences article .tagline{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:.7rem;}
.audiences article p{font-size:.92rem;color:var(--ink-2);margin:0;line-height:1.65;}

/* Underwriting — the authority section */
.factors{margin-top:var(--gap-3);border-top:1px solid var(--line);}
.factors article{
  display:grid;grid-template-columns:14rem 1fr;gap:2.5rem;
  padding:2rem 0;border-bottom:1px solid var(--line);
}
.factors h3{font-size:1.12rem;line-height:1.25;align-self:start;}
.factors .num{
  font-size:.66rem;letter-spacing:.2em;color:var(--ink-3);font-weight:600;
  display:block;margin-bottom:.5rem;
}
.factors p{font-family:var(--serif);font-size:1rem;color:var(--ink-2);max-width:58ch;line-height:1.68;}
.factors p:last-child{margin-bottom:0;}

/* Pull quote */
.pull{padding:var(--section) 0;border-top:1px solid var(--line);}
.pull blockquote{
  margin:0;font-family:var(--serif);font-size:clamp(1.35rem,3vw,2.05rem);
  line-height:1.38;font-weight:400;max-width:32ch;letter-spacing:-.015em;
}
.pull blockquote em{font-style:normal;color:var(--gold);}
.pull cite{
  display:block;margin-top:1.6rem;font-style:normal;font-family:var(--sans);
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);font-weight:600;
}

/* Process */
.process{counter-reset:step;margin-top:var(--gap-3);}
.process article{
  counter-increment:step;display:grid;grid-template-columns:3.5rem 1fr;gap:1.75rem;
  padding:1.75rem 0;border-top:1px solid var(--line);
}
.process article::before{
  content:"0" counter(step);
  font-size:.85rem;letter-spacing:.1em;color:var(--maroon);font-weight:600;padding-top:.35rem;
}
.process h3{font-size:1.05rem;margin-bottom:.5rem;}
.process p{font-size:.93rem;color:var(--ink-2);max-width:58ch;margin:0;line-height:1.65;}

/* Markets */
.markets{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:2rem;margin-top:var(--gap-3);}
.markets h3{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem;}
.markets ul{list-style:none;margin:0;padding:0;}
.markets li{font-size:.92rem;color:var(--ink-2);padding:.4rem 0;border-bottom:1px solid var(--line);}
.markets li:last-child{border-bottom:none;}

/* FAQ */
.faq{margin-top:var(--gap-3);border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
  cursor:pointer;list-style:none;padding:1.15rem 2.5rem 1.15rem 0;position:relative;
  font-size:1rem;font-weight:600;letter-spacing:-.01em;transition:color .18s;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--gold);}
.faq summary::after{
  content:"";position:absolute;right:.4rem;top:1.55rem;width:.6rem;height:.6rem;
  border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .22s var(--ease);
}
.faq details[open] summary::after{transform:rotate(-135deg);}
.faq .answer{padding:0 0 1.35rem;font-family:var(--serif);font-size:.98rem;color:var(--ink-2);max-width:64ch;line-height:1.68;}
.faq .answer p{margin:0;}

/* Form */
.quote{background:var(--bg-raised);border-top:1px solid var(--line);padding:var(--section) 0;}
.quote .grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:start;}
.quote h2{font-size:var(--step-3);line-height:1.12;margin-bottom:var(--gap);}
.quote .intro{font-family:var(--serif);color:var(--ink-2);max-width:42ch;font-size:1.02rem;}
.quote .direct{margin-top:var(--gap-2);font-size:.9rem;color:var(--ink-3);}
.quote .direct a{color:var(--ink);border-bottom:1px solid var(--line-2);}
.quote .direct a:hover{color:var(--gold);border-bottom-color:var(--gold);}

form{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;}
.field{display:flex;flex-direction:column;gap:.35rem;}
.field.full{grid-column:1 / -1;}
label{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:600;}
input,select,textarea{
  font-family:var(--sans);font-size:.93rem;color:var(--ink);
  background:var(--bg);border:1px solid var(--line-2);border-radius:0;
  padding:.7rem .8rem;width:100%;
  transition:border-color .18s, box-shadow .18s;
}
textarea{resize:vertical;min-height:5.5rem;}
input::placeholder,textarea::placeholder{color:var(--ink-3);}
input:hover,select:hover,textarea:hover{border-color:var(--ink-3);}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--maroon);box-shadow:0 0 0 3px rgba(178,58,84,.18);
}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);
  background-position:calc(100% - 18px) 1.15rem, calc(100% - 13px) 1.15rem;background-size:5px 5px;background-repeat:no-repeat;padding-right:2.2rem;}
form .btn{grid-column:1 / -1;justify-self:start;margin-top:.4rem;}
.privacy{grid-column:1 / -1;font-size:.8rem;color:var(--ink-3);margin:.4rem 0 0;line-height:1.6;}

/* Footer */
.site-footer{border-top:1px solid var(--line);padding:var(--section) 0 3rem;}
.site-footer .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:2.5rem;margin-bottom:3rem;}
.site-footer h3{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;}
.site-footer p{font-size:.9rem;color:var(--ink-2);line-height:1.7;margin:0 0 .8rem;}
.site-footer .bio{font-family:var(--serif);max-width:44ch;}
.site-footer address{font-style:normal;font-size:.9rem;color:var(--ink-2);line-height:1.8;}
.site-footer address a{color:var(--ink-2);}
.site-footer address a:hover{color:var(--gold);}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer ul li{padding:.28rem 0;}
.site-footer ul a{font-size:.9rem;color:var(--ink-2);transition:color .18s;}
.site-footer ul a:hover{color:var(--gold);}
.legal{border-top:1px solid var(--line);padding-top:1.5rem;font-size:.78rem;color:var(--ink-3);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;}

/* ---------------- Motion ----------------
   Content is visible by default. The .js class is added by script.js, and only
   then do elements opt in to starting hidden. If JavaScript never runs, every
   word on this page is still rendered and readable.
   ------------------------------------------------------------------------- */
.js .reveal{opacity:0;transform:translateY(14px);}
.js .reveal.in{opacity:1;transform:none;transition:opacity .45s var(--ease), transform .45s var(--ease);}
.js .reveal.in[data-delay="1"]{transition-delay:.07s;}
.js .reveal.in[data-delay="2"]{transition-delay:.14s;}
.js .reveal.in[data-delay="3"]{transition-delay:.21s;}
.js .reveal.in[data-delay="4"]{transition-delay:.28s;}

.js .hero-stage > *{animation:rise .6s var(--ease) backwards;}
.js .hero-stage > *:nth-child(2){animation-delay:.09s;}
.js .hero-stage > *:nth-child(3){animation-delay:.18s;}
.js .hero-stage > *:nth-child(4){animation-delay:.27s;}
@keyframes rise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .js .reveal{opacity:1;transform:none;}
  .js .hero-stage > *{animation:none;}
  *,*::before,*::after{transition:none!important;animation:none!important;}
}

/* ---------------- Responsive ---------------- */
@media (max-width:900px){
  .quote .grid{grid-template-columns:1fr;}
  .factors article{grid-template-columns:1fr;gap:.75rem;}
  .site-footer .cols{grid-template-columns:1fr;gap:2rem;}
}
@media (max-width:700px){
  .nav a:not(.tel){display:none;}
  .hero .acts{gap:.6rem;}
  .hero .acts .tel-note{margin-left:0;width:100%;}
  form{grid-template-columns:1fr;}
  .process article{grid-template-columns:2.5rem 1fr;gap:1rem;}
}
@media print{
  .site-header,.quote form,.btn,.btn-ghost{display:none;}
  body{background:#fff;color:#000;}
}