/*
Theme Name: Achieng Cartley & Company Advocates
Theme URI: https://cartleyadvocates.com
Author: Achieng Cartley & Company Advocates
Description: Bespoke WordPress theme for Achieng Cartley & Company Advocates -- Corporate & Commercial Law, Real Estate/Conveyancing, Corporate Secretarial Practice, and Dispute Resolution. Includes a Contact Us form and a Request a Quote form (both with an arithmetic captcha + spam protection), configurable SMTP settings, a Google Map on the contact details, standalone pages for every menu item, and styled blog archive/single post templates.
Version: 1.0.0
Requires at least: 5.9
Requires PHP: 7.4
Text Domain: cartley
*/

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --navy:#0d2e64;
  --navy-deep:#081b3d;
  --teal:#0d5760;
  --gold:#d9b36a;
  --gold-dark:#b8903f;
  --gold-light:#ecd9ad;
  --white:#ffffff;
  --off-white:#f5f7fa;
  --text-dark:#12203d;
  --text-body:#48546a;
  --text-muted:#7b8496;
  --border:rgba(13,46,100,.1);
}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:'Inter',sans-serif;color:var(--text-body);background:var(--white);line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden;width:100%}
h1,h2,h3,h4{font-family:'Playfair Display',serif}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{max-width:100%;display:block}

/* Safety net: CSS Grid children default to a minimum width based on their
   content's natural size, which lets long unbroken text (emails, URLs) force
   a grid - and the whole page - wider than the viewport on mobile. This
   overrides that default across every grid section on the site. */
.about-g>*,.pa-row>*,.lead-g>*,.contact-split>*,.cf-row>*,.values-g>*,.blog-grid>*{min-width:0}

/* NAV */
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 0;transition:.3s}
/* Keep the fixed navbar (and mobile menu) below the WP admin bar when logged in */
body.admin-bar .navbar{top:32px}
body.admin-bar .mob-menu{top:32px;height:calc(100% - 32px)}
@media screen and (max-width:782px){
    body.admin-bar .navbar{top:46px}
    body.admin-bar .mob-menu{top:46px;height:calc(100% - 46px)}
}
.navbar.scrolled{background:rgba(8,27,61,.96);backdrop-filter:blur(16px);box-shadow:0 2px 24px rgba(0,0,0,.25);padding:10px 0}
.nav-c{max-width:1240px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between}
.nav-logo img{height:44px;width:auto}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-link{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.82);letter-spacing:.05em;text-transform:uppercase;transition:.25s}
.nav-link:hover{color:var(--gold-light)}
.nav-cta{background:var(--gold);color:var(--navy-deep)!important;padding:10px 22px;border-radius:4px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;transition:.25s}
.nav-cta:hover{background:var(--gold-light)}
.nav-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;background:none;border:none;cursor:pointer;width:44px;height:44px;padding:0;flex-shrink:0}
.nav-toggle span{width:22px;height:2px;background:var(--white)}
.mob-menu{display:none;position:fixed;inset:0;background:var(--navy-deep);z-index:999;flex-direction:column;align-items:center;justify-content:center;gap:28px;opacity:0;visibility:hidden;transition:.3s}
.mob-menu.active{opacity:1;visibility:visible}
.mob-menu a{font-family:'Playfair Display',serif;font-size:22px;color:var(--white)}

