/* ========================================================
   Zimmer's Embershield — theme layer on top of Bootstrap 5
   ======================================================== */
:root{
  --paper:#FBFAF6;
  --paper-2:#F4F2EC;
  --ink:#16231D;
  --ink-soft:#25382F;
  --muted:#5E6E67;
  --muted-2:#889690;
  --line:#E4E1D8;
  --line-2:#D6D2C6;
  --accent:#0F6B54;
  --accent-2:#12836A;
  --accent-deep:#0C4E3E;
  --accent-tint:#EAF2EE;
  --accent-tint-2:#DFEBE5;
  --gold:#C08A2E;
  --red: #8A171A;
  --shadow-sm:0 1px 3px rgba(22,35,29,.07), 0 8px 20px -14px rgba(22,35,29,.18);
  --shadow:0 20px 44px -24px rgba(22,35,29,.32);
  --shadow-lg:0 34px 70px -30px rgba(22,35,29,.38);
  --serif:'Libre Baskerville', Georgia, 'Times New Roman', serif;

  /* Re-point Bootstrap's own theme variables at our palette */
  --bs-primary: var(--accent);
  --bs-primary-rgb: 15,107,84;
  --bs-body-font-family: 'Open Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --bs-body-color: var(--ink);
  --bs-body-bg: var(--paper);
  --bs-link-color: var(--accent);
  --bs-link-hover-color: var(--accent-2);
  --bs-border-color: var(--line);
  --bs-border-radius: 8px;
}

