/* ==========================================================
   custom.css - extracted from inline styles (all pages)
   Load AFTER css/style.css
   ========================================================== */

/* Footer / info icons */
.icon-blue{color:#2e86c1;}

/* Card heading icons (contact page) */
.card-icon{color:#2e86c1;margin-right:8px;}

/* Home hero slide backgrounds */
.hero .slide-bg-1{background-image:url('../images/3-2-1536x1025.jpeg');}
.hero .slide-bg-2{background-image:url('../images/4.webp');}
.hero .slide-bg-3{background-image:url('../images/3.webp');}

/* Inner-page heroes (contact / insurance / services) */
.page-hero{background-size:cover;background-position:center;position:relative;}
.hero-contact{background-image:url('../images/about.png');}
.hero-insurance{background-image:url('../images/about.png');}
.hero-services{background-image:url('../images/service.png');}
.page-hero .hero-overlay{position:absolute;inset:0;background:rgba(0,0,0,0.55);}
.page-hero .hans-wrap{position:relative;z-index:2;}
.page-hero .hans-kicker{color:#f39c12;}
.page-hero h1{color:#fff;}
.page-hero .hans-wrap > p{color:rgba(255,255,255,0.9);}

/* About Hans hero */
.about-hero{background-image:url('../images/about-hans.png');background-size:cover;background-position:center;min-height:420px;display:flex;align-items:center;position:relative;padding:80px 30px;}
.about-hero-inner{position:relative;z-index:2;max-width:1180px;margin:0 auto;width:100%;}
.about-hero-badge{display:inline-block;background:#f39c12;color:#fff;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:5px 16px;border-radius:20px;margin-bottom:16px;}
.about-hero h1{font-family:Georgia,serif;color:#fff;font-size:46px;line-height:1.2;margin:0 0 16px;}
.about-hero p{font-size:18px;color:rgba(255,255,255,0.92);max-width:700px;margin:0;}

/* Insurance page centered note */
.center-note{max-width:780px;margin:0 auto;text-align:center;color:#5f6f7a;}

/* ---- Batch 2: service/location/article pages ---- */
.hans-card h3 a, .img-card-body h3 a, .svc-box h4 a, .grid-cards .card a{color:inherit;text-decoration:none;}
.hans-card h3 a:hover, .img-card-body h3 a:hover, .svc-box h4 a:hover, .grid-cards .card a:hover{text-decoration:underline;}
a.hans-pill{text-decoration:none;color:inherit;}
a.hans-pill:hover{text-decoration:underline;}
.related-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.article-body{max-width:820px;margin:0 auto;}
.article-body h2{margin:32px 0 10px;}
.article-body p{margin:14px 0;line-height:1.75;}
.article-body ul{margin:14px 0 14px 22px;line-height:1.75;}
.crisis-note{background:#fdf3e7;border-left:4px solid #f39c12;padding:12px 16px;margin:18px 0;border-radius:6px;font-size:15px;}

/* ---- Main nav dropdown menus (fixed for style.css breakpoints) ---- */
/* NOTE: style.css sets ".main-nav ul{display:flex !important}" inside its media
   queries, which also targets nested dropdown lists. These rules therefore use
   !important + higher specificity to win. Site breakpoint is 900/901px. */

.main-nav li.has-dropdown{position:relative;}
.main-nav .caret{font-size:10px;margin-left:5px;opacity:.7;}

/* ---------- DESKTOP (901px and up) ---------- */
@media (min-width:901px){
  /* Hidden by default - must override style.css !important */
  .main-nav ul li.has-dropdown > ul.dropdown{
    display:none !important;
    position:absolute;
    top:100%;
    left:0;
    min-width:250px;
    flex-direction:column !important;
    background:#fff;
    border-radius:8px;
    box-shadow:0 12px 30px rgba(0,0,0,.15);
    padding:8px 0 !important;
    margin:0;
    list-style:none;
    z-index:2000;
  }
  /* Shown on hover / keyboard focus */
  .main-nav ul li.has-dropdown:hover > ul.dropdown,
  .main-nav ul li.has-dropdown:focus-within > ul.dropdown{
    display:flex !important;
  }
  .main-nav ul li.has-dropdown > ul.dropdown li{width:100%;}
  .main-nav ul li.has-dropdown > ul.dropdown li a{
    display:block;
    padding:10px 18px;
    font-size:12.5px;
    white-space:nowrap;
    text-transform:none;
    letter-spacing:0;
    color:#26323a;
  }
  .main-nav ul li.has-dropdown > ul.dropdown li a:hover{background:#f2f7fb;color:var(--primary);}

  /* Keep 8 items on one line on narrower desktops */
  @media (max-width:1150px){
    .main-nav ul li a{padding:12px 8px;font-size:12px;}
  }
}

/* ---------- MOBILE (900px and below) ---------- */
@media (max-width:900px){
  /* Sub-items always visible inside the hamburger menu, slightly indented */
  .main-nav ul li.has-dropdown > ul.dropdown{
    display:flex !important;
    flex-direction:column !important;
    position:static;
    box-shadow:none;
    background:#fafcfe;
    border-radius:0;
    padding:0 !important;
    margin:0;
    list-style:none;
  }
  .main-nav ul li.has-dropdown > ul.dropdown li a{
    padding:13px 20px;
    font-size:15px;
    font-weight:500;
    color:#5f6f7a;
    text-align:center;
    border-bottom:1px solid #eef2f5;
  }
  .main-nav .caret{display:none;}
}

/* ---- Accessibility & heading structure ---- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:5000;background:#2e86c1;color:#fff;padding:10px 18px;border-radius:0 0 6px 0;font-size:14px;font-weight:600;}
.skip-link:focus{left:0;}
.main-nav a:focus-visible,.nav-toggle:focus-visible,.hans-btn:focus-visible,.btn-booking:focus-visible{outline:3px solid #f39c12;outline-offset:2px;}

/* Slider sub-headings styled identically to the hero H1 */
.slide-content h2.slide-heading{font-family:'Merriweather',serif;font-size:48px;font-weight:700;color:#fff;line-height:1.22;margin-bottom:16px;text-shadow:1px 2px 10px rgba(0,0,0,.35);}
@media (max-width:900px){.slide-content h2.slide-heading{font-size:31px;}}
@media (max-width:600px){.slide-content h2.slide-heading{font-size:28px;}}