/* HERO */
.hero{min-height:100vh;background:var(--navy);position:relative;overflow:hidden;display:flex;align-items:center}
.hero-bg{position:absolute;inset:0;background-image:url('assets/hero-bg.jpg');background-size:cover;background-position:center;z-index:0}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(150deg,rgba(13,87,96,.88) 0%,rgba(13,46,100,.90) 55%,rgba(8,27,61,.94) 100%);z-index:0}
.hero-frame{position:absolute;top:100px;left:28px;right:28px;bottom:28px;border:1.5px solid rgba(217,179,106,.35);pointer-events:none;z-index:1}
.hero-c{max-width:900px;margin:0 auto;padding:0 24px;position:relative;z-index:2;text-align:center}
.hero-mark{width:74px;height:auto;margin:0 auto 30px;opacity:0;transform:translateY(-16px);animation:fu .8s .3s cubic-bezier(.2,.8,.2,1) forwards}
.hero-eyebrow{font-size:12px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-light);margin-bottom:20px;opacity:0;transform:translateY(20px);animation:fu .8s .5s cubic-bezier(.2,.8,.2,1) forwards}
.hero h1{font-size:clamp(34px,5.2vw,60px);font-weight:600;color:var(--white);line-height:1.18;margin-bottom:20px;opacity:0;transform:translateY(24px);animation:fu .8s .65s cubic-bezier(.2,.8,.2,1) forwards}
.hero-tagline{font-family:'Playfair Display',serif;font-style:italic;font-size:19px;color:var(--gold-light);margin-bottom:38px;opacity:0;transform:translateY(20px);animation:fu .8s .8s cubic-bezier(.2,.8,.2,1) forwards}
.hero-acts{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;opacity:0;transform:translateY(20px);animation:fu .8s 1s cubic-bezier(.2,.8,.2,1) forwards}
.btn{display:inline-flex;align-items:center;gap:9px;padding:15px 30px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:2px;transition:.25s;cursor:pointer;border:none}
.btn-gold{background:var(--gold);color:var(--navy-deep)}
.btn-gold:hover{background:var(--gold-light);transform:translateY(-2px)}
.btn-outline{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.35)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold-light)}
@keyframes fu{to{opacity:1;transform:translateY(0)}}

/* SECTION SHARED */
.sec{padding:110px 24px}
.sec-c{max-width:1200px;margin:0 auto}
.eyebrow{font-size:11.5px;font-weight:700;color:var(--gold-dark);letter-spacing:.2em;text-transform:uppercase;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:'';width:28px;height:2px;background:var(--gold-dark)}
.sec-title{font-size:clamp(28px,4vw,42px);font-weight:600;color:var(--text-dark);line-height:1.2;margin-bottom:22px}
.rv{opacity:0;transform:translateY(32px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1)}
.rv.vis{opacity:1;transform:translateY(0)}
.rd1{transition-delay:.1s}.rd2{transition-delay:.2s}.rd3{transition-delay:.3s}.rd4{transition-delay:.4s}

/* ABOUT */
.about-g{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.about-g p{font-size:15.5px;color:var(--text-body);margin-bottom:16px}
.about-photo-wrap{position:relative}
.about-photo-wrap img{border-radius:8px;box-shadow:0 30px 60px rgba(13,46,100,.2)}
.about-photo-accent{position:absolute;inset:-16px -16px auto auto;width:70%;height:70%;border:2px solid var(--gold);z-index:-1;border-radius:8px}

/* VISION / MISSION */
.vm{background:var(--navy);position:relative;overflow:hidden}
.vm::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 85% 20%,rgba(217,179,106,.08),transparent 50%)}
.vm .eyebrow{color:var(--gold-light)}
.vm .eyebrow::before{background:var(--gold-light)}
.vm .sec-title{color:var(--white)}
.vm-g{display:flex;flex-direction:column;gap:26px;max-width:900px;margin:0 auto}
.vm-row{display:flex;align-items:stretch}
.vm-tab{background:var(--gold);color:var(--navy-deep);font-family:'Playfair Display',serif;font-weight:700;font-style:italic;font-size:14px;display:flex;align-items:center;padding:0 30px;clip-path:polygon(0 0,100% 0,88% 100%,0% 100%);min-width:190px}
.vm-body{background:var(--white);padding:26px 34px;border-radius:0 6px 6px 0;flex:1;font-size:15px;color:var(--text-body)}
@media(max-width:640px){.vm-row{flex-direction:column}.vm-tab{clip-path:none;padding:14px 22px;min-width:0}.vm-body{border-radius:0 0 6px 6px}}

/* VALUES */
.values{background:var(--off-white)}
.values-hd{text-align:center;margin-bottom:56px}
.values-hd .eyebrow,.values-hd .sec-title{justify-content:center}
.values-g{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:900px;margin:0 auto}
.val-row{display:flex;align-items:stretch}
.val-tab{background:var(--gold);color:var(--navy-deep);font-family:'Playfair Display',serif;font-weight:700;font-size:15px;display:flex;align-items:center;justify-content:center;min-width:64px;clip-path:polygon(0 0,100% 0,80% 100%,0% 100%)}
.val-body{background:var(--white);padding:20px 26px;flex:1;border-radius:0 6px 6px 0}
.val-body h4{font-size:15.5px;color:var(--text-dark);margin-bottom:4px}
.val-body p{font-size:13.5px;color:var(--text-muted)}
@media(max-width:640px){.values-g{grid-template-columns:1fr}}

