/* ==========================================================================
   D&V design system — dv-design.css — UI polish 2026-11-10
   --------------------------------------------------------------------------
   Loaded AFTER the site's own stylesheet on every page, so these rules win
   at equal specificity. One file per site (identical except the :root
   palette block, rendered per site — see README-UI-POLISH-2026-11-10.md).
   Never edit the palette by hand: re-render from dv-design-template.css.
   Palette tokens:
     --dv-navy        dark surface (header / hero / footer)
     --dv-navy-dark   deeper dark (header / hero gradient end)
     --dv-navy-deep   darkest (call band / footer)
     --dv-gold        accent (rules, card tops, stars, secondary highlights)
     --dv-gold-bright bright gold (stars + links on dark)
     --dv-cta         primary button background
     --dv-cta-text    primary button text
     --dv-cta-hover   primary button hover background
   ========================================================================== */

:root{
  --dv-navy:#0B4F8A; --dv-navy-dark:#083A66; --dv-navy-deep:#061F38;
  --dv-gold:#D9A400; --dv-gold-bright:#F2C94C;
  --dv-cta:#D9A400; --dv-cta-text:#083A66; --dv-cta-hover:#B98A00;
  --dv-ink:#14202B; --dv-muted:#55636F; --dv-line:#DCE3E8; --dv-bg:#FFFFFF; --dv-panel:#F2F5F8;
  --accent:#0B4F8A; --accent-dark:#083A66; --panel:#F2F5F8;
}

/* ---------------- base ---------------- */
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.65;color:var(--dv-ink);background:var(--dv-bg);}
img{max-width:100%;height:auto;}
::selection{background:var(--dv-gold);color:var(--dv-navy-dark);}
:focus-visible{outline:3px solid var(--dv-gold);outline-offset:2px;border-radius:4px;}
.wrap{max-width:1024px;}

/* ---------------- typography ---------------- */
main h1{font-size:2.4rem;line-height:1.15;letter-spacing:-.02em;margin:0 0 1rem;color:var(--dv-ink);}
main h2{font-size:1.55rem;line-height:1.3;letter-spacing:-.01em;margin:2.4rem 0 .8rem;color:var(--dv-ink);}
main>h2::after{content:"";display:block;width:48px;height:3px;background:var(--dv-gold);border-radius:2px;margin-top:.55rem;}
main h3{font-size:1.18rem;line-height:1.35;margin:1.9rem 0 .5rem;color:var(--dv-navy);}
main p{margin:0 0 1.05rem;}
main p.lede,.lede{font-size:1.14rem;line-height:1.6;}
.banner{font-size:1.08rem;color:var(--dv-muted);margin-top:-.4rem;border-left:3px solid var(--dv-gold);padding-left:.8rem;}

/* ---------------- header (dark chrome) ---------------- */