html{scroll-behavior:smooth}
body{font-size:16.5px; line-height:1.65; -webkit-font-smoothing:antialiased}
p:not(.bigprice):not(.lbl){font-size:1.1rem !important}
h1,h2,h3,h4,.serif{font-family:var(--serif); font-weight:600; line-height:1.14; letter-spacing:-.015em; color:var(--ink)}
h1{font-weight:500}
::selection{background:var(--accent); color:#fff}
section{scroll-margin-top:96px}

.eyebrow{
  font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:var(--accent); display:inline-flex; align-items:center; gap:.5rem;
}

.sec{padding:clamp(3.6rem,8vw,6.4rem) 0}
.sec-head{max-width:62ch}
.sec-head h2{font-size:clamp(1.9rem,3.5vw,2.85rem); margin:.9rem 0 1rem}

/* ---------- buttons ---------- */
.btn{
  border-radius:8px !important; font-family:'Open Sans',sans-serif; font-weight:600; font-size:1rem !important; letter-spacing:.005em;
  background-color:#D4AF37 !important; border-color:#D4AF37 !important; color:#16231D !important;
  position:relative; z-index:0; overflow:hidden;
  transition:color .3s ease, border-color .3s ease;
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1; background:#8A171A;
  opacity:0; transition:opacity .4s ease;
}
.btn:hover{border-color:#8A171A !important; color:#fff !important}
.btn:hover::before{opacity:1}
.btn .arw{transition:transform .18s ease}
.btn:hover .arw{transform:translateX(3px)}
.btn-primary{box-shadow:0 12px 26px -14px rgba(150,150,150,.75)}

/* ---------- top utility bar ---------- */
.topbar{background:var(--red); color:#fff; font-size:1rem}
.topbar a{color:#fff; transition:color .16s; text-decoration:none}
.topbar a:hover, .topbar a:hover strong{color:#D4AF37}
.topbar strong{color:#fff; font-weight:600}

/* ---------- header / navbar ---------- */
.site-header{
  position:sticky; top:0; z-index:1030;
  background:rgba(251,250,246,.9);
  backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid var(--line);
  transition:background .3s ease, box-shadow .3s ease;
}
.site-header .navbar-brand img{display:flex; align-items:left; max-width:300px; gap:.7rem; transition:max-width .3s ease}
.site-header .navbar{transition:padding .3s ease}
.site-header.scrolled .navbar{padding-top:.5rem !important; padding-bottom:.5rem !important}
.site-header.scrolled .navbar-brand img{max-width:170px}

.site-header .brand-text b{font-family:var(--serif); font-size:1.16rem; font-weight:600; letter-spacing:-.01em; display:block; line-height:1.1; color:var(--ink)}
.site-header .brand-text small{font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted-2); font-weight:700}
.site-header .nav-link{font-size:1.025em; color:black; border-bottom:1.5px solid transparent; transition:color .16s,border-color .16s}
.site-header .nav-link:hover, .site-header .nav-link.active{color:var(--ink); border-color:var(--accent)}
.site-header .login-link{font-size:.86rem; font-weight:600; color:var(--ink)}
.site-header .login-link:hover{color:var(--accent)}

/* ---------- hero ---------- */
.hero{border-bottom:1px solid var(--accent-deep); color:#E9F3EE; overflow:hidden}
.hero .eyebrow{color:#E8CE7A}
.hero .eyebrow::before{background:#E8CE7A}
.hero h1{font-size:clamp(2.35rem,4.9vw,3.9rem); margin:1.05rem 0 1.15rem; max-width:17ch; color:#fff}
.hero h1 em{font-style:italic; color:#E8CE7A}
.hero .hero-text p:not(.eyebrow){max-width:46ch; color:#F0E6C8}
.microtrust{display:flex; flex-wrap:wrap; gap:1.4rem; margin-top:2.4rem; padding-top:1.7rem; border-top:1px solid rgba(255,255,255,.18)}
.microtrust div{display:flex; gap:.6rem; align-items:center; font-size:.84rem; color:#C9DCD4}
.microtrust svg{flex:none; color:#9DC3B6}
.microtrust b{color:#fff; font-weight:600}

.frame{
  border-radius:8px; overflow:hidden; background:var(--accent-tint-2);
  border:1px solid var(--line); box-shadow:var(--shadow);
}

/* ---------- hero split layout ---------- */
.hero{position:relative; background:var(--accent-deep)}
.hero-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(to right, rgba(0,0,0,.9) 0%, rgba(0,0,0,.7) 35%, rgba(0,0,0,0) 100%);
}
.hero-grid{
  position:relative; z-index:1; display:flex; align-items:center;
  min-height:max(460px, calc(100svh - var(--hero-top, 150px)));
  padding-top:clamp(2.5rem,5vw,4rem); padding-bottom:clamp(2.5rem,5vw,4rem);
}
.hero-text{max-width:620px}

/* ---------- form controls ---------- */
.form-label{font-size:.9rem; letter-spacing:.09em; text-transform:uppercase; font-weight:700; color:var(--muted)}
.form-control, .form-select{
  border:1.5px solid var(--line-2); border-radius:8px; padding:.75rem .85rem; font-size:.94rem; color:var(--ink);
}
.form-control:focus, .form-select:focus{
  border-color:var(--accent-2); box-shadow:0 0 0 3.5px rgba(18,131,106,.16);
}
legend.form-label{float:none; width:auto; margin-bottom:.5rem}
.type-error{display:none; margin-top:.4rem; font-size:.875em; color:#dc3545}
.type-error.show{display:block}
.form-check-input{width:1.1em; height:1.1em; accent-color:var(--accent)}
.form-check-input:checked{background-color:var(--accent); border-color:var(--accent)}

/* ---------- trust strip ---------- */
.trustband{background:#fff; border-bottom:1px solid var(--line)}
.trustband .wrap-flex{display:flex; flex-wrap:wrap; align-items:center; gap:1.6rem 2.6rem; padding:1.35rem 0}
.trustband .tag{font-size:.8rem; font-weight:600; letter-spacing:.05em; color:var(--muted-2); text-transform:uppercase}
.trustband .item{display:flex; align-items:center; gap:.55rem; color:var(--muted); font-size:.86rem; font-weight:500}
.trustband .item svg{color:var(--gold)}

/* ---------- how it works ---------- */
.tint{background:var(--paper-2)}
.step-card{
  background:#fff; border:1px solid var(--line); border-radius:8px;
  padding:2rem 1.8rem 1.9rem; height:100%; box-shadow:var(--shadow-sm);
}
.step-card .n{
  width:40px; height:59px; display:grid; place-items:center; padding-bottom:6px;
  font-family:'Open Sans',sans-serif; font-size:1.1rem; font-weight:600;
  background:var(--accent-tint); color:var(--accent);
  clip-path:path('M20 0 L40 9.84 L40 29.5 C40 43.92 31.72 55.06 20 59 C8.28 55.06 0 43.92 0 29.5 L0 9.84 Z');
  margin-bottom:1.15rem;
}
.step-card h3{font-size:1.5rem; margin-bottom:.5rem}
.step-card p{font-size:.93rem; color:#000}
.step-card .meta{margin-top:1.1rem; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent)}

#how{background:linear-gradient(to bottom, var(--red), #601011); position:relative; overflow:hidden}
#how::before{
  content:""; position:absolute; inset:0; opacity:var(--phoenix-opacity, .6); pointer-events:none;
  background:url("../../images/phoenix.png") center bottom / auto 100% no-repeat;
}
#how > .container{position:relative}
#how .eyebrow{color:#fff}
#how .eyebrow::before{background:#fff}
#how .sec-head h2, #how .sec-head p{color:#fff}
#how .step-card .n{background:#D4AF37; color:#16231D; padding-top:8px;}
#how .step-card .meta{color:#A8841C}


/* ---------- coverage callouts ---------- */
#coverage{background:#FBFAF6}
#coverage .eyebrow{color:#000}
#coverage .eyebrow::before{background:#000}
.coverage-intro h2{font-size:clamp(1.9rem,3.2vw,2.6rem); margin:.9rem 0 1.2rem; color:#8A171A}
.coverage-intro p:not(.eyebrow){color:#000}
.cover-card{
  display:flex; flex-direction:column; height:100%; padding:2rem 1.7rem 1.8rem;
  background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow-sm);
  text-decoration:none; color:inherit;
  transition:transform .25s ease, box-shadow .25s ease;
  position:relative;
}
.cover-card:hover{transform:translateY(-5px); box-shadow:var(--shadow), 0 0 26px rgba(212,175,55,.3); color:inherit}

/* gold hairline that draws itself around the card on hover */
@property --draw{syntax:'<angle>'; inherits:false; initial-value:0deg}
.cover-card::before{
  content:""; position:absolute; inset:-1px; border-radius:8px; padding:2px; pointer-events:none;
  background:conic-gradient(from 0deg, #D4AF37 var(--draw), transparent var(--draw));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  transition:--draw .9s ease;
}
.cover-card:hover::before{--draw:360deg}

.cover-icon{
  width:51px; height:75px; display:grid; place-items:center; padding-bottom:8px; margin-bottom:1.2rem;
  background:var(--accent-tint); color:var(--accent);
  clip-path:path('M25.5 0 L51 12.5 L51 37.5 C51 55.83 40.44 70 25.5 75 C10.56 70 0 55.83 0 37.5 L0 12.5 Z');
}
.cover-card h3{font-size:1.3rem; margin-bottom:.6rem}
.cover-card p{color:#000; flex:1}
.cover-link{margin-top:1.1rem; padding-top:1.1rem; border-top:1px solid var(--line); font-weight:700; color:var(--red)}
.cover-link .arw{display:inline-block; transition:transform .2s ease}
.cover-card:hover .cover-link .arw{transform:translateX(4px)}

/* ---------- about ---------- */
.about-heading{font-size:clamp(1.9rem,3.2vw,2.6rem); margin:.9rem 0 1.2rem}
.about-img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:8px; box-shadow:var(--shadow); display:block}


/* ---------- testimonials ---------- */
#testimonials, section.why-us{background:#363333; position:relative}
#testimonials::before, section.why-us::before{
  content:""; position:absolute; inset:0; opacity:.09; pointer-events:none;
  background:url("../../images/stone-wall-tile.png") repeat;
}
#testimonials > .container, section.why-us > .container{position:relative}
#testimonials .eyebrow, .why-us .eyebrow{color:#C9DCD4}
#testimonials .eyebrow::before, .why-us .eyebrow::before{background:#C9DCD4}
#testimonials .sec-head h2, .why-us h2, .why-us p:not(.eyebrow){color:#fff}
.quote-card{background:#fff; border:1px solid var(--line); border-radius:8px; padding:1.9rem 1.7rem; display:flex; flex-direction:column; height:100%; box-shadow:var(--shadow-sm)}
.stars{display:flex; gap:.2rem; color:var(--gold); margin-bottom:1rem}
.quote-card p.text{font-size:1.02rem; line-height:1.55; color:var(--ink-soft); flex:1}
.quote-card footer{display:flex; align-items:center; gap:.8rem; margin-top:1.5rem; padding-top:1.3rem; border-top:1px solid var(--line)}
.avatar{
  width:42px;height:42px;border-radius:50%; flex:none;
  background:var(--accent-tint); border:1px solid var(--accent-tint-2);
  display:grid; place-items:center; font-family:var(--serif); font-weight:600; font-size:.95rem; color:var(--accent);
}
.quote-card footer b{display:block; font-size:.9rem; font-weight:600}
.quote-card footer span{font-size:.78rem; color:var(--muted-2)}
.chip{
  display:inline-block; font-size:.68rem; letter-spacing:.09em; text-transform:uppercase; font-weight:700;
  color:var(--accent); background:var(--accent-tint); border-radius:8px; padding:.22rem .6rem; margin-top:.7rem; width:fit-content;
}

/* ---------- FAQ accordion ---------- */
.faq-accordion .accordion-item{background:transparent; border:0; border-bottom:1px solid var(--line)}
.faq-accordion .accordion-button{
  font-family:var(--serif); font-size:1.08rem; font-weight:600; color:var(--ink);
  background:transparent; padding:1.25rem .2rem; box-shadow:none;
}
.faq-accordion .accordion-button:focus{box-shadow:none}
.faq-accordion .accordion-button:not(.collapsed){color:var(--ink); background:transparent}
.faq-accordion .accordion-button::after{filter:none}
.faq-accordion .accordion-body{padding:0 3rem 1.4rem .2rem; font-size:.95rem; color:#000}

/* ---------- quote section ---------- */
.quote-panel{
  background:#fff; border:1px solid var(--line); border-radius:8px;
  padding:clamp(1.8rem,4.5vw,3.2rem); box-shadow:var(--shadow);
}
.quote-aside .mini-list{list-style:none; padding:0; margin:1.7rem 0 0; display:grid; gap:.85rem; font-size:.92rem; color:#000}
.quote-aside .mini-list li{display:flex; gap:.65rem; align-items:flex-start}
.quote-aside .mini-list svg{flex:none; margin-top:.28rem; color:var(--accent)}
.contact-block{
  margin-top:2rem; padding:1.15rem 1.25rem; border-radius:8px;
  background:var(--accent-tint); border:1px solid var(--accent-tint-2); font-size:.88rem; color:var(--accent-deep);
}
.contact-block b{font-family:var(--serif); font-size:1.1rem; display:block; margin-bottom:.15rem}
.form-status{
  display:none; margin-top:.4rem; padding:1.05rem 1.2rem; border-radius:8px;
  background:var(--accent-tint); border:1px solid var(--accent-tint-2);
  color:var(--accent-deep); font-size:.92rem;
}
.form-status.show{display:block}
.form-status b{font-family:var(--serif); font-size:1.05rem}

/* ---------- footer ---------- */
footer.site{background:var(--paper-2); border-top:1px solid var(--line); padding:clamp(3rem,6vw,4.4rem) 0 1.8rem}
footer.site h4{font-size:1rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2); font-weight:700; margin-bottom:1.1rem}
footer.site ul{list-style:none; padding:0; margin:0; display:grid; gap:.62rem}
footer.site ul a{font-size:1rem; color:var(--muted); text-decoration:none}
footer.site ul a:hover{color:var(--accent)}
footer.site .foot-about p{font-size:.9rem; color:var(--muted); margin-top:1rem; max-width:34ch}
.foot-base{
  margin-top:2.7rem; padding-top:1.4rem; border-top:1px solid var(--line-2);
  display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;
  font-size:.78rem; color:var(--muted-2);
}
.foot-base .legal{max-width:56ch}
.foot-base .foot-credit{margin-left:auto; text-align:right}
.foot-credit a{color:#fff; text-decoration:none}
.badges{display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1.1rem}
.badges span{
  font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--line-2); border-radius:8px; padding:.3rem .55rem; color:var(--muted);
  background:#fff;
}

/* red footer with white text */
footer.site{background:#8A171A; border-top:0; color:#fff}
footer.site h4, footer.site p, footer.site small, footer.site .brand-text b,
footer.site ul a, footer.site .foot-base{color:#fff !important}
footer.site ul a:hover{color:#D4AF37 !important}
footer.site .foot-base{border-top-color:rgba(255,255,255,.3)}
footer.site .badges span{background:transparent; border-color:rgba(255,255,255,.45); color:#fff}

@media (max-width:767.98px){
  body{font-size:16px}
}
@media (prefers-reduced-motion:reduce){
  *{transition-duration:.001ms !important; animation:none !important}
  html{scroll-behavior:auto}
}

/* ---------- inner page banner ---------- */
.page-banner{position:relative; overflow:hidden; background:#000; color:#fff; display:flex; align-items:center; min-height:320px}
@media (min-width:768px){.page-banner{height:450px; min-height:0}}
.page-banner-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.page-banner-overlay{
  position:absolute; inset:0;
  background:linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,.88) 40%, rgba(0,0,0,.15) 100%);
}
.page-banner-inner{position:relative; padding-top:2.5rem; padding-bottom:2.5rem}
.page-banner .eyebrow{color:#D4AF37}
.page-banner .eyebrow::before{background:#D4AF37}
.page-banner h1{color:#fff; font-size:clamp(2.1rem,4.4vw,3.3rem); margin:1rem 0; max-width:20ch}
.page-banner p:not(.eyebrow){color:#e6e6e6; max-width:52ch}

/* ---------- call-to-action band ---------- */
.cta-band{background:linear-gradient(rgba(0,0,0,.72), rgba(0,0,0,.72)), url("../../images/cta-banner.jpg") center / cover no-repeat, #000; color:#fff; padding:clamp(3.2rem,7vw,5rem) 0}
.cta-band h2{color:#fff; font-size:clamp(1.8rem,3.4vw,2.6rem); max-width:24ch; margin:0 auto 1rem}
.cta-band p{color:#d9d9d9; max-width:56ch; margin:0 auto 1.8rem}

/* ---------- team ---------- */
.team-role{color:var(--red); font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem !important; margin-bottom:.8rem}

/* ---------- contact ---------- */
.contact-list{list-style:none; padding:0; margin:1.6rem 0 0; display:grid; gap:1.3rem}
.contact-list li{display:flex; gap:1rem; align-items:flex-start}
.contact-icon{
  flex:none; width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  background:var(--red); color:#fff;
}
.contact-list b{display:block; font-family:var(--serif); font-size:1.05rem}
.contact-list a, .contact-list span{color:var(--ink); text-decoration:none}
.contact-list a:hover{color:var(--red)}


/* ---------- coverage panel (home page) ---------- */
.coverage-panel{display:flex; flex-direction:column; gap:.8rem}
.coverage-row{
  position:relative; color:inherit; text-decoration:none; display:flex; align-items:center; gap:1.1rem; padding:1.2rem 1.3rem;
  background:#FBFAF6; border:1px solid var(--line-2); border-radius:8px; overflow:hidden; box-shadow:var(--shadow-sm);
  transition:background .25s ease;
}
.coverage-row::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:#D4AF37;
  transform:scaleY(0); transform-origin:center; transition:transform .3s ease;
}
.coverage-row:hover{background:#F3EBD2}
.coverage-row:hover::before{transform:scaleY(1)}
.coverage-row .cover-icon{
  width:39px; height:57px; margin:0; padding-bottom:6px; flex:none;
  background:#D4AF37; color:#16231D;
  clip-path:path('M19.5 0 L39 9.5 L39 28.5 C39 42.43 30.92 53.2 19.5 57 C8.08 53.2 0 42.43 0 28.5 L0 9.5 Z');
}
.coverage-row h3{flex:1; margin:0; font-size:1.2rem; color:#000}
.coverage-arrow{
  flex:none; width:40px; height:40px; border-radius:50%; display:grid; place-items:center;
  background:#D4AF37; border:2px solid #000; color:#000; text-decoration:none;
  transition:background .25s ease, color .25s ease, transform .25s ease;
}
.coverage-row:hover .coverage-arrow{transform:translateX(4px)}

/* ---------- black outline on shield icons ---------- */
.cover-icon, .step-card .n{position:relative}
.cover-icon::before, .step-card .n::before{content:""; position:absolute; z-index:-1; background:var(--shield-fill)}
.cover-icon{--shield-fill:var(--accent-tint); background:#000}
.cover-icon::before{top:2px; left:2px; width:47px; height:71px; clip-path:path('M23.5 0 L47 11.84 L47 35.5 C47 52.85 37.27 66.26 23.5 71 C9.73 66.26 0 52.85 0 35.5 L0 11.84 Z')}
.coverage-row .cover-icon{--shield-fill:#D4AF37; background:#000}
.coverage-row .cover-icon::before{top:2px; left:2px; width:35px; height:53px; clip-path:path('M17.5 0 L35 8.84 L35 26.5 C35 39.45 27.75 49.46 17.5 53 C7.25 49.46 0 39.45 0 26.5 L0 8.84 Z')}
.step-card .n{--shield-fill:var(--accent-tint); background:#000}
.step-card .n::before{top:2px; left:2px; width:36px; height:55px; clip-path:path('M18 0 L36 9.17 L36 27.5 C36 40.94 28.54 51.33 18 55 C7.46 51.33 0 40.94 0 27.5 L0 9.17 Z')}
#how .step-card .n{--shield-fill:#D4AF37; background:#000}
#how .step-card .n::before{top:2px; left:2px; width:36px; height:55px; clip-path:path('M18 0 L36 9.17 L36 27.5 C36 40.94 28.54 51.33 18 55 C7.46 51.33 0 40.94 0 27.5 L0 9.17 Z')}

/* ---------- footer review prompt ---------- */
.review-stars{display:flex; gap:.25rem; color:#D4AF37; margin-bottom:.8rem}
footer.site .btn::before{background:#000}
footer.site .btn:hover{border-color:#000 !important}

/* ---------- footer column widths (large screens): 30 / 20 / 20 / 30 ---------- */
@media (min-width:992px){
  .foot-wide{flex:0 0 auto; width:30%}
  .foot-narrow{flex:0 0 auto; width:20%}
}

#how .btn::before{background:#000}
#how .btn:hover{border-color:#000 !important}

/* ---------- insurance page: shield beside content ---------- */
.cover-card.cover-card-side{flex-direction:row; align-items:flex-start; gap:1.4rem}
.cover-card-side .cover-icon{margin-bottom:0; flex:none}
.cover-card-side .cover-body{display:flex; flex-direction:column; flex:1; min-width:0; height:100%}
.cover-card-side .cover-body h3{margin-top:.2rem}
@media (max-width:575.98px){.cover-card.cover-card-side{flex-direction:column}}

/* ---------- how it works: hover movement ---------- */
.step-card{transition:transform .3s ease, box-shadow .3s ease}
.step-card:hover{transform:translateY(-8px); box-shadow:var(--shadow)}
.step-card .n{transition:transform .3s ease}
.step-card:hover .n{transform:scale(1.1) rotate(-4deg)}

/* ---------- white button variant, red text (yellow on hover) ---------- */
.btn.btn-white{background-color:#fff !important; border-color:#fff !important; color:#8A171A !important}
.btn.btn-white::before{background:#D4AF37}
.btn.btn-white:hover{border-color:#D4AF37 !important; color:#16231D !important}

/* ---------- nav: Insurance dropdown opens on hover ---------- */
@media (min-width:992px){
  .site-header .navbar .dropdown:hover > .dropdown-menu,
  .site-header .navbar .dropdown:focus-within > .dropdown-menu{display:block; margin-top:0}
}
@media (max-width:991.98px){
  .site-header .navbar .dropdown-toggle::after{display:none}
  .site-header .navbar .dropdown-menu{display:block; position:static; border:0; background:transparent; box-shadow:none; padding:0 0 0 1rem}

  /* slide-in mobile nav from the right */
  /* backdrop-filter would trap the fixed panel inside the header */
  .site-header{backdrop-filter:none; background:rgba(251,250,246,.97)}
  #mobileNav.offcanvas-end{width:min(85vw, 340px); background:var(--paper); z-index:1050}
  #mobileNav .offcanvas-body{padding:.5rem 1.5rem 2rem}
  #mobileNav .nav-link{font-size:1.25rem; padding:.7rem 0}
  #mobileNav .dropdown-item{font-size:1.1rem; padding:.5rem 0 .5rem .5rem; white-space:normal}
  #mobileNav .btn{font-size:1.05rem; padding:.7rem 1.4rem}
  /* dim the page behind the open menu (backdrop sits just under the sticky header) */
  .offcanvas-backdrop{z-index:1029}
  .offcanvas-backdrop.show{opacity:.6}
  body:has(#mobileNav.show) .site-header .navbar-brand,
  body:has(#mobileNav.show) .site-header .navbar-toggler{opacity:.4}
}

/* ---------- life insurance: DIME shields in gold ---------- */
.dime .step-card .n{--shield-fill:#D4AF37; color:#16231D}

/* ---------- check list (commercial page) ---------- */
.check-list{list-style:none; padding:0; margin:1.2rem 0 0; display:grid; gap:.7rem}
.check-list li{display:flex; gap:.7rem; align-items:flex-start; color:#000; font-size:1.05rem}
.check-list svg{flex:none; margin-top:.25rem; color:var(--accent)}

/* ---------- team profiles ---------- */
.team-name{font-size:clamp(1.6rem,2.6vw,2.1rem); margin:0 0 .3rem}
.team-bio{margin-top:1.4rem}
.team-phone{margin:0}
.team-phone a{display:inline-flex; align-items:center; gap:.45rem; font-weight:700; color:var(--red); text-decoration:none}
.team-phone a:hover{color:#000}

/* ---------- team portraits ---------- */
.team-portrait{
  position:relative; width:100%; max-width:400px; aspect-ratio:4/5; border-radius:8px; overflow:hidden;
  background:#D4AF37; color:#16231D; display:grid; place-items:center;
  font-family:var(--serif); font-size:4rem; font-weight:700; box-shadow:var(--shadow);
}
.team-portrait img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}

/* ---------- eyebrows sit close to the heading below ---------- */
p.eyebrow{margin-bottom:.25rem !important}
p.eyebrow + h1, p.eyebrow + h2, p.eyebrow + h3{margin-top:0 !important}

/* ---------- easter egg: phoenix rises in the footer's bottom-right corner ---------- */
footer.site{position:relative; overflow:hidden}
footer.site > .container{position:relative; z-index:1}
.phoenix-egg{
  position:absolute; right:clamp(.5rem,3vw,2.5rem); bottom:0; width:120px; aspect-ratio:945/1059; z-index:0; pointer-events:none;
  background:#D4AF37;
  -webkit-mask:url("../../images/phoenix.png") center / contain no-repeat;
  mask:url("../../images/phoenix.png") center / contain no-repeat;
  opacity:0; transform:translateY(60%) scale(.8); transition:opacity .7s ease, transform .9s cubic-bezier(.2,.8,.2,1);
}
footer.site.phoenix-on .phoenix-egg{opacity:.95; transform:translateY(-8%) scale(1)}
@media (max-width:991.98px), (hover:none), (pointer:coarse){
  .phoenix-egg{display:none}
}

/* ---------- parchment texture on the beige sections ---------- */
.sec, #coverage{
  background-image:
    radial-gradient(ellipse at center, transparent 58%, rgba(150,105,40,.075) 100%),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22900%22%20height%3D%22900%22%3E%3Cfilter%20id%3D%22s%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.006%22%20numOctaves%3D%222%22%20seed%3D%227%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%200.62%20%200%200%200%200%200.45%20%200%200%200%200%200.2%20%200.20%200%200%200%20-0.015%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url(%23s)%22%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22300%22%20height%3D%22300%22%3E%3Cfilter%20id%3D%22n%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.85%22%20numOctaves%3D%223%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%200.42%20%200%200%200%200%200.31%20%200%200%200%200%200.14%20%200.21%200%200%200%200%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url(%23n)%22%2F%3E%3C%2Fsvg%3E");
}

/* ---------- icon lists (home & auto page) ---------- */
.icon-list{list-style:none; padding:0; margin:2.2rem 0 0; display:grid; gap:1.8rem 3.5rem; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr))}
.icon-list li{display:flex; gap:1.3rem; align-items:flex-start}
.icon-list .cover-icon{margin:0; flex:none}
.icon-list h3{font-size:1.25rem; margin:.1rem 0 .3rem}
.icon-list p{margin:0; color:#000}
#coverage-types .icon-list{grid-template-columns:1fr; gap:1.6rem}
.dime .cover-icon{--shield-fill:#D4AF37; color:#16231D; font-family:var(--serif); font-size:1.7rem; font-weight:700}
.dime .icon-list{grid-template-columns:1fr; margin-top:0; gap:1.6rem}
.icon-list p + p{margin-top:.7rem}
#specialty-coverage .icon-list{grid-template-columns:1fr}
@media (max-width:767.98px){#specialty-coverage .icon-list{grid-template-columns:1fr}}
#specialty-coverage .icon-list{row-gap:3.5rem}
#specialty-coverage .sec-head{max-width:none}
#focus .icon-list{grid-template-columns:1fr; max-width:900px; gap:2.4rem}
#focus .sec-head{max-width:none}

/* ---------- contact map ---------- */
.map-frame{border-radius:8px; overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line-2); line-height:0}
.map-frame iframe{width:100%; height:460px; border:0}
@media (max-width:767.98px){.map-frame iframe{height:340px}}
.site-header.scrolled{background:#fff; backdrop-filter:none; box-shadow:0 4px 18px -10px rgba(22,35,29,.35)}

/* ---------- tap-to-call links (request page) ---------- */
.contact-block .call-hours{display:block; font-size:.9rem; color:#000; margin-bottom:.9rem}
.call-links{display:grid; gap:.7rem}
.call-link{
  display:flex; align-items:center; gap:.9rem; padding:.75rem 1rem;
  background:#fff; border:1px solid var(--line-2); border-radius:8px; text-decoration:none; color:#000;
  box-shadow:var(--shadow-sm); transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.call-icon{flex:none; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--red); color:#fff; transition:background .2s ease, color .2s ease}
.call-text{display:flex; flex-direction:column; line-height:1.2}
.call-text small{font-size:.72rem; letter-spacing:.09em; text-transform:uppercase; font-weight:700; color:var(--muted)}
.call-text strong{font-family:'Open Sans',sans-serif; font-size:1.2rem; font-weight:700}
.call-link:hover{transform:translateY(-2px); border-color:#D4AF37; box-shadow:var(--shadow); color:#000}
.call-link:hover .call-icon{background:#D4AF37; color:#16231D}
.foot-credit a{transition:color .16s}
.foot-credit a:hover{color:#D4AF37}

/* ---------- page content softly fades up on load ---------- */
@keyframes pageFadeUp{
  from{opacity:0; transform:translateY(18px)}
  to{opacity:1; transform:none}
}
main{animation:pageFadeUp .9s cubic-bezier(.2,.7,.2,1) both}

/* ---------- privacy policy table ---------- */
.privacy-policy .table-wrap,
.privacy-policy table{width:100%}
.privacy-policy table{
  border-collapse:separate; border-spacing:0;
  margin:1.5rem 0; font-size:.95rem; line-height:1.55;
  background:#fff; border:1px solid var(--line); border-radius:10px;
  box-shadow:var(--shadow-sm); overflow:hidden;
}
.privacy-policy th,
.privacy-policy td{padding:.85rem 1rem; text-align:left; vertical-align:top; border-bottom:1px solid var(--line)}
.privacy-policy thead th{
  background:var(--accent-deep); color:#fff;
  font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  border-bottom:0;
}
.privacy-policy tbody tr:nth-child(even){background:var(--paper-2)}
.privacy-policy tbody tr:hover{background:var(--accent-tint)}
.privacy-policy tbody tr:last-child td{border-bottom:0}
.privacy-policy tbody td:first-child{font-weight:600; color:var(--ink)}
.privacy-policy td{color:var(--ink-soft)}

@media (max-width:767.98px){
  .privacy-policy table,
  .privacy-policy tbody,
  .privacy-policy tr,
  .privacy-policy td{display:block; width:100%}
  .privacy-policy thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
  .privacy-policy table{background:none; border:0; box-shadow:none; border-radius:0}
  .privacy-policy tbody tr{
    margin-bottom:1rem; background:#fff !important;
    border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow-sm); overflow:hidden;
  }
  .privacy-policy tbody td{padding:.65rem 1rem; border-bottom:1px solid var(--line)}
  .privacy-policy tbody td:last-child{border-bottom:0}
  .privacy-policy tbody td:first-child{background:var(--accent-deep); color:#fff}
  .privacy-policy tbody td::before{
    content:attr(data-label); display:block; margin-bottom:.15rem;
    font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);
  }
  .privacy-policy tbody td:first-child::before{display:none}
}

/* ---------- privacy policy in-line links ---------- */
.privacy-policy a:not(.btn){color:var(--red); text-decoration:none}
.privacy-policy a:not(.btn):hover,
.privacy-policy a:not(.btn):focus{color:var(--red); text-decoration:none}

/* ---------- privacy policy spacing ---------- */
.privacy-policy{line-height:1.75}
.privacy-policy h3{margin:2.5rem 0 1rem; padding-top:1.5rem; border-top:1px solid var(--line)}
.privacy-policy h3:first-of-type{margin-top:2rem}
.privacy-policy h4{margin:1.75rem 0 .75rem}
.privacy-policy p{margin-bottom:1.1rem}
.privacy-policy ul,
.privacy-policy ol{margin:0 0 1.5rem; padding-left:1.5rem}
.privacy-policy li{margin-bottom:.6rem; padding-left:.25rem}
.privacy-policy li:last-child{margin-bottom:0}
.privacy-policy .pp-updated{margin-bottom:2rem}

/* ---------- tablet & below (max 992px) ---------- */
@media (max-width:992px){
  .topbar .container > div:first-child{display:none !important}
  .topbar .container{justify-content:flex-end !important}
  .hero-grid{min-height:0; height:600px}
}

/* ---------- footer at tablet & below: only the review column ---------- */
@media (max-width:992px){
  .foot-grid > div:not(:last-child){display:none !important}
  .foot-grid > div:last-child{flex:0 0 auto; width:100%; text-align:left}
}

/* ---------- secondary page banner at tablet & below ---------- */
@media (max-width:992px){
  .page-banner{height:auto; min-height:400px; max-height:500px}
  .page-banner-inner{padding-top:1.5rem; padding-bottom:1.5rem}
}

/* ---------- insurance page "Why Zimmer's": 50/50 side by side at tablet & below ---------- */
@media (max-width:992px){
  .why-us .row{flex-wrap:nowrap}
  .why-us .row > div:first-child{flex:0 0 auto; width:50%}
  .why-us .row > div:last-child{flex:0 0 auto; width:50%}
  .why-us .about-img{width:100%; height:auto; aspect-ratio:3/4}
}

/* ---------- specialties intro: a bit wider at tablet & below ---------- */
@media (max-width:992px){
  #specialty-intro .sec-head{max-width:70ch}
}

/* ---------- team page: portrait beside bio at tablet & below ---------- */
@media (max-width:992px){
  #matthew .row,
  #jonathon .row{flex-wrap:nowrap}
  #matthew .row > div:first-child,
  #jonathon .row > div:first-child{flex:0 0 auto; width:35%}
  #matthew .row > div:last-child,
  #jonathon .row > div:last-child{flex:0 0 auto; width:65%}
}

/* ---------- footer centered on mobile ---------- */
@media (max-width:767px){
  footer.site .foot-grid > div:last-child{text-align:center}
  footer.site .review-stars{justify-content:center}
  footer.site .foot-base{flex-direction:column; align-items:center; justify-content:center; text-align:center}
  footer.site .foot-base .legal{max-width:none}
  footer.site .foot-base .foot-credit{margin-left:0; text-align:center}
}

/* ---------- smaller logo on mobile ---------- */
@media (max-width:767px){
  .site-header .navbar-brand img{max-width:200px}
  .site-header.scrolled .navbar-brand img{max-width:150px}
}

/* ---------- home hero height on mobile ---------- */
@media (max-width:767px){
  .hero-grid{height:400px}
}

/* ---------- secondary banners on mobile ---------- */
@media (max-width:767px){
  .page-banner{height:300px; min-height:0; max-height:300px}
}

/* ---------- specialties intro full width on mobile ---------- */
@media (max-width:767px){
  #specialty-intro .sec-head{max-width:none}
}

/* ---------- a little more side padding on the smallest screens ---------- */
@media (max-width:575.98px){
  .container{--bs-gutter-x:2.5rem}
}

/* ---------- insurance "Why Zimmer's": stack full width on the smallest screens ---------- */
@media (max-width:575.98px){
  .why-us .row{flex-wrap:wrap}
  .why-us .row > div:first-child,
  .why-us .row > div:last-child{width:100%}
  .why-us .about-img{aspect-ratio:4/3}
}

/* ---------- team bios: stack full width on the smallest screens ---------- */
@media (max-width:575.98px){
  #matthew .row,
  #jonathon .row{flex-wrap:wrap}
  #matthew .row > div:first-child,
  #matthew .row > div:last-child,
  #jonathon .row > div:first-child,
  #jonathon .row > div:last-child{width:100%}
}

/* ---------- quote form error message ---------- */
.form-status.error{border-color:var(--red); color:var(--red)}
.form-status.error a{color:var(--red); text-decoration:underline}
.form-status.error{background:#FBEDED}

/* ---------- disabled buttons (quote form until consent is checked) ---------- */
.btn:disabled, .btn.disabled{opacity:.45; cursor:not-allowed; pointer-events:none}