/* PRACTICE AREAS */
.practice{background:var(--white)}
.practice-hd{text-align:center;margin-bottom:60px}
.practice-hd .eyebrow,.practice-hd .sec-title{justify-content:center}
.pa-row{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:56px 0;border-bottom:1px solid var(--border)}
.pa-row:last-child{border-bottom:none}
.pa-row.reverse .pa-text{order:2}
.pa-row.reverse .pa-photo{order:1}
.pa-label{font-size:12px;font-weight:700;color:var(--gold-dark);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.pa-text h3{font-size:23px;color:var(--text-dark);margin-bottom:14px}
.pa-text p{font-size:14.5px;color:var(--text-body);margin-bottom:16px}
.pa-list{margin-left:2px}
.pa-list li{position:relative;padding-left:22px;margin-bottom:9px;font-size:14px;color:var(--text-body)}
.pa-list li::before{content:'';position:absolute;left:0;top:8px;width:8px;height:8px;background:var(--gold);border-radius:50%}
.pa-photo img{border-radius:10px;box-shadow:0 20px 50px rgba(13,46,100,.15);width:100%;aspect-ratio:4/3;object-fit:cover}
@media(max-width:900px){.pa-row,.pa-row.reverse{grid-template-columns:1fr}.pa-row.reverse .pa-text{order:1}.pa-row.reverse .pa-photo{order:2}}

/* LEADERSHIP */
.leadership{background:var(--navy-deep);position:relative;overflow:hidden}
.leadership::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 15% 80%,rgba(217,179,106,.07),transparent 50%)}
.lead-g{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center;position:relative;z-index:1}
.lead-photo-wrap{position:relative}
.lead-photo-wrap img{border-radius:8px;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.lead-photo-accent{position:absolute;inset:auto -16px -16px auto;width:60%;height:60%;border:2px solid var(--gold);z-index:-1;border-radius:8px}
.leadership .eyebrow{color:var(--gold-light)}
.leadership .eyebrow::before{background:var(--gold-light)}
.leadership .sec-title{color:var(--white)}
.lead-name{font-size:19px;font-weight:600;color:var(--white);margin-bottom:4px}
.lead-role{font-size:13.5px;color:var(--gold-light);margin-bottom:4px}
.lead-creds{font-size:12.5px;color:rgba(255,255,255,.55);margin-bottom:22px;letter-spacing:.02em}
.lead-bio{font-size:14.5px;color:rgba(255,255,255,.78);margin-bottom:0}

/* CONTACT */
.contact{background:var(--off-white)}
.contact-c{max-width:1000px;margin:0 auto;text-align:center}
.contact-hd{margin-bottom:50px}
.contact-hd .eyebrow,.contact-hd .sec-title{justify-content:center}
.contact-g{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.contact-card{background:var(--white);border-radius:10px;padding:32px 22px;border:1px solid var(--border);transition:.3s;min-width:0}
.contact-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(13,46,100,.1);border-color:rgba(217,179,106,.4)}
.contact-ic{width:48px;height:48px;background:rgba(13,46,100,.06);color:var(--navy);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;margin:0 auto 16px}
.contact-card h4{font-size:12px;font-weight:700;color:var(--text-dark);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.contact-card p{font-size:13.5px;color:var(--text-body);line-height:1.6;overflow-wrap:break-word;word-break:break-word;min-width:0}
.contact-card a{color:var(--navy);font-weight:600;overflow-wrap:break-word;word-break:break-word}
@media(max-width:900px){.contact-g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.contact-g{grid-template-columns:1fr}}

/* FOOTER */
.footer{background:var(--navy-deep);padding:50px 24px 26px;text-align:center}
.footer img{height:52px;margin:0 auto 14px}
.footer-tag{font-size:12px;color:var(--gold-light);letter-spacing:.12em;text-transform:uppercase;margin-bottom:26px}
.footer-div{width:60px;height:1px;background:rgba(255,255,255,.12);margin:0 auto 20px}
.footer-cp{font-size:12.5px;color:rgba(255,255,255,.4)}

/* RESPONSIVE */
@media(max-width:900px){
  .about-g{grid-template-columns:1fr;gap:40px}
  .about-photo-wrap{order:-1}
  .lead-g{grid-template-columns:1fr;gap:40px}
  .lead-photo-wrap{max-width:280px;margin:0 auto}
}
@media(max-width:768px){
  .nav-links{display:none}
  .nav-toggle{display:flex}
  .mob-menu{display:flex}
  .sec{padding:76px 20px}
  .hero{min-height:72vh}
  .hero-frame{border-top:none}
  .hero-c{padding:0 36px}
  .hero-mark{width:56px;margin-bottom:20px}
  .hero-acts{margin-top:4px;flex-wrap:nowrap;gap:10px}
  .hero-acts .btn{padding:13px 14px;font-size:11px;gap:6px;flex:1;white-space:nowrap;justify-content:center}
}
@media(max-width:480px){
  .hero{min-height:64vh}
  .hero-frame{left:12px;right:12px}
  .hero-c{padding:0 28px}
  .hero-acts{gap:8px}
  .hero-acts .btn{padding:12px 8px;font-size:9.5px;gap:4px}
}

/* ============================================
   ADDITIONS FOR WORDPRESS: extra nav items, forms,
   captcha, quote drawer, map embed, page banners,
   blog archive & single post, misc
   ============================================ */

/* Extra CTA styling so "Request a Quote" reads as a second, slightly
   different action beside the existing gold Contact Us button */
.nav-cta.nav-cta-outline{background:transparent;color:var(--gold-light)!important;border:1.5px solid rgba(217,179,106,.55)}
.nav-cta.nav-cta-outline:hover{background:rgba(217,179,106,.12);color:var(--white)!important}

/* Honeypot anti-spam field: hidden from real visitors, left for bots to fill in */
.cartley-hp-wrap{position:absolute!important;left:-9999px!important;top:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

/* CONTACT FORM (used on the homepage contact section and the Contact page) */
.contact-form-wrap{background:var(--white);border-radius:10px;padding:40px;border:1px solid var(--border);text-align:left;max-width:640px;margin:0 auto}
.contact-form-wrap h3{font-size:20px;color:var(--text-dark);margin-bottom:22px;text-align:center}
.cf-group{margin-bottom:18px}
.cf-group label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin-bottom:7px}
.cf-group input,.cf-group textarea,.cf-group select{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:4px;font-family:'Inter',sans-serif;font-size:14px;color:var(--text-dark);background:var(--off-white);transition:.2s}
.cf-group input:focus,.cf-group textarea:focus,.cf-group select:focus{outline:none;border-color:var(--gold-dark);background:var(--white)}
.cf-group textarea{resize:vertical;min-height:110px}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.cf-row{grid-template-columns:1fr}}
.cf-submit{width:100%;justify-content:center;margin-top:6px}
.cf-actions-row{display:flex;gap:12px;margin-top:6px}
.cf-actions-row .cf-submit,.cf-actions-row .btn-whatsapp{flex:1;width:auto;margin-top:0;padding:11px 14px;font-size:11px;gap:6px;white-space:nowrap}
.cf-actions-row .btn-whatsapp .iconify{font-size:15px}
@media(max-width:480px){.cf-actions-row .cf-submit,.cf-actions-row .btn-whatsapp{padding:10px 6px;font-size:9.5px;gap:4px}}
.cf-status{margin-top:14px;font-size:13.5px;text-align:center}
.cf-status.success{color:#1a7a3c}
.cf-status.error{color:#c0392b}

/* MAP */
.map-wrap{border-radius:10px;overflow:hidden;box-shadow:0 20px 50px rgba(13,46,100,.12);border:1px solid var(--border);margin-top:50px}
.map-wrap iframe{width:100%;height:380px;border:0;display:block}

/* REQUEST A QUOTE DRAWER */
.quote-drawer-backdrop{position:fixed;inset:0;background:rgba(8,27,61,.55);z-index:1998;opacity:0;visibility:hidden;transition:.3s}
.quote-drawer-backdrop.active{opacity:1;visibility:visible}
.quote-drawer{position:fixed;top:0;right:-420px;width:100%;max-width:420px;height:100%;background:var(--white);z-index:1999;transition:right .35s cubic-bezier(.2,.8,.2,1);overflow-y:auto;box-shadow:-10px 0 40px rgba(0,0,0,.2)}
body.admin-bar .quote-drawer{top:32px;height:calc(100% - 32px)}
@media screen and (max-width:782px){body.admin-bar .quote-drawer{top:46px;height:calc(100% - 46px)}}
.quote-drawer.active{right:0}
.quote-drawer-header{background:var(--navy);color:var(--white);padding:26px 28px;display:flex;align-items:center;justify-content:space-between}
.quote-drawer-header h3{font-size:18px;color:var(--white);margin:0}
.quote-drawer-close{background:none;border:none;color:var(--gold-light);font-size:22px;cursor:pointer;line-height:1}
.quote-drawer-body{padding:28px}
.quote-drawer-body p.qd-intro{font-size:13.5px;color:var(--text-body);margin-bottom:22px}

/* Floating "Request a Quote" trigger used on pages other than via nav (mobile-friendly) */
.quote-float-btn{position:fixed;bottom:26px;right:26px;z-index:900;background:var(--gold);color:var(--navy-deep);padding:14px 22px;border-radius:30px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 10px 30px rgba(13,46,100,.3);display:inline-flex;align-items:center;gap:8px;cursor:pointer;border:none;transition:.25s}
.quote-float-btn:hover{background:var(--gold-light);transform:translateY(-2px)}
@media(max-width:640px){.quote-float-btn{bottom:18px;right:18px;padding:12px 18px;font-size:11.5px}}

/* PAGE BANNER (About / Practice Areas / Leadership / Contact standalone pages) */
.page-banner{background:var(--navy);position:relative;overflow:hidden;padding:170px 24px 70px;text-align:center}
.page-banner::before{content:'';position:absolute;inset:0;background:linear-gradient(150deg,rgba(13,87,96,.88) 0%,rgba(13,46,100,.90) 55%,rgba(8,27,61,.94) 100%)}
.page-banner-c{position:relative;z-index:1;max-width:800px;margin:0 auto}
.page-banner .eyebrow{color:var(--gold-light);justify-content:center}
.page-banner .eyebrow::before{background:var(--gold-light)}
.page-banner h1{font-size:clamp(28px,4.4vw,44px);font-weight:600;color:var(--white);line-height:1.2;margin:0}
.page-banner-crumb{margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.6)}
.page-banner-crumb a{color:var(--gold-light);font-weight:600}
.page-banner-crumb a:hover{color:var(--white)}

/* BLOG ARCHIVE */
.blog-archive{background:var(--off-white)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
@media(max-width:960px){.blog-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr}}
.blog-card{background:var(--white);border-radius:10px;overflow:hidden;border:1px solid var(--border);transition:.3s;display:flex;flex-direction:column}
.blog-card:hover{transform:translateY(-5px);box-shadow:0 20px 45px rgba(13,46,100,.12);border-color:rgba(217,179,106,.4)}
.blog-card-thumb{aspect-ratio:16/10;background:linear-gradient(135deg,var(--navy),var(--teal));display:flex;align-items:center;justify-content:center;overflow:hidden}
.blog-card-thumb img{width:100%;height:100%;object-fit:cover}
.blog-card-thumb .iconify{font-size:40px;color:rgba(255,255,255,.35)}
.blog-card-body{padding:24px 22px;flex:1;display:flex;flex-direction:column}
.blog-card-meta{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:10px}
.blog-card-body h3{font-size:18px;color:var(--text-dark);margin-bottom:10px;line-height:1.3}
.blog-card-body h3 a:hover{color:var(--navy)}
.blog-card-body p{font-size:13.5px;color:var(--text-body);flex:1}
.blog-card-more{margin-top:14px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--navy);display:inline-flex;align-items:center;gap:6px}
.blog-card-more:hover{color:var(--gold-dark)}
.blog-pagination{display:flex;justify-content:center;gap:10px;margin-top:56px;flex-wrap:wrap}
.blog-pagination a,.blog-pagination span{padding:10px 16px;border-radius:4px;font-size:13px;font-weight:600;border:1px solid var(--border);color:var(--text-body)}
.blog-pagination .current{background:var(--navy);color:var(--white);border-color:var(--navy)}
.blog-pagination a:hover{border-color:var(--gold-dark);color:var(--navy)}
.blog-empty{text-align:center;color:var(--text-muted);padding:60px 0}

/* SINGLE POST */
.single-post{background:var(--white)}
.single-post-wrap{max-width:780px;margin:0 auto}
.single-post-meta{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:14px}
.single-post-title{font-size:clamp(26px,4vw,38px);color:var(--text-dark);margin-bottom:24px;line-height:1.25}
.single-post-thumb{border-radius:10px;overflow:hidden;margin-bottom:36px;box-shadow:0 20px 50px rgba(13,46,100,.12)}
.single-post-content{font-size:15.5px;color:var(--text-body)}
.single-post-content p{margin-bottom:18px}
.single-post-content h2,.single-post-content h3{color:var(--text-dark);margin:32px 0 14px}
.single-post-content ul,.single-post-content ol{margin:0 0 18px 22px}
.single-post-content a{color:var(--navy);font-weight:600;border-bottom:1px solid rgba(13,46,100,.25)}
.single-post-content a:hover{color:var(--gold-dark);border-color:var(--gold-dark)}
.single-post-content blockquote{border-left:3px solid var(--gold);padding:4px 0 4px 22px;font-style:italic;color:var(--text-dark);margin:24px 0}
.single-post-nav{display:flex;justify-content:space-between;gap:20px;margin-top:50px;padding-top:30px;border-top:1px solid var(--border);flex-wrap:wrap}
.single-post-nav a{font-size:13px;font-weight:600;color:var(--navy);max-width:45%}
.single-post-nav a:hover{color:var(--gold-dark)}
.single-post-nav .next{text-align:right;margin-left:auto}

/* GENERIC PAGE (page.php fallback) */
.generic-page-content{max-width:820px;margin:0 auto;font-size:15.5px;color:var(--text-body)}
.generic-page-content p{margin-bottom:16px}
.generic-page-content h2,.generic-page-content h3{color:var(--text-dark);margin:28px 0 14px}

/* 404 */
.error-404{text-align:center;background:var(--off-white)}
.error-404 .code{font-family:'Playfair Display',serif;font-size:110px;font-weight:700;color:var(--navy);line-height:1;margin-bottom:10px}
.error-404 p{font-size:15px;color:var(--text-body);margin-bottom:26px}

/* CONTACT: form + map as one row, two columns */
.contact-split{display:grid;grid-template-columns:1fr 1fr;gap:34px;margin-top:50px;align-items:stretch}
.contact-split .contact-form-wrap{margin:0;max-width:none;height:100%}
.contact-split .map-wrap{margin-top:0;height:100%;min-height:420px}
.contact-split .map-wrap iframe{height:100%;min-height:420px}
@media(max-width:900px){
    .contact-split{grid-template-columns:1fr;gap:30px}
    .contact-split .map-wrap{min-height:320px}
    .contact-split .map-wrap iframe{min-height:320px}
}

/* WHATSAPP NOW BUTTON (Contact section + Request a Quote drawer) */
.btn-whatsapp{display:flex;align-items:center;justify-content:center;gap:9px;padding:14px 20px;background:#25D366;color:#ffffff;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-radius:4px;transition:.25s}
.btn-whatsapp:hover{background:#1ebc59;transform:translateY(-2px)}
.btn-whatsapp .iconify{font-size:18px}

/* ============================================
   COOKIE CONSENT BANNER + PREFERENCES MODAL
   ============================================ */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;transform:translateY(100%);z-index:2200;background:var(--navy);border-top:2px solid var(--gold);box-shadow:0 -10px 40px rgba(0,0,0,.25);transition:transform .4s cubic-bezier(.2,.8,.2,1);padding:18px 18px calc(18px + env(safe-area-inset-bottom));max-height:90vh;overflow-y:auto;overflow-x:hidden;box-sizing:border-box;width:100%}
.cookie-banner,.cookie-banner *{box-sizing:border-box}
.cookie-banner.active{transform:translateY(0)}

/* MOBILE-FIRST DEFAULT: stacked, full-width - safe on any screen size, phone
   or tablet. This is intentionally the default rather than something only
   switched on below a specific breakpoint, so there's no width gap where the
   old side-by-side desktop layout could still render and overflow. */
.cookie-banner-inner{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;align-items:stretch;gap:14px;width:100%}
.cookie-banner-text{display:flex;align-items:flex-start;gap:10px;width:100%;min-width:0}
.cookie-banner-text .iconify{font-size:24px;color:var(--gold-light);flex-shrink:0;margin-top:2px}
.cookie-banner-text p{color:rgba(255,255,255,.85);font-size:12.5px;line-height:1.55;margin:0;min-width:0;overflow-wrap:break-word;word-break:break-word}
.cookie-banner-actions{display:flex;flex-direction:column;gap:10px;width:100%}
.cookie-banner-main-btns{display:flex;gap:8px;width:100%}
.btn-cookie{padding:12px 10px;font-size:10.5px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;border-radius:4px;cursor:pointer;border:none;white-space:nowrap;transition:.2s;flex:1;text-align:center}
.btn-cookie-gold{background:var(--gold);color:var(--navy-deep)}
.btn-cookie-gold:hover{background:var(--gold-light)}
.btn-cookie-outline{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.35)}
.btn-cookie-outline:hover{background:rgba(255,255,255,.08);border-color:var(--white)}
.btn-cookie-ghost{background:transparent;color:rgba(255,255,255,.65);text-decoration:underline;width:100%;text-align:center;padding:4px 0;font-size:11px;border:none;cursor:pointer}
.btn-cookie-ghost:hover{color:var(--white)}

/* Only switch to the compact side-by-side layout on genuine desktop widths.
   Everything narrower than this (all phones AND tablets) uses the safe
   stacked layout above - no exceptions, no gap. */
@media(min-width:1024px){
    .cookie-banner{padding:22px 24px}
    .cookie-banner-inner{flex-direction:row;align-items:center;gap:28px}
    .cookie-banner-text{flex:1}
    .cookie-banner-text .iconify{font-size:30px}
    .cookie-banner-text p{font-size:13.5px;line-height:1.6}
    .cookie-banner-actions{flex-direction:row;flex-wrap:wrap;flex-shrink:0;align-items:center;width:auto;gap:10px}
    .cookie-banner-main-btns{width:auto;gap:10px}
    .btn-cookie{flex:none;padding:11px 18px;font-size:11.5px;letter-spacing:.04em}
    .btn-cookie-ghost{width:auto;padding:0;font-size:11.5px}
}

.cookie-modal-backdrop{position:fixed;inset:0;background:rgba(8,27,61,.6);z-index:2299;opacity:0;visibility:hidden;transition:.3s}
.cookie-modal-backdrop.active{opacity:1;visibility:visible}
.cookie-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.95);width:92%;max-width:480px;background:var(--white);border-radius:10px;z-index:2300;opacity:0;visibility:hidden;transition:.3s;box-shadow:0 30px 80px rgba(0,0,0,.35);max-height:86vh;overflow-y:auto;box-sizing:border-box}
.cookie-modal.active{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1)}
.cookie-modal-header{background:var(--navy);color:var(--white);padding:20px 22px;display:flex;align-items:center;justify-content:space-between;border-radius:10px 10px 0 0}
.cookie-modal-header h3{color:var(--white);font-size:17px;margin:0}
.cookie-modal-close{background:none;border:none;color:var(--gold-light);font-size:20px;cursor:pointer}
.cookie-modal-body{padding:20px 22px}
.cookie-pref-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}
.cookie-pref-row:last-of-type{border-bottom:none}
.cookie-pref-label h4{font-size:14px;color:var(--text-dark);margin-bottom:4px}
.cookie-pref-label p{font-size:12px;color:var(--text-muted);margin:0}
.cookie-toggle{position:relative;display:inline-block;width:42px;height:24px;flex-shrink:0;cursor:pointer}
.cookie-toggle input{opacity:0;width:0;height:0}
.cookie-toggle-track{position:absolute;inset:0;background:#cbd5e1;border-radius:24px;transition:.2s}
.cookie-toggle-track::before{content:'';position:absolute;left:3px;top:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s}
.cookie-toggle input:checked + .cookie-toggle-track{background:var(--navy)}
.cookie-toggle input:checked + .cookie-toggle-track::before{transform:translateX(18px)}
.cookie-toggle.disabled{cursor:not-allowed;opacity:.6}
.cookie-modal-body .cf-submit{margin-top:22px}

/* Belt-and-braces: force-remove only the decorative frame's TOP line on any
   mobile/tablet-sized viewport (it's the segment that crosses the logo) --
   the left/right/bottom frame borders stay intact, regardless of any other
   rule ordering or caching. */
@media (max-width: 900px) {
    .hero-frame { border-top: none !important; }
}