:root{
  --paper:#F5F3EC;
  --paper-dim:#EDEADF;
  --paper-dim-new:#edeadfb7;
  --ink:#171F1A;
  --sage:#4E6E4C;
  --sage-deep:#38512F;
  --mint:#E4E9D9;
  --accent:#0a2402;
  --accent-deep:#0d2506;
  --line:#D7D1BF;
  --white:#FFFFFF;
  --radius:2px;
  --danger: #ef4444;
  --primary-light: #4E6E4C;
}

*{margin:0;padding:0;box-sizing:border-box;}

html{scroll-behavior:smooth;}

::view-transition-old(root),
::view-transition-new(root){
  animation-duration:.35s;
  animation-timing-function:cubic-bezier(.4,0,.2,1);
}

body{ overflow-anchor:none; }

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

body{
  font-family:'Inter',sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.5;
  font-size:16px;
}

h1,h2,h3,.brand{
  font-family:'Archivo',sans-serif;
  font-weight:800;
  letter-spacing:-0.01em;
  line-height:1.08;
  color:var(--ink);
}

a{color:inherit; text-decoration:none;}

img,svg{display:block; max-width:100%;}

.wrap{
  max-width:1160px;
  margin:0 auto;
  padding:0 32px;
}

section{ padding:96px 0; }

@media (max-width:720px){
  section{ padding:64px 0; }
  .wrap{ padding:0 20px; }
}

/*  Buttons  */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-family:'Inter',sans-serif;
  font-weight:600;
  font-size:15px;
  padding:14px 24px;
  border:2px solid var(--ink);
  border-radius:var(--radius);
  cursor:pointer;
  background:none;
  transition:background-color .15s ease, color .15s ease, border-color .15s ease, transform .12s ease;
  position:relative;
}
.btn-primary{
  background:var(--accent);
  color:var(--white);
  border-color:var(--accent);
}
.btn-primary:hover{ background:var(--accent-deep); border-color:var(--accent-deep); }

#quote-btn-spinner {
    display: inline-block;
    width: 1em;
    height: 1em;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: var(--white);
    border-radius: 50%;
    opacity: 0;
    visibility: hidden;
    margin-left: 0;
    transition: opacity 0.25s ease, margin-left 0.25s ease, visibility 0s linear 0.25s;
}

#quote-btn-spinner.is-active {
    opacity: 1;
    visibility: visible;
    margin-left: 0.5rem;
    animation: spin 0.6s linear infinite;
    transition: opacity 0.25s ease, margin-left 0.25s ease, visibility 0s linear 0s;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes flash-error-anim {
    0%, 100% { box-shadow: none; }
    50% { box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.4); }
}
.flash-error { animation: flash-error-anim 0.4s ease 2; }

.btn-ghost{
  background:transparent;
  color:var(--ink);
  border-color:var(--ink);
}
.btn-ghost:hover{ background:var(--ink); color:var(--paper); }
.btn:active{ transform:translateY(1px); }
.btn:focus-visible{ outline:3px solid var(--accent); outline-offset:3px; }
.btn:hover{ transform:translateY(-2px); }

/* offset tag block — a flat, hard-edged alternative to a drop shadow */
.stamped{ position:relative; }
.stamped::after{
  content:"";
  position:absolute;
  top:8px; left:8px;
  right:-8px; bottom:-8px;
  background:var(--sage);
  z-index:-1;
  border-radius:var(--radius);
  transition:background-color .18s ease;
}

/*  Scroll reveal  */
@keyframes revealIn{
  from{ opacity:0; transform:translateY(28px) scale(.99); filter:blur(4px); }
  to{ opacity:1; transform:translateY(0) scale(1); filter:blur(0); }
}

.reveal,
.reveal-stagger > *{
  opacity:0;
  transform:translateY(28px) scale(.99);
  filter:blur(4px);
}
.reveal.is-visible{
  animation:revealIn 1.2s cubic-bezier(.22,1,.36,1) forwards;
}
.reveal-stagger.is-visible > *{
  animation:revealIn 1.2s cubic-bezier(.22,1,.36,1) forwards;
  will-change: transform, opacity, filter;
}
.reveal-stagger.is-visible > *:nth-child(1){ animation-delay:.08s; }
.reveal-stagger.is-visible > *:nth-child(2){ animation-delay:.2s; }
.reveal-stagger.is-visible > *:nth-child(3){ animation-delay:.32s; }
.reveal-stagger.is-visible > *:nth-child(4){ animation-delay:.44s; }
.reveal-stagger.is-visible > *:nth-child(5){ animation-delay:.56s; }
.reveal-stagger.is-visible > *:nth-child(6){ animation-delay:.68s; }

@media (prefers-reduced-motion: reduce){
  .reveal,
  .reveal-stagger > *{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
  }
}

/*  Global form modal  */
.fm-overlay{
  position:fixed;
  inset:0;
  background:rgba(23,31,26,.45);
  backdrop-filter:blur(3px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  z-index:1000;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.fm-overlay.active{
  opacity:1;
  pointer-events:all;
}

.fm-modal{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  max-width:420px;
  width:100%;
  padding:40px 32px 32px;
  text-align:center;
  position:relative;
  box-shadow:0 24px 60px rgba(23,31,26,.28);
  transform:translateY(18px) scale(.97);
  opacity:0;
  transition:transform .3s cubic-bezier(.16,1,.3,1), opacity .25s ease;
}
.fm-overlay.active .fm-modal{
  transform:translateY(0) scale(1);
  opacity:1;
}

.fm-icon{
  width:56px; height:56px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 20px;
}
.fm-modal.fm-success .fm-icon{
  background:var(--mint);
  color:var(--sage-deep);
}
.fm-modal.fm-error .fm-icon{
  background:#F3DEDA;
  color:#8A3B2E;
}
.fm-modal.fm-throttle .fm-icon{
  background:#F5E6C8;
  color:#8A6215;
}

.fm-modal h3{
  font-size:21px;
  margin-bottom:10px;
}
.fm-modal p{
  font-size:14.5px;
  color:#3B453D;
  max-width:34ch;
  margin:0 auto 26px;
}

.fm-actions{
  display:flex;
  gap:10px;
  justify-content:center;
}
.fm-actions .btn{
  padding:12px 22px;
}

.fm-close{
  position:absolute;
  top:14px; right:14px;
  width:32px; height:32px;
  border-radius:50%;
  border:none;
  background:transparent;
  color:#6B7568;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background-color .18s ease, color .18s ease;
}
.fm-close:hover{
  background:var(--paper-dim);
  color:var(--ink);
}

@media (max-width:480px){
  .fm-modal{ padding:32px 24px 26px; }
}