:root{--ruby:#9d1115;--ink:#111;--muted:#5e5e5e;--line:#ececec;--bg:#fff}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font:16px/1.65 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial;color:var(--ink);background:var(--bg)}
a{color:var(--ink);text-decoration:none}a:hover{color:var(--ruby)}
.container{max-width:1200px;margin:0 auto;padding:36px 22px}
.section{padding:56px 0}
.h1{font-size:48px;line-height:1.08;font-weight:900;margin:0 0 10px}
.h2{font-size:30px;font-weight:800;margin:0 0 12px}
p{font-size:17px}
.header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:100}
.navwrap{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:28px;padding:14px 22px}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.brand img{height:60px;width:auto}
.brand .name{font-size:28px;letter-spacing:.6px;font-weight:900;color:#8e0f14}
.navlinks{display:flex;gap:28px;align-items:center}
.navlinks a{font-weight:800}
.btn{background:var(--ruby);color:#fff;font-weight:800;padding:10px 16px;border-radius:12px}
.btn.outline{background:#fff;color:var(--ruby);border:2px solid var(--ruby)}
.hero{position:relative;overflow:hidden;background:#000}
.hero img{width:100%;height:60vh;object-fit:cover;display:block;opacity:.98}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.45))}
.hero .inner{position:absolute;left:7%;bottom:10%;max-width:900px;color:#fff}
.hero .inner p{font-size:17px;max-width:820px}
.grid{display:grid;gap:22px}
.cols-2{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.cols-3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.card img{width:100%;height:240px;object-fit:cover}
.pad{padding:16px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.step{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px}
.step .num{display:inline-flex;width:26px;height:26px;border-radius:50%;align-items:center;justify-content:center;background:var(--ruby);color:#fff;font-weight:900;margin-right:8px}
.badges{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.badge{border:1px solid var(--line);border-radius:12px;padding:14px;font-weight:700;background:#fff}
.footercta{background:#fafafa;border-top:1px solid var(--line);padding-bottom:34px}
.footer{border-top:1px solid var(--line);padding:26px;text-align:center;color:var(--muted)}
label{display:block;margin:8px 0 6px}
input,select,textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:inherit}
@media (max-width:780px){.brand img{height:56px}.brand .name{font-size:24px}.hero img{height:46vh}}


.hero.white{background:#ffffff;border-radius:24px;margin:24px auto;box-shadow:0 10px 40px rgba(0,0,0,.08);}
.grid{display:grid;gap:24px}
.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:#fff;border-radius:18px;box-shadow:0 8px 30px rgba(0,0,0,.06);padding:20px}
.section{padding:48px 24px}
.container{max-width:1120px;margin:0 auto}


/* === Feature strip below Thoughts === */
.feature-strip{background:#faf8f9;border-radius:24px;margin:24px auto;padding:48px 24px;box-shadow:0 10px 30px rgba(0,0,0,.05)}
.feature-strip .card{background:#fff;border-radius:18px;box-shadow:0 6px 20px rgba(0,0,0,.06);}
.feature-strip .icon-dot{width:18px;height:18px;border-radius:999px;background:var(--ruby);display:inline-block;margin-bottom:10px;box-shadow:0 0 0 6px rgba(157,17,21,.12)}
.feature-strip h3{margin:6px 0 8px}
.feature-strip p{color:#333}
@media (max-width: 900px){ .cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 560px){ .cols-4{grid-template-columns:1fr}}


/* Company subnav */
.subnav{position:sticky; top:64px; z-index:50; border-bottom:1px solid #eee;}
.subnav .subnav-list{display:flex; flex-wrap:wrap; gap:16px; list-style:none; padding:0; margin:0;}
.subnav a{display:inline-block; padding:10px 12px; border-radius:12px; background:#fff; border:1px solid #eee; color:#111!important; text-decoration:none;}
.subnav a:hover{border-color:var(--ruby); color:var(--ruby)!important;}
#why, #credentials, #process, #areas, #warranty, #safety, #team, #faqs { scroll-margin-top: 100px; }


/* Working Hours styling */
.footer .hours-line{margin-top:10px; opacity:.9}
#hours.white{background:#fff;border-radius:18px;box-shadow:0 8px 30px rgba(0,0,0,.06);padding:24px}


/* Get a Quote page (no images) */
label{display:block;margin:8px 0 4px}
input[type=text],input[type=email],input[type=tel],textarea{width:100%;padding:10px 12px;border:1px solid #e6e6e6;border-radius:10px}
form .btn{margin-top:12px}
.grid.cols-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
@media(max-width:800px){.grid.cols-2{grid-template-columns:1fr}}


/* === High-contrast tuning (inspired by reference) === */
:root{
  --ink:#0e0e0e;            /* primary text nearly black */
  --ink-2:#1c1c1c;          /* headings */
  --muted:#444;             /* body-muted */
  --line:#ddd;              /* separators */
  --ruby:#8b0f13;           /* slightly deeper accent for contrast */
}

/* Base text */
body{ color: var(--ink); }
h1,h2,h3,h4,h5,h6{ color: var(--ink-2); letter-spacing:.2px }
p,li{ color: var(--ink); }

/* Links: darker on light surfaces */
a{ color:#143a66; text-decoration-color: rgba(20,58,102,.35); }
a:hover{ color:#0f2e52; text-decoration-color: rgba(15,46,82,.6); }

/* On dark backgrounds, flip link to light */
.dark a, body.dark a{ color:#e8f1ff; }
.dark a:hover, body.dark a:hover{ color:#ffffff; }

/* Cards/white sections */
.card, .white, .bg-white { background:#ffffff; color:var(--ink); }
.card p, .white p, .bg-white p, .card li{ color:var(--ink); }

/* Buttons */
.btn, a.btn, button.btn{
  background:#ffffff;
  color: var(--ruby);
  border: 2px solid var(--ruby);
  font-weight: 600;
}
.btn:hover, a.btn:hover, button.btn:hover{
  background:#fff3f4;
  color:#6f0c0f;
  border-color:#6f0c0f;
}
.btn:focus{ outline: 3px solid #ffd1d4; outline-offset:2px; }

/* Navbar links high contrast */
nav a, .navbar a, header.site-header a, .navlinks a{
  color:#0f0f0f !important;
}
nav a:hover, .navbar a:hover, header.site-header a:hover, .navlinks a:hover{
  color:var(--ruby) !important;
}

/* Footer contrast on dark areas */
footer, .footer{ color:#f1f1f1; }
footer a, .footer a{ color:#ffffff !important; }
footer a:hover, .footer a:hover{ color:#ffe7ea !important; }

/* Dividers and subtle borders for definition */
hr, .divider{ border-color: var(--line); opacity:1 }
.card, .subnav a{ border-color: #e7e7e7; }

/* Improve readable spacing (small) */
p{ line-height:1.65 }
/* Ensure the ruby gradient stays if present */
body{ background-attachment: fixed; }


/* Footer working hours */
.footer .hours-line{margin-top:10px;opacity:.95}
.footer .hours-line strong{font-weight:700}


/* === Footer layout (RubyNest) === */
.footer{background:#f6f6f6; padding:40px 24px 24px}
.footer-grid{display:grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap:40px; align-items:start; max-width:1120px; margin:0 auto}
.footer h4{margin:0 0 12px; letter-spacing:.5px}
.footer .linklist{list-style:none; padding:0; margin:0}
.footer .linklist li{margin:6px 0}
.footer .linklist a{color:#0f0f0f; text-decoration:underline; text-underline-offset:2px}
.footer .linklist a:hover{color:var(--ruby)}
.footer .socials{display:flex; gap:12px; margin:12px 0 16px}
.footer .icon{color:#fff}
.footer .icon-bg{fill:#6b7c79} /* muted greenish button */
.footer .talkbtn{display:inline-block; padding:12px 18px; background:#6b7c79 !important; color:#fff !important; border:0; border-radius:8px}
.footer .talkbtn:hover{opacity:.95}
.foot-divider{border:none; border-top:1px solid #e1e1e1; margin:28px auto 12px; max-width:1120px}
.footer .copyright{text-align:center; color:#333}
@media(max-width:960px){ .footer-grid{grid-template-columns:1fr 1fr} }
@media(max-width:560px){ .footer-grid{grid-template-columns:1fr; gap:24px} }


/* Home bottom update */
.cta-ribbon{background:linear-gradient(140deg, #4b0015, #200009); color:#fff; border-radius:18px; margin:24px auto; box-shadow:0 12px 40px rgba(0,0,0,.18)}
.cta-ribbon .h2{color:#fff}
.cta-ribbon p{opacity:.95}
.btn.outline{background:#ffffff; color:var(--ruby); border:2px solid var(--ruby)}
.btn.outline:hover{background:#fff3f4; color:#6f0c0f; border-color:#6f0c0f}


/* Wine feature section */
.wine-feature{
  background: linear-gradient(160deg, #0a0003, #200009 45%, #4b0015);
  color:#f4f4f4;
  border-radius: 18px;
  margin: 24px auto;
  box-shadow: 0 18px 60px rgba(0,0,0,.28);
}
.wine-feature .h2{ color:#fff; font-weight:800; }
.wine-feature p{ color:#f0e8ea; }
.wine-feature .card.photo{ background:#ffffff; color:#111; }
.wine-feature .card.photo p{ color:#333; margin-top:10px }
@media(max-width:900px){ .grid.cols-2{grid-template-columns:1fr} }


/* === Full-page wine background and contrast pass === */
:root{
  --ruby-bg-start:#0a0003; /* near-black with red tint */
  --ruby-bg-mid:#200009;   /* deep wine */
  --ruby-bg-end:#4b0015;   /* ruby */
  --navbar-bg:#ffffff;     /* white nav */
  --ink:#0f0f0f;
  --ink-2:#1a1a1a;
  --light:#f4f4f4;
  --light-2:#f9f9f9;
  --ruby:#8b0f13;
}
/* page background everywhere */
html, body {
  background: linear-gradient(160deg, var(--ruby-bg-start), var(--ruby-bg-mid) 45%, var(--ruby-bg-end)) fixed !important;
  color: var(--light);
}
/* default sections are transparent so the wine shows through */
.section, main, .page-wrap, .content, .container-wrap { background: transparent !important; }
/* keep designated white blocks/cards for readability */
.white, .bg-white, .card, .hero.white {
  background: #ffffff !important;
  color: var(--ink) !important;
}
/* NAV stays white */
nav, .navbar, header.site-header, .topbar, .nav-wrapper{
  background: var(--navbar-bg) !important;
  color: #111 !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
nav a, .navbar a, header.site-header a { color:#0f0f0f !important; }
nav a:hover, .navbar a:hover, header.site-header a:hover { color: var(--ruby) !important; }
/* Dark-surface text/link contrast */
body h1, body h2, body h3, body h4 { color: #ffffff; }
body p, body li { color: var(--light); }
body a { color: #ffd6e3; }
body a:hover { color: #ffe8ef; }
/* Light-surface (cards/white) text */
.card h1, .card h2, .card h3, .white h1, .white h2, .white h3 { color: var(--ink-2) !important; }
.card p, .white p, .bg-white p, .card li { color: var(--ink) !important; }
.card a, .white a, .bg-white a { color:#0f0f0f !important; }
.card a:hover, .white a:hover, .bg-white a:hover { color: var(--ruby) !important; }
/* Footer now dark on wine */
footer, .footer { background: transparent !important; color: #eee !important; }
.footer a { color:#fff !important; }
.footer a:hover { color:#ffe8ef !important; }
.foot-divider { border-top-color: rgba(255,255,255,.22) !important; }
/* Buttons */
.btn, a.btn, button.btn {
  background:#ffffff;
  color: var(--ruby);
  border:2px solid var(--ruby);
  font-weight:600;
}
.btn:hover { background:#fff3f4; color:#6f0c0f; border-color:#6f0c0f; }
/* Kill any inline 'color:white' on white cards for safety */


/* Card polish */
.card{ border-radius: 20px; box-shadow: 0 14px 40px rgba(0,0,0,.12); }
.trust-bottom .trustcard{ background:#fff; text-align:center; font-weight:700; padding:26px 18px; }
.trust-bottom{ margin: 24px auto; }
@media(max-width:900px){ .trust-bottom .grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media(max-width:560px){ .trust-bottom .grid{ grid-template-columns: 1fr; } }


/* === Clean footer refresh === */
.footer{background:transparent;color:#eee}
.footer-wrap{padding:48px 24px 16px}
.footer-flex{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:48px;align-items:start;max-width:1120px;margin:0 auto}
.footer h4{margin:0 0 10px;color:#fff;text-transform:capitalize;letter-spacing:.3px}
.footer .linklist{list-style:none;padding:0;margin:0}
.footer .linklist li{margin:6px 0}
.footer a{color:#fff !important;text-decoration:underline;text-underline-offset:2px}
.footer a:hover{color:#ffe8ef !important}
.footer .hours{opacity:.9;margin:8px 0 12px}
.footer .foot-cta{display:inline-block;background:#ffffff;color:#8b0f13 !important;border:2px solid #8b0f13;border-radius:12px;padding:10px 14px;font-weight:700;text-decoration:none}
.footer .foot-cta:hover{background:#fff3f4;color:#6f0c0f !important;border-color:#6f0c0f}
.footline{border:none;border-top:1px solid rgba(255,255,255,.18);max-width:1120px;margin:10px auto 8px}
.footer .copyright{color:rgba(255,255,255,.75);text-align:center;padding:0 0 24px}
@media(max-width:1024px){.footer-flex{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.footer-flex{grid-template-columns:1fr;gap:28px}}
/* Slightly larger global card radius for polish */
.card{border-radius:22px;box-shadow:0 16px 46px rgba(0,0,0,.14)}


/* === Video hero === */
.hero-video{ position:relative; overflow:hidden; border-radius:18px; margin:16px auto; box-shadow:0 18px 60px rgba(0,0,0,.28); }
.hero-video-wrap{ position:absolute; inset:0; }
.hero-video video{ width:100%; height:100%; object-fit:cover; object-position:center; filter: saturate(1.05) contrast(1.05); }
.hero-video:before{ content:""; position:absolute; inset:0; background: radial-gradient(ellipse at center, rgba(0,0,0,.2), rgba(0,0,0,.55)); pointer-events:none; }
.hero-video .hero-overlay{ position:relative; z-index:2; padding:80px 24px; color:#fff; }
.hero-video .hero-overlay .h1{ color:#fff; font-weight:800; }
.hero-video .hero-overlay p{ color:#f1e9ec; }
@media (max-width:800px){ .hero-video .hero-overlay{ padding:56px 20px; } }


/* === Mobile polish === */

/* Sticky white navbar */
nav, .navbar, header.site-header{
  position: sticky; top: 0; z-index: 1000;
  background: #fff !important;
}

/* Hamburger */
.nav-toggle{display:none; position:relative; width:42px; height:38px; border:0; background:#fff; border-radius:10px; box-shadow:0 2px 10px rgba(0,0,0,.06);}
.nav-toggle span{position:absolute; left:9px; right:9px; height:2px; background:#111; border-radius:2px}
.nav-toggle span:nth-child(1){top:11px}
.nav-toggle span:nth-child(2){top:18px}
.nav-toggle span:nth-child(3){top:25px}

/* Collapsible nav links */
@media (max-width: 960px){
  .nav-toggle{display:block; margin:8px}
  .navlinks{position:fixed; inset:56px 12px auto 12px; background:#fff; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.18); padding:12px; display:flex; flex-direction:column; gap:8px; transform:translateY(-12px); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease;}
  .navlinks a{color:#111 !important; padding:10px 12px; border-radius:10px}
  .navlinks a:hover{background:#f4f4f4}
  .navlinks[data-open="true"]{opacity:1; transform:translateY(0); pointer-events:auto}
  html.menu-open{overflow:hidden}
}

/* Video hero: show poster only on small screens to save data */
@media (max-width: 880px){
  .hero-video{min-height:340px; background: #200009 url('assets/video/rubynest_wine_poster.jpg') center/cover no-repeat;}
  .hero-video video{display:none}
  .hero-video .hero-overlay{padding:56px 20px}
  .btn{width:100%; max-width:420px}
}

/* Image cards: cover on phones to avoid awkward crops */
.card.photo img{width:100%; height:auto; border-radius:14px}
@media (max-width: 880px){
  .card.photo img{height:220px; object-fit:cover}
}

/* Grids collapse cleanly */
@media (max-width: 1024px){
  .grid.cols-4{grid-template-columns: repeat(2, minmax(0,1fr))}
}
@media (max-width: 640px){
  .grid.cols-3, .grid.cols-2{grid-template-columns: 1fr}
}

/* Footer stack */
@media (max-width: 960px){
  .footer-flex{grid-template-columns: 1fr 1fr}
}
@media (max-width: 640px){
  .footer-flex{grid-template-columns: 1fr; gap: 28px}
}

/* Form inputs bigger on mobile */
input[type=text], input[type=email], input[type=tel], textarea{font-size:16px; -webkit-text-size-adjust:100%}

/* Ensure hero video is visible on phones */
@media (max-width: 880px){
  .hero-video{min-height:380px;}
  .hero-video video{display:block}
}


/* Footer tidy */
.footer-brandrow{display:flex;justify-content:center;padding:18px 0 6px}
.footer-logo{height:48px;border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.18)}
.footer-cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:48px;max-width:1120px;margin:0 auto;padding:8px 24px 12px}
.footer h4{margin:0 0 8px;color:#fff;letter-spacing:.2px}
.footer .linklist,.footer .contactlist{list-style:none;margin:0;padding:0}
.footer .linklist li,.footer .contactlist li{margin:6px 0}
.footer a{color:#fff !important;text-decoration:underline;text-underline-offset:2px}
.footer a:hover{color:#ffe8ef !important}
.footer .hours{opacity:.9;margin:10px 0 14px}
.footer .foot-cta{display:inline-block;background:#fff;color:#8b0f13 !important;border:2px solid #8b0f13;border-radius:12px;padding:10px 14px;font-weight:700;text-decoration:none}
.footer .foot-cta:hover{background:#fff3f4;color:#6f0c0f !important;border-color:#6f0c0f}
.footline{border:none;border-top:1px solid rgba(255,255,255,.18);max-width:1120px;margin:12px auto 8px}
.footer .copyright{color:rgba(255,255,255,.75);text-align:center;padding:0 0 24px}
@media(max-width:900px){.footer-cols{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.footer-cols{grid-template-columns:1fr;gap:24px}}

/* Contact page readability */
section.white, .white .h2, .white h1, .white h2, .white h3 { color:#1a1a1a !important; }
.white p, .white li, .white label { color:#0f0f0f !important; }

.hero-video:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 40%, rgba(255,255,255,.06), rgba(0,0,0,.55));pointer-events:none}


/* Robust hero video */
.hero-video{ position:relative; overflow:hidden; border-radius:22px; margin:16px auto; box-shadow:0 18px 60px rgba(0,0,0,.28) }
.hero-video-wrap{ position:absolute; inset:0 }
.hero-video video{ width:100%; height:100%; object-fit:cover; object-position:center }
.hero-video:before{ content:""; position:absolute; inset:0; background: radial-gradient(ellipse at 20% 30%, rgba(255,255,255,.05), rgba(0,0,0,.55)); pointer-events:none }
.hero-video .hero-overlay{ position:relative; z-index:2; padding:88px 28px; }
.hero-video .hero-overlay .h1{ color:#fff; font-weight:900; letter-spacing:.2px; text-shadow: 0 2px 20px rgba(0,0,0,.35) }
.hero-video .hero-overlay p{ color:#efe7f7; text-shadow: 0 1px 14px rgba(0,0,0,.35) }

/* CSS animated fallback */
.hero-fallback{ position:absolute; inset:0; background: linear-gradient(120deg, #2b0015, #3a0050 40%, #5a00a0); filter:saturate(1.1) contrast(1.05); }
@keyframes royalShift{
  0%{ background-position: 0% 50%; }
  50%{ background-position: 100% 50%; }
  100%{ background-position: 0% 50%; }
}
.hero-fallback{ background-size: 200% 200%; animation: royalShift 16s ease-in-out infinite; opacity:.85 }
html.hero-no-video .hero-video video{ display:none }
html.hero-no-video .hero-fallback{ display:block }
@media (max-width: 880px){
  .hero-video .hero-overlay{ padding:64px 20px }
}


/* White section separation + spacing */
section.white{ background:#fff; color:#111; border-radius:22px; padding:28px; box-shadow:0 14px 44px rgba(0,0,0,.12); }
section.white h1, section.white h2, section.white h3, section.white h4{ color:#111 }
section.white p, section.white label{ color:#222 }
.mb-xxl{ margin-bottom: 28px }
@media (max-width: 800px){
  section.white{ padding:22px; border-radius:18px }
  .mb-xxl{ margin-bottom:22px }
}

/* Services grid polish */
#services .services-grid{display:grid;gap:24px;grid-template-columns:repeat(3,minmax(0,1fr))}
#services .card{background:#fff;border-radius:22px;padding:22px;box-shadow:0 14px 44px rgba(0,0,0,.12)}
#services .btn{margin-top:10px}
#services .services-foot{margin-top:16px;color:#f4e8ee}
@media (max-width:1120px){ #services .services-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ #services .services-grid{grid-template-columns:1fr} #services .btn{width:100%} }

/* Tone the fallback from purple to wine/ruby */
.hero-fallback{ 
  background: linear-gradient(120deg, #1c0006, #35000e 40%, #4c0013);
  background-size: 200% 200%;
}


/* Luxury image banner */
.banner-figure{ margin: 16px auto; border-radius: 24px; overflow:hidden; box-shadow: 0 18px 60px rgba(0,0,0,.28) }
.banner-figure img{ display:block; width:100%; height:auto }

/* Showcase split layout */
.showcase-wrap{ display:grid; grid-template-columns: 2fr 1fr; gap:24px; align-items:center; margin-top:24px }
.showcase img{ width:100%; border-radius:20px; box-shadow: 0 14px 44px rgba(0,0,0,.2) }
.showcase-copy h3{ color:#fff; margin:0 0 6px; font-weight:800 }
.showcase-copy p{ color:#e9dfea; margin:8px 0 }
@media (max-width: 980px){
  .showcase-wrap{ grid-template-columns:1fr }
}


/* Phone link polish */
section.white a[href^="tel:"], footer a[href^="tel:"]{ text-decoration:none; font-weight:700 }
section.white a[href^="tel:"]:hover, footer a[href^="tel:"]:hover{ text-decoration:underline }


/* 50/50 split under What We Build */
.ww50-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap:28px;
  align-items:start;
  margin-top:18px;
}
.ww50-media img{
  display:block;
  width:100%;
  height:auto;
  border-radius:22px;
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}
.ww50-copy .h3{ color:#fff; margin:0 0 10px; font-weight:800 }
.ww50-copy .meta{ color:#f4e8ee; margin-top:10px }
/* Accordions */
.svc-accordion details{
  background:#fff;border-radius:18px;padding:14px 16px;margin:10px 0;
  box-shadow:0 10px 32px rgba(0,0,0,.10)
}
.svc-accordion summary{
  cursor:pointer; font-weight:700; color:#141414; outline:none; list-style:none
}
.svc-accordion summary::-webkit-details-marker{ display:none }
.svc-accordion ul{ margin:10px 0 0 18px; color:#222 }
.svc-accordion li{ margin:6px 0 }
/* Responsive */
@media (max-width: 1080px){
  .ww50-grid{ grid-template-columns: 1fr; }
}


/* Form polish */
input:required:invalid, textarea:required:invalid{ outline:2px solid #c41a22 }
input:required:valid, textarea:required:valid{ outline:2px solid #0c9c4a; outline-offset:1px }


/* What We Build (polished tiles) */
.svcblock .h2{ color:#fff; margin-bottom:12px }
.svc-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:14px;
}
.svc-item{
  background:linear-gradient(180deg,#ffffff 0%,#f8f5f7 100%);
  border-radius:16px;
  padding:16px 18px;
  display:flex;
  align-items:center;
  min-height:72px;
  color:#141414;
  text-decoration:none;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
  position:relative;
  transition:transform .12s ease, box-shadow .12s ease;
}
.svc-item::before{
  content:"";
  position:absolute; left:0; top:0; bottom:0; width:5px;
  background:#8b0f13; border-top-left-radius:16px; border-bottom-left-radius:16px;
}
.svc-item:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(0,0,0,.18);
}
.svc-item span{ font-weight:700; line-height:1.3 }

@media (max-width: 1100px){
  .svc-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .svc-grid{ grid-template-columns: 1fr; }
}

/* How It Works (badges) */
.steps .h2{ color:#fff; margin-bottom:12px }
.step-grid{
  display:grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap:14px;
}
.step{
  background:#fff; border-radius:16px; padding:16px;
  display:flex; gap:12px; align-items:flex-start;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
}
.badge{
  width:28px; height:28px; border-radius:999px;
  background:#8b0f13; color:#fff; display:flex; align-items:center; justify-content:center;
  font-weight:800; flex:0 0 28px;
}
.step p{ margin:2px 0 0 0; color:#222 }
@media (max-width: 900px){
  .step-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px){
  .step-grid{ grid-template-columns: 1fr; }
}


/* Collapsible What We Build */
.wwb-toggle{ background:none; border:0; padding:0; }
.wwb-summary{
  display:flex; align-items:center; gap:10px;
  font-size:clamp(22px, 3vw, 32px); font-weight:800; color:#fff;
  background:#2b0008; border:1px solid rgba(255,255,255,.08);
  padding:14px 16px; border-radius:16px; cursor:pointer;
  position:relative; box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.wwb-summary::after{
  content:""; width:10px; height:10px; border-right:3px solid #fff; border-bottom:3px solid #fff;
  transform:rotate(45deg); margin-left:auto; transition:transform .15s ease;
}
.wwb-toggle[open] .wwb-summary::after{ transform:rotate(225deg) }
.wwb-media{ margin:16px 0 8px }
.wwb-media img{ width:100%; height:auto; display:block; border-radius:20px; box-shadow:0 18px 60px rgba(0,0,0,.28) }

/* Accordions (reuse styles) */
.svc-accordion details{
  background:#fff;border-radius:18px;padding:14px 16px;margin:10px 0;
  box-shadow:0 10px 32px rgba(0,0,0,.10)
}
.svc-accordion summary{ cursor:pointer; font-weight:700; color:#141414; outline:none; list-style:none }
.svc-accordion summary::-webkit-details-marker{ display:none }
.svc-accordion ul{ margin:10px 0 0 18px; color:#222 }
.svc-accordion li{ margin:6px 0 }


/* --- Contrast Fix for Accordion Content --- */
.svc-accordion{ color:#161616 }
.svc-accordion details{ background:#ffffff }
.svc-accordion summary{ color:#111 !important }
.svc-accordion ul{ color:#222 !important; font-weight:500 }
.svc-accordion li{ color:#222 !important; opacity:1 !important; filter:none !important; line-height:1.55 }
.svc-accordion li strong{ color:#111 !important; font-weight:800 }
.svc-accordion li::marker{ color:#8b0f13 }


/* Toll‑free label above the phone number */
a[href^="tel:+18668955504"]{
  position: relative;
  display: inline-block;
  padding-top: 18px; /* make room for label */
}
a[href^="tel:+18668955504"]::before{
  content: "Toll‑free";
  position: absolute;
  top: 4px;
  right: 10px;
  font-size: 12px;
  color: #6b6b6b;
  text-transform: uppercase;
  letter-spacing: .02em;
}
/* In tight buttons, keep label readable */
button a[href^="tel:+18668955504"], .btn a[href^="tel:+18668955504"]{
  padding-top: 18px;
}
/* Centered chips: align label to right edge inside the chip */
section.white a[href^="tel:+18668955504"]::before, .contact a[href^="tel:+18668955504"]::before{
  right: 12px;
}


/* Fix: tel link chips — prevent bullets/overlap and keep on one line */
a[href^="tel:+18668955504"]{
  position: relative;
  display: inline-block;
  padding-top: 16px; /* room for the label */
  white-space: nowrap;         /* keep number on one line */
  list-style: none !important; /* no bullets */
  background: transparent;     /* no unexpected backgrounds */
}
a[href^="tel:+18668955504"]::before{
  content: "Toll\2011free";   /* non‑breaking hyphen */
  position: absolute;
  top: -2px;
  right: 0;
  font-size: 12px;
  color: #6b6b6b;
  text-transform: uppercase;
  letter-spacing: .02em;
  line-height: 1;
  background: transparent;
  padding: 0;
  border: 0;
}
/* Inside CTA buttons or chips, align label to the right padding */
.btn a[href^="tel:+18668955504"]::before,
section .chip a[href^="tel:+18668955504"]::before,
footer a[href^="tel:+18668955504"]::before{
  right: 12px;
}
/* If any container forces list-style, neutralize for the phone link */
li a[href^="tel:+18668955504"]{ list-style: none !important; }


/* ----- Contact polish ----- */
.contact-chips{
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  margin:6px 0 12px; 
}
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 12px; border-radius:999px;
  background:#f7f2f4; color:#111; text-decoration:none;
  border:1px solid #e9dde1; box-shadow:0 1px 0 rgba(0,0,0,.03) inset;
}
.chip:hover{ background:#f1e7ea }
.chip-title{ font-weight:700 }
.chip-note{ font-size:12px; color:#6e6e6e; padding-left:6px; border-left:1px solid #d9cdd1 }

/* Remove earlier pseudo Toll-free label to avoid overlap */
a[href^="tel:+18668955504"]::before{ display:none !important; }

/* Form fields */
form input[type="text"], form input[type="email"], form input[type="tel"],
form select, form textarea{
  width:100%; background:#fff; color:#111;
  border:1.5px solid #e2d5d8; border-radius:14px;
  padding:12px 14px; outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
form textarea{ min-height:160px; resize:vertical }
form input::placeholder, form textarea::placeholder{ color:#7a7a7a }
form input:focus, form textarea:focus, form select:focus{
  border-color:#8b0f13;
  box-shadow:0 0 0 3px rgba(139,15,19,.10);
}

/* Reduce aggressive valid/invalid outlines if previously set */
input:required:invalid, textarea:required:invalid{ outline:none }
input:required:valid, textarea:required:valid{ outline:none }

/* Buttons */
button, .btn{
  background:#8b0f13; color:#fff; border:none; border-radius:14px;
  padding:12px 16px; font-weight:800; cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 10px 22px rgba(139,15,19,.22);
}
button:hover, .btn:hover{ background:#6f0c10 }


/* --- Steps polish: uniform cards, tighter copy, better grid --- */
.clean-steps .step-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:16px;
}
.clean-steps .card{
  background:#fff; border-radius:18px; padding:16px; 
  display:flex; gap:12px; min-height:160px;
  box-shadow:0 10px 30px rgba(0,0,0,.10);
}
.clean-steps .badge{
  width:32px; height:32px; border-radius:999px;
  background:#8b0f13; color:#fff; display:flex; align-items:center; justify-content:center;
  font-weight:800; flex:0 0 32px; box-shadow:0 6px 16px rgba(139,15,19,.28);
}
.clean-steps .copy h4{ margin:0 0 6px; font-weight:800; color:#111 }
.clean-steps .copy p{ margin:0; color:#333; line-height:1.45 }
@media (max-width: 1024px){
  .clean-steps .step-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .clean-steps .step-grid{ grid-template-columns: 1fr; }
}


/* Pills row fixes */
.pill{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:14px; background:#fff; color:#111;
  text-decoration:none; border:1px solid #e9e4e6; margin:6px; box-shadow:0 8px 16px rgba(0,0,0,.05);
}
.pill:hover{ background:#f7f3f5 }


.careers-generic{ color:#fff }
.careers-generic .h2{ color:#fff; margin-bottom:8px }
.careers-generic ul{ margin:10px 0 14px 20px }


/* Contact: tidy chip row, remove pseudo labels, prevent overlap */
a[href^="tel:+18668955504"]::before, a[href^="mailto:info@rubynest.ca"]::before{ display:none !important }
.contact-chips{ display:flex; gap:10px; flex-wrap:wrap; margin:8px 0 14px }
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 12px; border-radius:999px; background:#f7f2f4; color:#111;
  text-decoration:none; border:1px solid #e9dde1;
}
.chip-title{ font-weight:800 }
.chip-note{ font-size:12px; color:#6e6e6e; padding-left:6px; border-left:1px solid #d9cdd1 }

/* Form: softer default borders; ruby focus */
form input[type="text"], form input[type="email"], form input[type="tel"], form select, form textarea{
  width:100%; background:#fff; color:#111;
  border:1.5px solid #e2d5d8; border-radius:14px; padding:12px 14px; outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
form input:focus, form textarea:focus, form select:focus{
  border-color:#8b0f13; box-shadow:0 0 0 3px rgba(139,15,19,.10);
}


/* ---- Layout tightening: reduce empty band below hero & extra vertical space ---- */

/* Many builds add a spacer element after the hero; neutralize it */
.hero-spacer, .hero__spacer, .hero-gradient, .hero-divider { display:none !important; height:0 !important; }
#hero + section, .hero + section, .hero + .container { margin-top: 12px !important; padding-top: 24px !important; }

/* Soften global section padding a touch */
main > section { padding-block: 44px; }           /* default ~64 → 44 */
@media (max-width: 640px){ main > section { padding-block: 32px; } }

/* Remove accidental large bottom padding before footer */
main > section:last-of-type { padding-bottom: 36px; margin-bottom: 0; }

/* Keep request-a-call FAB clear of footer but visually closer */
.call-fab{ bottom: 22px; }


/* =============================
   RubyNest — Classy Polish Pass
   ============================= */

/* Theme tokens */
:root{
  --brand: #8B0F13;
  --brand-600: #6f0c10;
  --ink: #111111;
  --ink-2: #2a2a2a;
  --muted: #6f6f6f;
  --line: #e9e4e6;
  --card: #ffffff;
  --bg: #190006;

  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 18px;
  --r-xl: 22px;

  --shadow-1: 0 8px 18px rgba(0,0,0,.10);
  --shadow-2: 0 14px 36px rgba(0,0,0,.16);
  --shadow-inset: 0 1px 0 rgba(0,0,0,.04) inset;

  --sp-1: 6px;
  --sp-2: 10px;
  --sp-3: 14px;
  --sp-4: 20px;
  --sp-5: 28px;
  --sp-6: 40px;
  --sp-7: 56px;
  --sp-8: 72px;
}

/* Base */
html{ scroll-behavior:smooth }
body{ background:var(--bg); color:var(--ink) }
main > section{ padding-block: var(--sp-6) }
@media (max-width: 640px){
  main > section{ padding-block: var(--sp-5) }
}

/* Typography */
h1,h2,h3{ letter-spacing:-.01em; color:var(--ink) }
.h1, h1{ font-weight:900 }
.h2, h2{ font-weight:900; margin-bottom: var(--sp-3) }
.h3, h3{ font-weight:800 }

p, li{ line-height:1.6; color:var(--ink-2) }
small, .text-muted{ color:var(--muted) }

/* Containers & cards */
.container, .content{
  max-width: 1200px; margin-inline:auto; padding-inline: clamp(16px, 3vw, 28px);
}

.card, .panel, .tile, .step.card{
  background:var(--card);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
  border: 1px solid var(--line);
}

/* Buttons */
button, .btn, .chip, .pill, .call-fab{
  border-radius: var(--r-lg);
}
button, .btn{
  background: var(--brand);
  color:#fff; font-weight:800;
  border: none; box-shadow: 0 14px 30px rgba(139,15,19,.22);
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease;
}
button:hover, .btn:hover{ background: var(--brand-600) }
button:active, .btn:active{ transform: translateY(1px); box-shadow: 0 8px 20px rgba(139,15,19,.26) }

/* Inputs */
input[type="text"], input[type="email"], input[type="tel"], select, textarea{
  border-radius: var(--r-lg);
  border:1.5px solid #e2d5d8;
  padding: 12px 14px;
  transition: border-color .15s ease, box-shadow .15s ease, background .2s ease;
  background:#fff;
}
input:focus, select:focus, textarea:focus{
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(139,15,19,.10);
}

/* Chips */
.chip{
  background:#faf6f7; border:1px solid #e9dde1;
  box-shadow: var(--shadow-inset);
}

/* Hero & images */
.hero, .banner{
  border-radius: var(--r-xl);
  overflow:hidden;
  box-shadow: var(--shadow-2);
}
img, .img, .figure img{ border-radius: var(--r-md) }

/* Navbar */
.header, header[role="banner"], .site-nav{
  background:#fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  border-bottom: 1px solid var(--line);
}
.nav a{ color:var(--ink-2); font-weight:700 }
.nav .cta, .nav a.btn{ border-radius: var(--r-lg) }

/* Footer */
footer{ color:#fff }
footer .footer-card{
  background:#120005;
  border:1px solid rgba(255,255,255,.06);
  border-radius: var(--r-lg);
  box-shadow: 0 12px 30px rgba(0,0,0,.25);
}

/* Step cards (How it Works) refinement */
.clean-steps .card{
  border:1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-1);
}
.clean-steps .badge{
  width:34px; height:34px;
  box-shadow: 0 8px 20px rgba(139,15,19,.30);
}

/* “What we build” list tiles */
.build-list .tile{ padding: var(--sp-4) }
.build-list .tile h4{ margin:0 0 var(--sp-2) }

/* Links/hover */
a{ color: var(--brand-600) }
a:hover{ color: var(--brand) }

/* Mobile adjustments */
@media (max-width: 1024px){
  .container, .content{ padding-inline: clamp(14px, 4vw, 22px) }
  .hero, .banner{ border-radius: var(--r-lg) }
}
@media (max-width: 640px){
  h1{ font-size: clamp(1.9rem, 6vw, 2.2rem) }
  h2{ font-size: clamp(1.4rem, 4.8vw, 1.7rem) }
  .card, .tile{ border-radius: var(--r-md) }
  .call-fab{ right: 14px; bottom: 18px }
}


/* ===== Mobile Polish (<= 768px) ===== */

@media (max-width: 768px){
  /* Global spacing & legibility */
  body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  main > section { padding-block: 28px; }
  .container, .content { padding-inline: clamp(14px, 5vw, 20px); }
  h1 { font-size: clamp(1.8rem, 6.5vw, 2.1rem); line-height: 1.18; }
  h2 { font-size: clamp(1.3rem, 5vw, 1.6rem); line-height: 1.22; }
  p, li { font-size: 1.02rem; }

  /* Navigation & header */
  .header, header[role="banner"], .site-nav { padding-block: 10px; }
  .nav a, .nav .btn { padding: 10px 12px; }
  .nav a { display:inline-flex; align-items:center; min-height: 44px; }

  /* Hero */
  .hero, .banner { border-radius: 16px; overflow:hidden; }
  .hero img, .banner img { width:100%; height:auto; display:block; }

  /* Cards & tiles */
  .card, .tile { margin-block: 12px; border-radius: 16px; }
  .step.card, .panel { margin-block: 12px; }

  /* Steps grid collapse */
  .clean-steps, .steps, .steps-grid, .grid-3, .grid-4 {
    display:grid; grid-template-columns: 1fr; gap: 14px;
  }

  /* Buttons & tap targets */
  button, .btn, .chip, .pill, .call-fab { min-height: 44px; }
  .btn, button { padding: 12px 16px; font-size: 1.02rem; }

  /* Forms */
  input[type="text"], input[type="email"], input[type="tel"], select, textarea {
    min-height: 48px; font-size: 16px; /* avoid iOS zoom */
  }
  .row { display:flex; flex-direction: column; gap: 12px; }
  label { font-weight: 700; margin-bottom: 6px; display:block; }

  /* Request-a-Call FAB: respect safe areas */
  .call-fab { 
    right: max(14px, env(safe-area-inset-right) + 8px);
    bottom: max(18px, env(safe-area-inset-bottom) + 10px);
  }

  /* Footer spacing */
  footer .footer-card { border-radius: 16px; margin-block: 12px; }
}

/* Extra small (<= 420px) */
@media (max-width: 420px){
  .btn, button { width: 100%; text-align:center; }
  .chip { width: 100%; justify-content: center; }
}


/* ===== Hero / Banner readability & overflow fix ===== */
.hero, .banner, .hero-slide, .banner-slide {
  position: relative;
  display: grid;
  align-items: end;
  min-height: clamp(340px, 48vw, 620px);
  overflow: hidden;
}

.hero > *, .banner > * { z-index: 1; }

/* Gradient overlay to boost text contrast on busy photos */
.hero::after, .banner::after, .hero-slide::after, .banner-slide::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.35) 40%, rgba(0,0,0,0.55) 100%);
  z-index: 0; pointer-events: none;
}

/* Make sure background images stretch correctly */
.hero img, .banner img, .hero .bg, .banner .bg, .hero .media, .banner .media {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}

/* Content wrapper inside hero */
.hero .content, .banner .content, .hero__content, .banner__content {
  max-width: min(1100px, 92vw);
  padding: clamp(16px, 4vw, 48px);
  margin: 0 auto;
}

/* Title & subtitle: scale responsively and wrap safely */
.hero h1, .banner h1, .hero .title, .banner .title {
  color: #fff;
  font-weight: 900;
  letter-spacing: -0.015em;
  line-height: 1.04;
  font-size: clamp(1.9rem, 4.6vw + 1rem, 4.4rem);
  margin: 0 0 .35em 0;
  /* Prevent cropping / overflow */
  max-width: 22ch;
  overflow-wrap: anywhere;
  word-break: normal;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}

.hero p, .banner p, .hero .subtitle, .banner .subtitle {
  color: rgba(255,255,255,.95);
  font-size: clamp(1.02rem, 1.2vw + .8rem, 1.35rem);
  line-height: 1.45;
  max-width: 60ch;
  text-shadow: 0 1px 12px rgba(0,0,0,.35);
  margin: 0 0 12px 0;
}

/* Option: 'text-below' variant — image first, text underneath */
.hero--under, .banner--under {
  display: block;
}
.hero--under .content, .banner--under .content {
  position: static; max-width: min(1100px, 92vw);
}
.hero--under::after, .banner--under::after { display: none; }
.hero--under h1, .banner--under h1 { color: #fff; }
.hero--under p, .banner--under p { color: rgba(255,255,255,.95); }

/* Tighten on small screens and ensure full visibility */
@media (max-width: 680px){
  .hero, .banner { min-height: clamp(320px, 64vw, 480px); }
  .hero h1, .banner h1 { max-width: 18ch; font-size: clamp(1.7rem, 6.2vw + .6rem, 3rem); line-height: 1.07; }
  .hero p, .banner p { max-width: 48ch; }
}

/* Avoid stacking overlap with nav */
.header + .hero, .site-nav + .hero, header + .hero,
.header + .banner, .site-nav + .banner, header + .banner {
  margin-top: 0;
}


/* ===== Header / Nav Polish ===== */
.header, header.site-header, header[role="banner"], .site-nav {
  position: sticky; top: 0; z-index: 1000;
  background:#fff;
  border-bottom: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  backdrop-filter: saturate(120%) blur(2px);
}

.header .container, header .container, .site-nav .container {
  display:flex; align-items:center; justify-content:space-between;
  min-height: 72px; /* was small; make it roomier */
  gap: 16px;
  padding-block: 8px;
}

.header .brand img, .logo img, .site-logo img {
  max-height: 52px; /* enlarge logo */
  width:auto; height:auto;
}

.nav, .main-nav {
  display:flex; align-items:center; gap: clamp(18px, 2.6vw, 34px);
}

.nav ul, .main-nav ul {
  display:flex; align-items:center; gap: clamp(18px, 2.6vw, 34px);
  list-style:none; margin:0; padding:0;
}

.nav a, .main-nav a {
  font-weight: 800;
  font-size: clamp(1.02rem, .36vw + 1rem, 1.14rem);
  color:#161616;
  text-decoration:none;
  padding: 10px 4px;
  line-height: 1;
  position: relative;
}

.nav a:hover, .main-nav a:hover { color: #6f0c10; }

/* Elegant underline on hover/active */
.nav a::after, .main-nav a::after {
  content:""; position:absolute; left: 6px; right: 6px; bottom: -8px;
  height: 2px; border-radius: 2px;
  background: #8B0F13; opacity:0; transform: translateY(4px);
  transition: opacity .18s ease, transform .18s ease;
}
.nav a:hover::after, .main-nav a:hover::after,
.nav a[aria-current="page"]::after, .main-nav a.active::after {
  opacity: 1; transform: translateY(0);
}

/* CTA button */
.nav .btn-cta, .main-nav .btn-cta, .nav .cta, .nav a.btn, .quote-cta, a.quote-cta {
  background:#fff; color:#8B0F13; font-weight: 900;
  border: 2px solid #8B0F13;
  padding: 14px 22px;
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(139,15,19,.12);
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  white-space: nowrap;
}
.nav .btn-cta:hover, .main-nav .btn-cta:hover, .nav .cta:hover, .nav a.btn:hover, .quote-cta:hover, a.quote-cta:hover {
  background:#8B0F13; color:#fff; transform: translateY(1px);
  box-shadow: 0 10px 24px rgba(139,15,19,.18);
}

/* Compact on smaller screens while keeping tap targets */
@media (max-width: 980px){
  .header .container, header .container, .site-nav .container { min-height: 68px; }
  .nav a { padding: 10px 2px; }
}
@media (max-width: 720px){
  .header .brand img, .logo img { max-height: 40px; }
  .nav a { font-size: 1.02rem; }
  .nav .btn-cta, .quote-cta { padding: 12px 18px; }
}



/* ======================
   Topic Chips Polish
   ====================== */
:root{
  --brand:#8B0F13;
  --brand-600:#6f0c10;
  --ink:#111;
  --line:#ece7e9;
  --glass:#ffffff;
  --shadow-1:0 10px 28px rgba(0,0,0,.08);
  --shadow-2:0 16px 40px rgba(0,0,0,.12);
}
.topic-bar{
  background: var(--glass);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 18px;
  box-shadow: var(--shadow-1);
  padding: clamp(12px, 1.8vw, 18px);
  margin: 24px auto;
}
.topic-bar .chips{
  display: flex;
  flex-wrap: wrap;
  gap: clamp(10px, 1.2vw, 14px);
}
.topic-bar .chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  min-height: 44px;
  font-weight: 800;
  font-size: 1rem;
  color: var(--ink);
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 999px;
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease, transform .06s ease;
  box-shadow: 0 6px 14px rgba(0,0,0,.04);
  will-change: transform;
}
.topic-bar .chip:hover{
  border-color: var(--brand);
  color: var(--brand-600);
  box-shadow: 0 10px 22px rgba(139,15,19,.12);
  transform: translateY(1px);
}
.topic-bar .chip:focus{
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(139,15,19,.12), 0 10px 22px rgba(139,15,19,.12);
}
.topic-bar .chip:active{ transform: translateY(2px); }
.topic-bar .chip[aria-current="page"],
.topic-bar .chip.active{
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  box-shadow: 0 12px 26px rgba(139,15,19,.20);
}
@media (max-width: 820px){
  .topic-bar{ border-radius: 16px; padding: 10px; }
  .topic-bar .chips{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    gap: 10px;
    padding-bottom: 4px;
  }
  .topic-bar .chips::-webkit-scrollbar{ height: 8px; }
  .topic-bar .chips::-webkit-scrollbar-thumb{
    background: rgba(0,0,0,.12);
    border-radius: 999px;
  }
  .topic-bar .chip{ scroll-snap-align: start; white-space: nowrap; }
}
.topic-bar.is-sticky{
  position: sticky;
  top: clamp(60px, 9vh, 90px);
  z-index: 50;
}