/* ============================================================
   Bluestone Infraguide — Mobile-first Stylesheet
   Design system: ui-ux-pro-max "Modern Professional" pairing
   Montserrat throughout, blue corporate palette
   ============================================================ */

:root {
  --font-heading: 'Montserrat', -apple-system, sans-serif;
  --font-body: 'Montserrat', -apple-system, sans-serif;
  --blue-deep:  #0d2f6b;
  --blue-mid:   #1a4fa0;
  --blue-light: #eaf1fb;
  --ink:        #14213d;
  --ink-muted:  #5b6b8c;
}

* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: var(--font-body); color:var(--ink); line-height:1.65; -webkit-font-smoothing:antialiased; }
h1, h2, h3, h4, .logo-text, .btn-solid, .btn-outline, .btn-outline-light, .btn-contact, .card-tag, .section-heading {
  font-family: var(--font-heading);
}
a { text-decoration:none; color:inherit; }
img { max-width:100%; display:block; }
ul { list-style:none; }

/* Respect reduced-motion preference site-wide */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:0.001ms !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* Scroll-reveal (subtle fade + 12px rise, per motion guidance) */
.reveal { opacity:0; transform:translateY(14px); transition:opacity .4s ease, transform .4s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* Smooth hover lift for interactive cards */
.story-card, .insight-card, .property-card, .feature-card-box, .join-us-box {
  transition:transform .25s ease, box-shadow .25s ease;
}
.story-card:hover, .insight-card:hover, .property-card:hover { transform:translateY(-4px); box-shadow:0 10px 30px rgba(13,47,107,.1); }

button, a { cursor:pointer; }
:focus-visible { outline:2px solid var(--blue-mid); outline-offset:2px; }

/* ---------- Header (mobile-first) ---------- */
html, body { overflow-x:hidden; width:100%; }
body { padding-top:60px; } /* compensates for fixed header height so content never hides behind it */

.site-header { border-bottom:1px solid #eee; position:fixed; top:0; left:0; right:0; background:#fff; z-index:1000; height:60px; }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding:0 14px; max-width:1400px; margin:0 auto; height:100%; gap:10px; position:relative; }

.logo { min-width:0; flex-shrink:1; overflow:hidden; }
.logo-text { font-weight:700; font-size:15px; letter-spacing:.3px; color:var(--accent); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }

/* Hamburger — 44x44 touch target per platform guidance */
.nav-toggle { width:44px; height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; background:none; border:none; cursor:pointer; z-index:1200; flex-shrink:0; }
.nav-toggle span { width:22px; height:2px; background:#1a1a2e; transition:.25s ease; }

/* Mobile drawer nav */
.main-nav { position:fixed; top:0; right:-100%; width:82%; max-width:320px; height:100vh; height:100dvh; background:#fff; padding:24px 20px; transition:right .3s ease; overflow-y:auto; z-index:1150; box-shadow:-4px 0 24px rgba(0,0,0,.12); }
.main-nav.open { right:0; }
.main-nav > ul { display:flex; flex-direction:column; gap:4px; margin-bottom:20px; margin-top:44px; }
.nav-link-row { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #f0f0f0; }
.main-nav > ul > li > .nav-link-row > a { display:flex; align-items:center; padding:12px 4px; font-size:15px; font-weight:600; min-height:44px; flex:1; }
.dropdown-toggle { width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:none; border:none; color:var(--ink-muted); flex-shrink:0; transition:transform .25s ease; }
.dropdown-toggle svg { transition:transform .25s ease; }
.has-dropdown.open .dropdown-toggle svg { transform:rotate(180deg); }

/* Mega-menu: mobile = flat accordion, grouped by column title */
.mega-menu { list-style:none; max-height:0; overflow:hidden; transition:max-height .4s ease; background:#f7f9fc; }
.has-dropdown.open .mega-menu { max-height:2400px; }
.mega-col { padding:6px 0; }
.mega-col-title { font-size:11px; font-weight:700; letter-spacing:.8px; color:var(--ink-muted); padding:10px 4px 4px 20px; text-transform:uppercase; }
.mega-col ul { list-style:none; display:block; }
.mega-col li a { display:flex; align-items:center; padding:10px 4px 10px 20px; min-height:40px; font-size:14px; font-weight:500; color:var(--ink-muted); border-bottom:1px solid #eef1f6; }
.btn-contact { display:flex; align-items:center; justify-content:center; min-height:44px; background:var(--accent); color:#fff; padding:0 20px; font-weight:700; font-size:13px; letter-spacing:.5px; }

.mobile-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); border:none; z-index:900; }
.mobile-overlay.active { display:block; }

/* Search icon (mobile: shown inside drawer) */
.nav-utility { display:flex; align-items:center; gap:10px; margin-top:10px; flex-wrap:wrap; }
.icon-btn { width:44px; height:44px; display:flex; align-items:center; justify-content:center; gap:6px; background:none; border:1px solid #e4e8f0; color:var(--ink); flex-shrink:0; transition:background .2s ease, border-color .2s ease; }
.icon-btn:hover { background:var(--blue-light); border-color:var(--accent); color:var(--accent); }

.search-overlay { display:none; position:fixed; top:60px; left:0; right:0; background:#fff; border-bottom:1px solid #eee; padding:16px; z-index:900; box-shadow:0 8px 24px rgba(0,0,0,.08); }
.search-overlay.open { display:block; }
.search-form { display:flex; gap:8px; max-width:700px; margin:0 auto; position:relative; align-items:center; }
.search-form input { flex:1; min-height:44px; padding:0 14px; border:1px solid #ddd; font-size:16px; font-family:inherit; }
.search-close { width:36px; height:36px; background:none; border:none; font-size:22px; color:var(--ink-muted); flex-shrink:0; }

@media (min-width: 900px) {
  body { padding-top:74px; }
  .site-header { height:74px; }
  .nav-toggle { display:none; }
  .logo-text { font-size:19px; }
  .main-nav { position:static; width:auto; max-width:none; height:auto; padding:0; box-shadow:none; display:flex; align-items:center; gap:24px; overflow:visible; }
  .main-nav { flex:1; }
  .main-nav > ul { flex-direction:row; gap:4px; margin:0 auto; flex-wrap:nowrap; }
  .main-nav > ul > li { position:static; }
  .nav-link-row { border-bottom:none; }
  .main-nav > ul > li > .nav-link-row > a { font-size:13px; padding:8px 12px; border-bottom:none; min-height:auto; white-space:nowrap; }
  .main-nav > ul > li > .nav-link-row > a { position:relative; transition:color .2s ease; }
  .main-nav > ul > li > .nav-link-row > a:hover { color:var(--accent); }
  .main-nav > ul > li > .nav-link-row > a::after { content:''; position:absolute; left:12px; right:12px; bottom:2px; height:2px; background:var(--accent); transform:scaleX(0); transition:transform .2s ease; }
  .main-nav > ul > li > .nav-link-row > a:hover::after { transform:scaleX(1); }
  .btn-contact { padding:0 22px; }
  .nav-utility { margin-top:0; flex-wrap:nowrap; }
  .search-overlay { top:74px; }

  /* Desktop mega-menu — appears on hover, multi-column floating panel */
  .dropdown-toggle { width:20px; height:20px; color:inherit; pointer-events:none; }
  .has-dropdown .mega-menu {
    position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(6px);
    display:flex; align-items:flex-start; flex-wrap:wrap; gap:0;
    max-height:none; width:max-content; max-width:calc(100vw - 32px);
    background:#fff; box-shadow:0 16px 40px rgba(13,47,107,.16); border-top:3px solid var(--accent);
    opacity:0; visibility:hidden; transition:opacity .2s ease, transform .2s ease, visibility .2s;
    z-index:50; padding:22px 0; overflow:hidden;
  }
  .has-dropdown:hover .mega-menu, .has-dropdown:focus-within .mega-menu {
    opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
  }
  .has-dropdown:hover .dropdown-toggle svg { transform:rotate(180deg); }
  .mega-col { padding:0 22px; border-left:1px solid #f0f2f7; width:230px; flex-shrink:0; }
  .mega-col-wide { width:440px; column-count:2; column-gap:20px; }
  .mega-col-wide .mega-col-title { column-span:all; }
  .mega-col:first-child { border-left:none; }
  .mega-col-title { font-size:11px; font-weight:700; letter-spacing:1px; color:var(--accent); padding:0 0 12px; white-space:nowrap; }
  .mega-col li a { padding:9px 0; font-size:13.5px; border-bottom:none; white-space:normal; line-height:1.35; }
  .mega-col li a::after { display:none; }
  .mega-col li a:hover { color:var(--accent); padding-left:4px; }
}


@media (max-width: 380px) {
  .logo-text { font-size:13px; }
  .footer-copyright, .footer-credit { white-space:normal; font-size:11px; }
}

/* ---------- Hero ---------- */
.hero { display:flex; flex-direction:column; max-width:1600px; margin:0 auto; }
.hero-text { background:linear-gradient(135deg, var(--blue-deep), var(--blue-mid)); color:#fff; padding:40px 24px; }
.hero-text h1 { font-size:28px; line-height:1.25; margin-bottom:16px; font-weight:800; }
.hero-text p { font-size:15px; opacity:.9; margin-bottom:24px; }
.btn-outline-light { display:inline-flex; align-items:center; justify-content:center; min-height:44px; border:1px solid #fff; color:#fff; padding:0 22px; font-size:13px; font-weight:700; letter-spacing:.5px; transition:background .25s ease, color .25s ease; }
.btn-outline-light:hover { background:#fff; color:var(--blue-deep); }
.hero-image img { width:100%; height:260px; object-fit:cover; }

@media (min-width: 900px) {
  .hero { flex-direction:row; }
  .hero-text { flex:0 0 45%; padding:60px; display:flex; flex-direction:column; justify-content:center; }
  .hero-text h1 { font-size:40px; }
  .hero-image { flex:1; }
  .hero-image img { height:100%; min-height:480px; }
}

/* ---------- Help Widget ---------- */
.help-widget { text-align:center; padding:40px 20px; }
.help-widget h2 { font-size:18px; letter-spacing:1px; color:#555; margin-bottom:20px; font-weight:600; }
.help-form label { display:block; margin-bottom:8px; font-style:italic; color:#333; }
.help-form select { width:100%; max-width:400px; min-height:44px; padding:10px 4px; border:none; border-bottom:2px solid var(--accent); font-size:16px; font-style:italic; background:transparent; }

/* ---------- Feature Cards (image with floating overlay card, like reference) ---------- */
.feature-card { position:relative; margin-bottom:8px; max-width:1600px; margin-left:auto; margin-right:auto; }
.feature-card-image img { width:100%; height:280px; object-fit:cover; display:block; }
.feature-card-box { background:#fff; padding:24px; margin:-40px 16px 0; position:relative; box-shadow:0 4px 20px rgba(0,0,0,.08); }
.feature-card-box h3 { font-size:16px; letter-spacing:.5px; margin-bottom:10px; text-transform:uppercase; color:var(--accent); }
.feature-card-box p { font-size:14px; color:#555; margin-bottom:16px; }
.btn-outline { display:inline-flex; align-items:center; justify-content:center; min-height:44px; border:1px solid var(--accent); color:var(--accent); padding:0 18px; font-size:12px; font-weight:700; letter-spacing:.5px; transition:background .25s ease, color .25s ease; }
.btn-outline:hover { background:var(--accent); color:#fff; }

@media (min-width: 900px) {
  .feature-card-image img { height:540px; }
  .feature-card-box {
    position:absolute; top:50%; left:60px; transform:translateY(-50%);
    max-width:380px; margin:0; padding:36px;
    box-shadow:0 14px 40px rgba(0,0,0,.16);
  }
}

/* ---------- Section Blocks / Card Grids ---------- */
.section-block { padding:48px 20px; max-width:1300px; margin:0 auto; }
.section-heading { text-align:center; font-size:15px; letter-spacing:2px; text-transform:uppercase; color:#555; margin-bottom:32px; position:relative; }
.card-grid { display:grid; grid-template-columns:1fr; gap:32px; margin-bottom:32px; }
@media (min-width: 700px) { .card-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width: 1000px) { .card-grid { grid-template-columns:repeat(3,1fr); } }

.story-card img, .insight-card img, .property-card img { width:100%; height:180px; object-fit:cover; margin-bottom:12px; }
.card-tag { font-size:11px; letter-spacing:.5px; color:var(--accent); font-weight:700; margin-bottom:8px; text-transform:uppercase; }
.story-card p, .insight-card p, .property-card p { font-size:14px; color:#444; margin-bottom:8px; }
.insight-card h4, .property-card h4 { font-size:16px; margin-bottom:8px; }
.insight-card h4 a, .property-card h4 a { color:#1a1a2e; }
.card-meta { font-size:12px; color:#888; }
.center-btn { text-align:center; }
.btn-solid { display:inline-flex; align-items:center; justify-content:center; min-height:44px; background:var(--accent); color:#fff; padding:0 28px; font-size:13px; font-weight:700; letter-spacing:.5px; border:none; cursor:pointer; transition:background .25s ease, transform .15s ease; }
.btn-solid:hover { background:var(--blue-deep); transform:translateY(-1px); }

/* ---------- Stats Band (light tint blended with a background photo, like reference) ---------- */
.stats-band {
  background:
    linear-gradient(to right, var(--blue-light) 0%, var(--blue-light) 45%, rgba(234,241,251,.55) 65%, rgba(234,241,251,0) 100%),
    url('/uploads/team.jpg');
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
  max-width:1600px; margin:0 auto 32px; padding:48px 24px; display:flex; flex-direction:column; gap:24px;
  min-height:260px; justify-content:center; align-items:flex-start;
}
.stat-number { display:block; font-size:32px; font-weight:800; color:var(--accent); }
.stat-label { font-size:14px; color:#555; }
@media (min-width: 700px) { .stats-band { flex-direction:row; justify-content:flex-start; align-items:center; gap:70px; text-align:left; padding-left:60px; } }

/* ---------- Join Us Band ---------- */
.join-us-band { position:relative; max-width:1600px; margin:0 auto; }
.join-us-image img { width:100%; height:280px; object-fit:cover; display:block; }
.join-us-box { background:#fff; padding:24px; margin:-40px 16px 0; box-shadow:0 4px 20px rgba(0,0,0,.08); position:relative; max-width:380px; }
.join-us-box h3 { color:var(--accent); margin-bottom:10px; font-size:16px; letter-spacing:.5px; text-transform:uppercase; }
.join-us-box p { font-size:14px; color:#555; margin-bottom:16px; }
@media (min-width: 900px) {
  .join-us-image img { height:560px; }
  .join-us-box {
    position:absolute; bottom:60px; left:60px; margin:0; padding:36px;
    box-shadow:0 14px 40px rgba(0,0,0,.16);
  }
}

/* ---------- News List ---------- */
.news-list { display:flex; flex-direction:column; gap:20px; }
.news-item { display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid #eee; padding-bottom:16px; }
.news-item img { width:80px; height:60px; object-fit:cover; flex-shrink:0; }
.news-text h4 { font-size:15px; margin-bottom:6px; }
.news-text h4 a { color:#1a1a2e; }

/* ---------- Footer (blue background, white text) ---------- */
.site-footer { background:linear-gradient(135deg, var(--blue-deep), var(--blue-mid)); padding:44px 20px 0; color:#fff; }
.footer-inner { display:grid; grid-template-columns:1fr; gap:32px; max-width:1300px; margin:0 auto; padding-bottom:36px; }

.footer-logo { display:inline-block; margin-bottom:14px; }
.footer-logo img { max-height:40px; }
.footer-logo-text { font-family:var(--font-heading); font-size:20px; font-weight:800; color:#fff; letter-spacing:.3px; }

.footer-about p { font-size:14px; color:rgba(255,255,255,.85); font-weight:500; margin-bottom:18px; max-width:340px; line-height:1.6; }
.footer-socials { display:flex; align-items:center; gap:10px; }
.footer-socials a { width:36px; height:36px; display:flex; align-items:center; justify-content:center; color:#fff; background:rgba(255,255,255,.12); border-radius:50%; transition:background .2s ease, transform .2s ease; }
.footer-socials a:hover { background:rgba(255,255,255,.28); transform:translateY(-2px); }

.footer-col { display:flex; flex-direction:column; gap:12px; }
.footer-col a { font-size:14px; font-weight:600; color:#fff; opacity:.9; transition:opacity .2s ease, padding-left .2s ease; }
.footer-col a:hover { opacity:1; padding-left:4px; }

@media (min-width: 800px) { .footer-inner { grid-template-columns:1.6fr 1fr 1fr; } }

.footer-bottom { border-top:1px solid rgba(255,255,255,.18); padding:20px; text-align:center; font-size:12px; color:rgba(255,255,255,.8); }
.footer-legal { margin-bottom:14px; }
.footer-legal a { margin:0 8px; color:#fff; font-weight:600; transition:opacity .2s ease; opacity:.85; }
.footer-legal a:hover { opacity:1; text-decoration:underline; }
.footer-bottom-row { display:flex; flex-direction:column; gap:10px; align-items:center; max-width:none; margin:0 auto; }
.footer-copyright { font-weight:600; color:#fff; white-space:nowrap; flex-shrink:0; }
.footer-credit { font-weight:500; color:rgba(255,255,255,.75); white-space:nowrap; flex-shrink:0; }
.footer-credit a { color:#fff; font-weight:700; }
.footer-credit a:hover { text-decoration:underline; }
.footer-divider { display:none; width:1px; height:16px; background:rgba(255,255,255,.3); }
@media (min-width: 640px) {
  .footer-bottom-row { flex-direction:row; justify-content:center; gap:20px; }
  .footer-divider { display:block; }
}

/* ---------- Page Header / Filter Bar ---------- */
.page-header { padding:48px 20px 24px; text-align:center; }
.page-header h1 { font-size:28px; color:var(--accent); margin-bottom:10px; }
.filter-bar { padding:0 20px 24px; max-width:1000px; margin:0 auto; }
.filter-form { display:flex; flex-direction:column; gap:12px; }
.filter-form select, .filter-form input { min-height:44px; padding:10px 12px; border:1px solid #ddd; font-size:16px; }
@media (min-width: 700px) { .filter-form { flex-direction:row; } }

/* ---------- Properties tabs, breadcrumb, badges ---------- */
.properties-tabs { display:inline-flex; margin-bottom:20px; border:1px solid #ddd; }
.tab-btn { padding:12px 24px; font-size:13px; font-weight:700; letter-spacing:.5px; color:var(--ink-muted); background:#fff; transition:background .2s ease, color .2s ease; }
.tab-btn.active { background:var(--accent); color:#fff; }
.breadcrumb { font-size:12px; color:var(--ink-muted); text-align:left; margin-bottom:16px; max-width:1200px; margin-left:auto; margin-right:auto; padding:0 20px; }
.breadcrumb a { color:var(--accent); }
.availability-badge { display:inline-block; background:var(--blue-deep); color:#fff; font-size:10px; font-weight:700; letter-spacing:.5px; padding:4px 10px; margin-bottom:8px; }
.results-count { color:var(--ink-muted); font-size:13px; margin-bottom:20px; text-align:center; }
.rental-price { font-size:13px; color:#444; margin-top:4px; }
.pagination { display:flex; justify-content:center; gap:8px; margin-top:32px; flex-wrap:wrap; }
.page-link { width:36px; height:36px; display:flex; align-items:center; justify-content:center; border:1px solid #ddd; font-size:13px; font-weight:600; color:var(--ink); }
.page-link.active { background:var(--accent); color:#fff; border-color:var(--accent); }

.cta-band { background:#eef2fa; padding:40px 20px; margin-top:20px; }
.cta-band-inner { max-width:1000px; margin:0 auto; display:flex; flex-direction:column; gap:20px; align-items:flex-start; text-align:left; }
.cta-band-inner h3 { color:var(--accent); font-size:20px; margin-bottom:6px; }
.cta-band-inner p { color:#555; font-size:14px; }
@media (min-width:700px) { .cta-band-inner { flex-direction:row; align-items:center; justify-content:space-between; } }

/* ---------- People page ---------- */
.people-search { max-width:700px; margin:0 auto; flex-direction:row !important; }
.people-search input { flex:1; }
.search-hint { text-align:center; font-size:12px; color:var(--ink-muted); margin-top:8px; }
.people-grid .person-card { text-align:center; }
.person-card img { width:160px; height:160px; max-width:100%; aspect-ratio:1/1; object-fit:cover; object-position:top center; margin:0 auto 14px; border-radius:50%; display:block; }
.person-card h4 { color:var(--accent); font-size:16px; margin-bottom:4px; }
.person-title { font-size:13px; color:#555; margin-bottom:4px; }
.person-location { font-size:12px; color:var(--ink-muted); margin-bottom:12px; }
.vcard-link { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--accent); min-height:44px; }
.vcard-link:hover { text-decoration:underline; }

/* ---------- Featured Services carousel ---------- */
.featured-services { max-width:1300px; margin:0 auto; padding:48px 20px; }
.featured-services-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.featured-services-head .section-heading { margin-bottom:0; }
.carousel-nav { display:flex; gap:4px; }
.carousel-btn { width:44px; height:44px; background:var(--blue-deep); color:#fff; border:none; font-size:16px; }
.carousel-btn:hover { background:var(--accent); }
.fs-card { border-top:2px solid var(--accent); padding-top:16px; }
.fs-card h3 { font-size:16px; color:var(--ink); margin-bottom:8px; }
.fs-card p { font-size:14px; color:#555; margin-bottom:16px; }
.carousel-dots { display:flex; justify-content:center; gap:8px; margin:20px 0; }
.dot { width:8px; height:8px; border-radius:50%; background:#ddd; border:none; padding:0; }
.dot.active { background:var(--accent); }

/* ---------- Office cards (Find an Office page) ---------- */
.office-card img { width:100%; height:180px; object-fit:cover; margin-bottom:12px; }
.office-card h4 { color:var(--accent); font-size:18px; margin-bottom:8px; }
.office-address { font-size:13px; color:#555; margin-bottom:4px; }
.office-card .btn-outline { margin-top:12px; }

/* ---------- About Us page ---------- */
.about-hero { position:relative; max-width:1600px; margin:0 auto; }
.about-hero-img { width:100%; height:320px; object-fit:cover; }
.about-hero-tagline { position:absolute; left:5%; top:50%; transform:translateY(-50%); font-family:Georgia, serif; font-style:italic; font-size:26px; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.4); max-width:60%; }
@media (min-width:700px) { .about-hero-img { height:440px; } .about-hero-tagline { font-size:38px; } }

.about-intro { max-width:1000px; }
.about-section { max-width:1300px; margin:0 auto; padding:40px 20px; }
.about-section-title { font-size:24px; color:var(--ink); margin-bottom:6px; }
.about-section-intro { color:#666; font-size:14px; margin-bottom:24px; max-width:700px; }
.about-card-grid { margin-bottom:0; }
.about-card img { width:100%; height:180px; object-fit:cover; margin-bottom:14px; }
.about-card h4 { font-size:14px; letter-spacing:.5px; color:var(--ink); margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #eee; }
.about-card p { font-size:14px; color:#555; }
.about-card-bordered { border:1px solid #e5e5e5; border-top:3px solid var(--accent); padding:24px; }
.about-card-bordered h4 { border-bottom:none; padding-bottom:0; }
.about-divider-image { max-width:1600px; margin:0 auto; }
.about-divider-image img { width:100%; height:420px; object-fit:cover; }
@media (max-width:700px) { .about-divider-image img { height:260px; } }

/* ---------- Careers ---------- */
.job-card { border:1px solid #e5e5e5; border-top:3px solid var(--accent); padding:24px; }
.job-card h4 { font-size:16px; margin:6px 0; }
.job-card h4 a { color:var(--ink); }
.job-location { font-size:13px; color:#666; margin-bottom:16px; }
.job-detail-page { max-width:1200px; margin:0 auto; padding:24px 20px 60px; }
.job-detail-page h1 { font-size:26px; color:var(--ink); margin:10px 0 6px; }

/* ---------- Insights Listing ---------- */
.insights-hero { background:#eef2fa; }
.insights-hero-inner { max-width:1300px; margin:0 auto; padding:44px 20px; }
.insights-hero h1 { font-size:30px; color:var(--ink); margin:10px 0; text-transform:uppercase; }
.insights-hero-sub { font-size:14px; color:#555; max-width:700px; margin-bottom:20px; }
.insights-search { display:flex; max-width:700px; }
.insights-search input { flex:1; min-height:48px; padding:0 16px; border:1px solid #ddd; font-size:16px; }
.insights-search button { width:56px; background:var(--blue-deep); color:#fff; border:none; }

.insights-layout { max-width:1300px; margin:0 auto; padding:36px 20px; display:flex; flex-direction:column; gap:32px; }
.insights-sidebar { flex-shrink:0; }
.insights-sidebar h3 { font-size:13px; letter-spacing:1px; text-transform:uppercase; color:var(--ink-muted); margin-bottom:12px; }
.topic-link { display:block; padding:10px 0; font-size:14px; font-weight:600; color:var(--ink-muted); border-bottom:1px solid #f0f0f0; }
.topic-link.active, .topic-link:hover { color:var(--accent); }
.insights-main { flex:1; }
.insight-list { display:flex; flex-direction:column; gap:24px; margin:20px 0; }
.insight-list-item { display:flex; flex-direction:column; gap:16px; padding-bottom:20px; border-bottom:1px solid #eee; }
.insight-list-item img { width:100%; height:160px; object-fit:cover; }
.insight-list-text h4 { margin:6px 0; font-size:16px; }
.insight-list-text h4 a { color:var(--ink); }
.insight-list-text p { font-size:14px; color:#555; margin-bottom:6px; }
@media (min-width:800px) {
  .insights-layout { flex-direction:row; }
  .insights-sidebar { width:240px; }
  .insight-list-item { flex-direction:row; }
  .insight-list-item img { width:220px; height:150px; flex-shrink:0; }
}

/* ---------- Subscribe band ---------- */
.subscribe-band { background:#eef2fa; padding:36px 20px; }
.subscribe-band-inner { max-width:1000px; margin:0 auto; display:flex; flex-direction:column; gap:18px; }
.subscribe-band-inner h3 { color:var(--accent); font-size:18px; margin-bottom:6px; }
.subscribe-band-inner p { font-size:13px; color:#555; }
.subscribe-form { display:flex; gap:10px; flex-direction:column; }
.subscribe-form input { flex:1; min-height:44px; padding:0 14px; border:1px solid #ddd; font-size:16px; }
@media (min-width:700px) { .subscribe-band-inner { flex-direction:row; align-items:center; justify-content:space-between; } .subscribe-form { flex-direction:row; max-width:400px; } }

/* ---------- Insight Detail ---------- */
.insight-detail-page { max-width:1200px; margin:0 auto; padding:24px 20px 0; }
.insight-hero { position:relative; margin-bottom:28px; }
.insight-hero img { width:100%; height:280px; object-fit:cover; }
.insight-hero-card { background:rgba(255,255,255,.95); padding:24px; margin-top:-1px; }
.insight-hero-card h1 { font-size:22px; color:var(--ink); text-transform:uppercase; margin-bottom:10px; }
.insight-hero-card p { font-size:14px; color:#555; margin-bottom:16px; }
@media (min-width:800px) {
  .insight-hero img { height:420px; }
  .insight-hero-card { position:absolute; top:10%; left:5%; max-width:520px; margin-top:0; box-shadow:0 14px 40px rgba(0,0,0,.15); }
  .insight-hero-card h1 { font-size:30px; }
}

.insight-body-layout { display:flex; flex-direction:column; gap:32px; margin-bottom:40px; }
.insight-body { flex:2; }
.get-report-box { flex:1; border:1px solid #e5e5e5; border-top:3px solid var(--accent); padding:24px; align-self:flex-start; }
.get-report-box h3 { color:var(--ink); font-size:16px; text-transform:uppercase; margin-bottom:16px; }
.get-report-box img { width:100%; margin-bottom:16px; }
@media (min-width:900px) { .insight-body-layout { flex-direction:row; } .get-report-box { max-width:320px; } }
.authors-section { padding:20px 0 40px; }

/* ---------- Services listing ---------- */
.service-card { border:1px solid #eee; overflow:hidden; }
.service-card img { width:100%; height:180px; object-fit:cover; }
.service-card-body { padding:20px; }
.service-card-tagline { font-size:13px; color:var(--accent); font-weight:600; margin-bottom:8px; }

/* ---------- Service Detail ---------- */
.service-detail-page { max-width:1200px; margin:0 auto; padding:24px 20px 0; }
.service-intro { display:flex; flex-direction:column; gap:24px; margin:28px 0 40px; }
.service-intro-image { width:100%; height:220px; object-fit:cover; }
@media (min-width:800px) { .service-intro { flex-direction:row-reverse; align-items:flex-start; } .service-intro-image { width:340px; flex-shrink:0; } }
.service-coverage { max-width:1100px; margin:0 auto; padding:36px 20px; border-top:1px solid #eee; }
.coverage-list { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.coverage-list a { font-size:14px; font-weight:600; color:var(--accent); padding:8px 16px; border:1px solid #ddd; }
.coverage-list a:hover { background:var(--blue-light); }
.service-stats-band { display:flex; flex-direction:column; gap:24px; background:var(--blue-light); padding:32px; align-items:center; text-align:center; }
@media (min-width:700px) { .service-stats-band { flex-direction:row; justify-content:space-around; } }

/* ---------- Property Detail (full page, matches reference structure) ---------- */
.property-detail-page { max-width:1200px; margin:0 auto; padding:24px 20px 60px; }
.property-detail-page h1 { font-size:26px; color:var(--ink); margin:10px 0 6px; text-transform:uppercase; }
.property-address { color:var(--ink-muted); font-size:14px; margin-bottom:24px; }
.property-body { display:flex; flex-direction:column; gap:32px; }
.property-main { flex:2; }
.property-sidebar { flex:1; }
@media (min-width:900px) { .property-body { flex-direction:row; } }

.property-gallery .main-image { width:100%; height:340px; object-fit:cover; margin-bottom:10px; }
.thumb { width:80px; height:60px; object-fit:cover; flex-shrink:0; cursor:pointer; opacity:.6; transition:opacity .2s ease; border:2px solid transparent; }
.thumb.active, .thumb:hover { opacity:1; border-color:var(--accent); }

.info-strip { background:#f7f8fb; padding:16px 20px; margin:20px 0; display:flex; flex-direction:column; gap:4px; }
.info-label { font-size:12px; color:var(--ink-muted); }
.info-value { font-size:14px; font-weight:700; color:var(--ink); }
.section-title { color:var(--accent); font-size:18px; margin:28px 0 12px; padding-bottom:8px; border-bottom:1px solid #eee; }
.details-table { width:100%; border-collapse:collapse; margin-bottom:12px; }
.details-table td { padding:10px 0; font-size:14px; border-bottom:1px solid #f0f0f0; }
.details-table td:first-child { color:var(--ink-muted); width:40%; }
.details-table td:last-child { font-weight:600; color:var(--ink); }
.contact-cta { display:block; text-align:center; margin-top:8px; }
.related-properties { margin-top:48px; }

/* ---------- Property Detail (legacy single-view page, e.g. before country routing) ---------- */
.property-detail { max-width:1200px; margin:0 auto; padding:24px 20px 60px; display:flex; flex-direction:column; gap:32px; }
.main-image { width:100%; height:280px; object-fit:cover; }
.thumb-row { display:flex; gap:8px; margin-top:8px; overflow-x:auto; }
.thumb-row img { width:80px; height:60px; object-fit:cover; flex-shrink:0; }
.property-info h1 { color:var(--accent); font-size:24px; margin-bottom:8px; }
.property-description { margin:16px 0; font-size:14px; color:#444; }
@media (min-width: 900px) { .property-detail { flex-direction:row; } .property-gallery { flex:1; } .property-info { flex:1; } }

/* ---------- Office / Industry Detail (reuses property-detail patterns) ---------- */
.office-detail { max-width:1000px; margin:0 auto; padding:24px 20px 60px; }
.office-detail .main-image { width:100%; height:320px; object-fit:cover; margin-bottom:24px; }
.office-detail-info h2 { color:var(--accent); font-size:24px; margin-bottom:8px; }
.office-address { margin:12px 0; font-size:14px; color:#444; }
.industry-detail { max-width:900px; margin:0 auto; padding:24px 20px 60px; }
.industry-detail .main-image { width:100%; height:300px; object-fit:cover; margin-bottom:24px; }
.industry-detail h1 { color:var(--accent); font-size:26px; margin-bottom:16px; }

/* ---------- Enquiry / Contact Forms ---------- */
.enquiry-box, .contact-form-wrap { background:#f7f8fb; padding:24px; margin-top:20px; }
.enquiry-form { display:flex; flex-direction:column; gap:12px; }
.enquiry-form input, .enquiry-form textarea { width:100%; min-height:44px; padding:12px; border:1px solid #ddd; font-size:16px; font-family:inherit; } /* 16px prevents iOS auto-zoom on focus */
.form-status { font-size:13px; color:var(--accent); margin-top:8px; }
.contact-section { max-width:1200px; margin:0 auto; padding:0 20px 60px; display:flex; flex-direction:column; gap:32px; }
.contact-office { padding:24px; }
.map-embed { margin-top:16px; }
.map-embed iframe { width:100%; height:250px; border:0; }
@media (min-width: 900px) { .contact-section { flex-direction:row; } .contact-form-wrap, .contact-office { flex:1; } }

/* ---------- Detailed form (Contact Us page) ---------- */
.contact-form-title { font-size:20px; color:var(--accent); margin-bottom:4px; }
.contact-form-note { font-size:12px; color:#888; margin-bottom:18px; }
.detailed-form .form-row { display:flex; flex-direction:column; gap:12px; }
@media (min-width: 560px) { .detailed-form .form-row { flex-direction:row; } .detailed-form .form-row .form-field { flex:1; } }
.form-field > label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; color:var(--ink); }
.form-field select { width:100%; min-height:44px; padding:0 12px; border:1px solid #ddd; font-size:16px; font-family:inherit; background:#fff; }
.radio-group { display:flex; flex-direction:column; gap:8px; }
.radio-option { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:400; min-height:32px; }
.radio-option input { width:18px; height:18px; min-height:auto; flex-shrink:0; accent-color:var(--accent); }
.consent-row { display:flex; align-items:flex-start; gap:10px; font-size:12px; color:#666; }
.consent-row input { width:18px; height:18px; min-height:auto; margin-top:2px; flex-shrink:0; accent-color:var(--accent); }
.consent-row a { color:var(--accent); text-decoration:underline; }

/* ============ Round 22: client content components ============ */
/* Logo (header + footer) */
.logo img { max-height:42px; width:auto; display:block; }
@media (min-width:900px) { .logo img { max-height:52px; } }
.footer-logo img { max-height:46px; width:auto; filter:brightness(0) invert(1); }

/* Rich text content (admin HTML) */
.rich-content-wrap { max-width:1100px; margin:0 auto; padding:36px 20px 8px; }
.rich-content { font-size:15px; line-height:1.75; color:#3d4a63; }
.rich-content h2 { font-size:22px; color:var(--ink); margin:36px 0 14px; padding-bottom:10px; border-bottom:2px solid var(--blue-light); }
.rich-content h2:first-child { margin-top:0; }
.rich-content h3 { font-size:17px; color:var(--accent); margin:24px 0 8px; }
.rich-content p { margin-bottom:14px; }
.rich-content ul { margin:0 0 18px; padding-left:0; list-style:none; }
.rich-content ul li { position:relative; padding-left:22px; margin-bottom:8px; }
.rich-content ul li::before { content:''; position:absolute; left:4px; top:10px; width:7px; height:7px; background:var(--accent); border-radius:2px; }
.rich-content a { color:var(--accent); font-weight:600; text-decoration:underline; }
.rich-content strong { color:var(--ink); }

.rich-content .check-list li { padding:14px 16px 14px 44px; background:#f6f8fc; border-left:3px solid var(--accent); margin-bottom:10px; }
.rich-content .check-list li::before { content:'✓'; width:auto; height:auto; background:none; color:#fff; background-color:var(--accent); border-radius:50%; font-size:11px; font-weight:700; width:20px; height:20px; line-height:20px; text-align:center; left:14px; top:15px; }

.rich-content .process-steps { list-style:none; counter-reset:step; padding:0; margin:0 0 24px; display:grid; grid-template-columns:1fr; gap:16px; }
.rich-content .process-steps > li { counter-increment:step; position:relative; background:#fff; border:1px solid #e6eaf2; border-top:3px solid var(--accent); padding:22px 20px 16px 20px; margin:0; }
.rich-content .process-steps > li::before { content:counter(step, decimal-leading-zero); position:static; display:block; width:auto; height:auto; background:none; font-size:28px; font-weight:800; color:var(--blue-light); -webkit-text-stroke:1px var(--accent); margin-bottom:6px; }
.rich-content .process-steps h3 { margin-top:0; color:var(--ink); }
.rich-content .process-steps p { font-size:14px; }
@media (min-width:800px) { .rich-content .process-steps { grid-template-columns:repeat(2,1fr); } }

.rich-content .two-col-cards, .rich-content .markets-grid { display:grid; grid-template-columns:1fr; gap:16px; margin-bottom:18px; }
.rich-content .two-col-cards > div, .rich-content .markets-grid > div { background:var(--blue-light); padding:20px; }
.rich-content .two-col-cards h3, .rich-content .markets-grid h3 { margin-top:0; color:var(--ink); }
.rich-content .markets-grid p { margin:0; font-size:14px; }
@media (min-width:700px) { .rich-content .two-col-cards { grid-template-columns:repeat(2,1fr); } .rich-content .markets-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px) { .rich-content .markets-grid { grid-template-columns:repeat(4,1fr); } }

/* FAQ accordion */
.faq-section { max-width:900px; margin:0 auto; padding:44px 20px; }
.faq-list { display:flex; flex-direction:column; gap:10px; }
.faq-item { border:1px solid #e3e8f1; background:#fff; transition:box-shadow .2s ease; }
.faq-item[open] { box-shadow:0 6px 20px rgba(13,47,107,.08); border-color:var(--accent); }
.faq-item summary { list-style:none; cursor:pointer; padding:16px 48px 16px 18px; font-weight:700; font-size:15px; color:var(--ink); position:relative; min-height:44px; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:'+'; position:absolute; right:18px; top:50%; transform:translateY(-50%); font-size:22px; font-weight:400; color:var(--accent); }
.faq-item[open] summary::after { content:'−'; }
.faq-answer { padding:0 18px 18px; font-size:14px; line-height:1.7; color:#4a5670; }

/* Enquiry form block */
.enquiry-section { background:linear-gradient(135deg, var(--blue-deep), var(--blue-mid)); padding:48px 20px; margin-top:20px; }
.enquiry-section-inner { max-width:1100px; margin:0 auto; display:flex; flex-direction:column; gap:28px; }
.enquiry-section-text h2 { color:#fff; font-size:24px; margin-bottom:10px; }
.enquiry-section-text p { color:rgba(255,255,255,.85); font-size:14px; line-height:1.7; }
.enquiry-section .enquiry-form { background:#fff; padding:24px; box-shadow:0 20px 50px rgba(0,0,0,.2); }
.form-row-2 { display:flex; flex-direction:column; gap:12px; }
@media (min-width:600px) { .form-row-2 { flex-direction:row; } .form-row-2 > * { flex:1; } }
@media (min-width:900px) { .enquiry-section-inner { flex-direction:row; align-items:center; } .enquiry-section-text { flex:1; } .enquiry-section .enquiry-form { flex:1.2; } }

/* Partner brand logos */
.brand-logos-section { max-width:1200px; margin:0 auto; padding:40px 20px; }
.brand-logo-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media (min-width:600px) { .brand-logo-grid { grid-template-columns:repeat(4,1fr); } }
@media (min-width:1000px) { .brand-logo-grid { grid-template-columns:repeat(6,1fr); } }
.brand-logo { display:flex; align-items:center; justify-content:center; height:96px; padding:16px; background:#fff; border:1px solid #edf0f6; transition:box-shadow .25s ease, transform .25s ease; }
.brand-logo img { max-height:56px; max-width:100%; object-fit:contain; filter:grayscale(100%); opacity:.7; transition:filter .25s ease, opacity .25s ease; }
.brand-logo:hover { box-shadow:0 8px 24px rgba(13,47,107,.1); transform:translateY(-2px); }
.brand-logo:hover img { filter:grayscale(0); opacity:1; }