.site-header{background:var(--dv-navy-dark);border-bottom:3px solid var(--dv-gold);box-shadow:0 2px 12px rgba(6,31,56,.18);}
.site-header .brand{color:#fff;}
.site-header .brand span{color:var(--dv-gold-bright);}
.site-nav a{color:#C8D9EA;}
.site-nav a:hover{color:#fff;}
.site-nav a.active{color:var(--dv-gold-bright);border-bottom:2px solid var(--dv-gold);}
.site-footer{background:var(--dv-navy-deep);color:#A9BCCD;border-top:3px solid var(--dv-gold);padding:2rem 0 2.5rem;}
.site-footer .footer-name{color:#fff;}
.site-footer .footer-heading{color:#fff;}
.site-footer .footer-services-title{color:#fff;}
.site-footer a{color:#D7E3EE;}
.site-footer a:hover{color:var(--dv-gold-bright);}
.site-footer p{color:#A9BCCD;}
.site-footer .footer-services a{color:#B9C9D8;}
.site-footer .footer-links a{color:#B9C9D8;}

.site-header{position:sticky;top:0;z-index:20;}
.header-inner{padding-top:.85rem;padding-bottom:.85rem;}
.brand{font-size:1.2rem;}
.site-nav a{font-size:.98rem;}

/* ---------------- hero ---------------- */
section.hero,.dv-hero,.dv-hero-solo{background:linear-gradient(135deg,var(--dv-navy) 0%,var(--dv-navy-dark) 100%);color:#fff;border-radius:16px;padding:2.5rem 2rem;margin:0 0 2.25rem;}
section.hero:not(.hero-banner){padding:2.5rem 2rem;}
section.hero h1,.dv-hero h1,.dv-hero-solo h1{color:#fff;font-size:2.5rem;line-height:1.12;margin-bottom:.6rem;}
section.hero h2,.dv-hero h2{color:#EAF1F7;font-size:1.25rem;margin:0 0 1rem;}
section.hero p,.dv-hero p,.dv-hero-solo p{color:rgba(255,255,255,.92);}
section.hero .hero-lede,.dv-hero .hero-lede{font-size:1.1rem;line-height:1.6;}
section.hero .hero-sub{color:rgba(255,255,255,.92);font-size:1.15rem;}
section.hero .hero-actions{margin-top:1.5rem;}
section.hero .hero-link{color:#fff;}
section.hero .hero-link:hover{color:var(--dv-gold-bright);}
section.hero .disclosure{background:rgba(255,255,255,.96);color:var(--dv-ink);border:1px solid var(--dv-line);border-left:5px solid var(--dv-gold);border-radius:10px;padding:1rem 1.25rem;margin:1.5rem 0 0;font-size:.97rem;}
section.hero .disclosure p{color:var(--dv-ink);margin:0;}
section.hero .disclosure strong{color:var(--dv-accent-dark,#7d0c2c);}
/* hero with a background photo (Timberland): keep the photo, text sits on it */
section.hero.hero-banner{overflow:hidden;padding:0;}
section.hero.hero-banner .hero-bg{position:absolute;inset:0;}
section.hero.hero-banner .hero-text{position:relative;padding:2.6rem 2rem;}
section.hero.hero-banner .dv-hero-cta{position:relative;padding:0 2rem 2.2rem;margin-top:0;}
/* our own hero wrapper (h1 + hero figure) */
.dv-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:2rem;align-items:center;}
.dv-hero figure.hero{margin:0;}
.dv-hero figure.hero img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.35);}
.dv-hero .dv-hero-text{min-width:0;}
/* solo hero (no image): centre the short content so the wide dark band reads
   as a deliberate panel instead of an empty rectangle. Browser QA 2026-11-10:
   service-page heroes looked ~60% empty on the right. */
.dv-hero-solo{text-align:center;}
.dv-hero-solo .dv-hero-cta{justify-content:center;}
/* hero images everywhere */
.hero-img,.hero img,figure.hero img{border-radius:12px;}
section.hero .hero-img{box-shadow:0 10px 30px rgba(0,0,0,.35);}


/* ---------------- proof line + hero CTAs ---------------- */
.dv-proof{margin:.7rem 0 0;font-size:.98rem;font-weight:600;color:rgba(255,255,255,.88);}
.dv-proof .dv-stars{color:var(--dv-gold-bright);letter-spacing:.08em;margin-right:.35rem;}
.dv-hero-cta{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin-top:1.4rem;}
.dv-cta{display:inline-block;background:var(--dv-cta);color:var(--dv-cta-text);font-weight:700;text-decoration:none;padding:.8rem 1.6rem;border-radius:999px;box-shadow:0 4px 14px rgba(6,31,56,.25);transition:transform .15s ease,box-shadow .15s ease,background .15s ease;}
.dv-cta:hover{background:var(--dv-cta-hover);transform:translateY(-1px);box-shadow:0 8px 20px rgba(6,31,56,.3);}
.dv-cta-ghost{display:inline-block;background:transparent;color:#fff;font-weight:600;text-decoration:none;padding:.8rem 1.4rem;border-radius:999px;border:2px solid rgba(255,255,255,.7);transition:background .15s ease,border-color .15s ease;}
.dv-cta-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;}
/* light-background fallback row (used only where an h1 could not be wrapped) */
.dv-meta{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin:0 0 1.5rem;}
.dv-meta .dv-proof{color:var(--dv-muted);}
.dv-meta .dv-proof .dv-stars{color:#B8860B;}
.dv-meta .dv-cta-ghost{color:var(--dv-navy);border-color:var(--dv-navy);}
.dv-meta .dv-cta-ghost:hover{background:var(--dv-panel);}
/* ghost button + proof line on a LIGHT hero (a plain div.hero keeps the
   site's own light background -- the dark gradient only covers
   section.hero/.dv-hero/.dv-hero-solo). Browser QA 2026-11-10 found A-King's
   "View all services" white-on-white on its light-grey hero; this makes the
   ghost readable on any light hero, mirroring .dv-meta above. */
div.hero .dv-cta-ghost{color:var(--dv-navy);border-color:var(--dv-navy);}
div.hero .dv-cta-ghost:hover{background:var(--dv-panel);border-color:var(--dv-navy);}
div.hero .dv-proof{color:var(--dv-muted);}
div.hero .dv-proof .dv-stars{color:#B8860B;}
/* header call button (added where the header had none) */
.dv-header-call{background:var(--dv-cta);color:var(--dv-cta-text);font-weight:700;text-decoration:none;padding:.5rem 1.1rem;border-radius:999px;white-space:nowrap;font-size:.95rem;}
.dv-header-call:hover{background:var(--dv-cta-hover);}

/* ---------------- buttons (existing classes, re-skinned) ---------------- */
.book-btn,.call-btn,.header-call,.nav-call,.call-band-btn,.call-band-button,.hero-btn{background:var(--dv-cta);color:var(--dv-cta-text);border-radius:999px;font-weight:700;text-decoration:none;}
.book-btn:hover,.call-btn:hover,.header-call:hover,.nav-call:hover,.call-band-btn:hover,.call-band-button:hover,.hero-btn:hover{background:var(--dv-cta-hover);}
.hero-actions .book-btn,.hero .book-btn,.hero .hero-btn,.call-band .book-btn,.call-band .call-btn{background:var(--dv-cta);color:var(--dv-cta-text);}
.hero-actions .book-btn:hover,.hero .book-btn:hover,.hero .hero-btn:hover,.call-band .book-btn:hover,.call-band .call-btn:hover{background:var(--dv-cta-hover);}
.call-band .book-btn,.call-band .call-btn{flex-shrink:0;}

/* ---------------- service cards ---------------- */
.service-list,.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.25rem;margin:1.75rem 0 2.25rem;}
.service-card,.card,.dv-svc{background:#fff;border:1px solid var(--dv-line);border-top:3px solid var(--dv-gold);border-radius:14px;padding:1.25rem 1.4rem;transition:box-shadow .15s ease,transform .15s ease,border-color .15s ease;}
.service-card:hover,.card:hover,.dv-svc:hover{box-shadow:0 8px 24px rgba(6,31,56,.12);transform:translateY(-2px);}
.service-card h2,.service-card h3,.card h2,.card h3,.dv-svc h3{font-size:1.16rem;line-height:1.35;margin:0 0 .45rem;color:var(--dv-navy);}
.service-card h2 a,.service-card h3 a,.card h2 a,.card h3 a{color:var(--dv-navy);text-decoration:none;}
.service-card h2 a:hover,.service-card h3 a:hover,.card h2 a:hover,.card h3 a:hover{color:var(--dv-cta-hover);text-decoration:underline;}
.service-card p,.card p,.dv-svc p{margin:0;color:var(--dv-muted);font-size:.97rem;}
.service-card p+p,.card p+p,.dv-svc p+p{margin-top:.6rem;}
.service-card img,.card img{border-radius:10px;}
.photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.9rem;}
.photo-pair img{border-radius:10px;width:100%;height:140px;object-fit:cover;}
.card .content-img{max-width:100%;margin:1rem 0 0;}
.dv-svc{margin:0 0 1.25rem;}
.dv-svc h3{margin-top:0;}

/* ---------------- call band ---------------- */
.call-band{background:var(--dv-navy-deep);color:#fff;padding:1.75rem 0;margin-top:3rem;border-top:3px solid var(--dv-gold);}
.call-band p,.call-band-text{color:#fff;font-size:1.15rem;font-weight:600;}
.call-band .call-band-btn,.call-band .book-btn,.call-band .call-btn,.call-band-button{background:var(--dv-cta);color:var(--dv-cta-text);}
.call-band .call-band-btn:hover,.call-band .book-btn:hover,.call-band .call-btn:hover,.call-band-button:hover{background:var(--dv-cta-hover);}
.call-band a:not(.book-btn):not(.call-btn):not(.call-band-btn):not(.call-band-button){color:var(--dv-gold-bright);}
.call-band .call-band-title{color:#fff;}
.call-band .call-band-cta{color:#C8D9EA;}

/* ---------------- footer ---------------- */
.site-footer{padding:2rem 0 2.5rem;}
.site-footer .footer-name{font-size:1.1rem;}
.footer-grid{gap:2rem;}
.footer-heading{margin-bottom:.5rem;}
.site-footer ul{list-style:none;margin:0;padding:0;}
.site-footer li{margin-bottom:.3rem;}

/* ---------------- local area / misc sections ---------------- */
.local-area{background:var(--dv-panel);border:1px solid var(--dv-line);border-left:4px solid var(--dv-gold);border-radius:12px;padding:1.5rem 1.75rem;margin-top:2.5rem;}
.local-area h2{margin-top:0;}
.areas-list li{background:var(--dv-panel);border:1px solid var(--dv-line);border-radius:999px;padding:.35rem .9rem;font-size:.95rem;}
.phone-line{margin-top:2rem;font-size:1.08rem;}
.phone-line a{color:var(--dv-navy);font-weight:700;text-decoration:none;border-bottom:2px solid var(--dv-gold);}
.disclosure{background:var(--dv-panel);border:1px solid var(--dv-line);border-left:5px solid var(--dv-gold);border-radius:10px;padding:1rem 1.25rem;margin:1.5rem 0 2rem;font-size:.97rem;}
.note,.add-note{background:var(--dv-panel);border:1px solid var(--dv-line);border-radius:10px;padding:1rem 1.25rem;}

/* ---------------- pricing tables ---------------- */
.price-category{margin-top:2.5rem;}
.price-category h2{border-bottom:2px solid var(--dv-line);padding-bottom:.5rem;}
table{width:100%;border-collapse:collapse;margin:.75rem 0 1.5rem;font-size:.97rem;}
thead th{background:var(--dv-navy);color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;padding:.6rem .75rem;}
th,td{text-align:left;padding:.55rem .75rem;border-bottom:1px solid var(--dv-line);}
tbody tr:nth-child(even){background:var(--dv-panel);}
td:nth-child(2){font-weight:700;color:var(--dv-navy);white-space:nowrap;}
td:nth-child(3){color:var(--dv-muted);white-space:nowrap;}
.table-scroll{overflow-x:auto;}

/* ---------------- photos + video ---------------- */
.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.25rem;margin:1.5rem 0 2rem;}
.video-wrap{border-radius:12px;box-shadow:0 8px 24px rgba(6,31,56,.18);}
.video-card figcaption{margin-top:.6rem;color:var(--dv-muted);font-size:.95rem;text-align:center;}
.content-img img,.page-photo img,.service-photo img,.section-img img,.content-photo img{border-radius:12px;box-shadow:0 6px 20px rgba(6,31,56,.12);}
.page-banner{height:200px;background-position:center;background-size:cover;background-repeat:no-repeat;border-bottom:1px solid var(--dv-line);position:relative;}
.page-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,31,56,.25),rgba(6,31,56,0) 45%,rgba(6,31,56,.35));pointer-events:none;}
.header-banner img{display:block;width:100%;height:clamp(160px,30vw,300px);object-fit:cover;object-position:center;}
figure.page-banner{margin:0 0 1.75rem;}
figure.page-banner img{width:100%;max-height:340px;object-fit:cover;border-radius:14px;display:block;box-shadow:0 8px 24px rgba(6,31,56,.14);}
.hero-photo img{border-radius:14px;box-shadow:0 8px 24px rgba(6,31,56,.14);}
.gift-figure img{border-radius:12px;box-shadow:0 8px 24px rgba(6,31,56,.14);}
.gift-figure figcaption{text-align:center;color:var(--dv-muted);margin-top:.6rem;font-weight:600;}
.hero-banner{display:block;width:100%;border-radius:12px;box-shadow:0 6px 24px rgba(6,31,56,.14);}

/* ---------------- mobile ---------------- */
@media(max-width:640px){
  main h1{font-size:1.9rem;}
  section.hero h1,.dv-hero h1,.dv-hero-solo h1{font-size:2rem;}
  section.hero,.dv-hero,.dv-hero-solo{padding:1.75rem 1.25rem;border-radius:14px;}
  section.hero.hero-banner .hero-text{padding:1.6rem 1.25rem;}
  section.hero.hero-banner .dv-hero-cta{padding:0 1.25rem 1.6rem;}
  .dv-hero{grid-template-columns:1fr;gap:1.25rem;}
  .dv-hero-cta .dv-cta,.dv-hero-cta .dv-cta-ghost{width:100%;text-align:center;}
  .dv-header-call{width:100%;text-align:center;}
  .service-list,.cards{grid-template-columns:1fr;}
  .page-banner{height:120px;}
  .call-band-inner{flex-direction:column;align-items:flex-start;}
  .header-inner{flex-direction:column;align-items:flex-start;}
  table{font-size:.9rem;}
  .local-area{padding:1.25rem;}
}

/* ---------------- motion ---------------- */
@media (prefers-reduced-motion: reduce){*{transition:none !important;}}
