/*
Theme Name: Gabochie Design Theme
Theme URI: https://gabochiedesign.com
Author: Gabochie Design Studio
Author URI: https://gabochiedesign.com
Description: WordPress theme for Ghana architecture firm. Features: 20 SEO blog posts with auto-populate, calculator page templates, paywall system, onboarding, API settings, navigation menu with calculator links, content calendar.
Version: 2.8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gabochie-design
Tags: architecture, responsive, custom-logo, custom-menu, translation-ready
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400;1,600&family=Jost:wght@300;400;500;600&display=swap');

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --teal:#0D5C52;--teal-deep:#0A4840;--teal-dark:#072E28;
  --teal-mid:#1A7A6E;--teal-light:#E8F4F2;--teal-pale:#F2FAF8;
  --cream:#FAF7F2;--ivory:#FDFCF9;
  --gold:#C9A96E;--gold-light:#E8D5A8;--gold-pale:#FBF5E8;
  --charcoal:#1C2B28;--mist:#6B8A84;
  --border:#D4E8E4;--border-light:#EAF3F1;
  --r:16px;--r-sm:10px;--r-lg:24px;
}

html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;scroll-behavior:smooth}

body{font-family:'Jost',sans-serif;background:var(--ivory);color:var(--charcoal);overflow-x:hidden;font-weight:300;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.7}

a{color:var(--teal);text-decoration:none;transition:color 0.2s}
a:hover{color:var(--teal-mid)}

img{max-width:100%;height:auto;display:block}

h1,h2,h3,h4,h5,h6{font-family:'Playfair Display',serif;font-weight:500;line-height:1.2;color:var(--charcoal)}

.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1.5rem}

/* FLOATING NAV */
.nav-wrap{position:sticky;top:12px;z-index:200;padding:0 1.5rem}
nav{
  background:rgba(7,46,40,0.94);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(201,169,110,0.18);
  border-radius:var(--r);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 2rem;height:68px;
  transition:background 0.3s,box-shadow 0.3s;
}
nav.scrolled{background:rgba(7,46,40,0.98);box-shadow:0 8px 40px rgba(0,0,0,0.25)}
.logo-wrap{display:flex;align-items:center;gap:12px}
.logo-hex{width:40px;height:40px;flex-shrink:0}
.logo-text{display:flex;flex-direction:column;line-height:1}
.logo-name{font-family:'Playfair Display',serif;font-size:1rem;font-weight:500;color:#FAF7F2;letter-spacing:0.1em}
.logo-tag{font-size:0.58rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);margin-top:3px}
.nav-links{display:flex;align-items:center;gap:2rem;list-style:none}
.nav-links a{font-size:0.76rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(250,247,242,0.5);text-decoration:none;transition:color 0.2s;font-weight:400}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}
.nav-cta{
  background:transparent;border:1px solid var(--gold);
  color:var(--gold);font-family:'Jost',sans-serif;
  font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;
  padding:0.55rem 1.4rem;cursor:pointer;transition:all 0.25s;
  border-radius:var(--r-sm);font-weight:400;
}
.nav-cta:hover{background:var(--gold);color:var(--teal-dark)}
.mobile-menu-btn{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:8px;z-index:201;position:relative}
.mobile-menu-btn span{width:22px;height:2px;background:var(--gold);transition:all 0.3s;border-radius:2px}
@media (max-width: 1024px) {
  .mobile-menu-btn{display:flex !important}
}
.mobile-menu-btn.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.mobile-menu-btn.active span:nth-child(2){opacity:0}
.mobile-menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

.header-actions{display:flex;align-items:center;gap:1rem}
.header-actions .nav-login{font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(250,247,242,0.5);text-decoration:none;transition:color 0.2s;font-weight:400}
.header-actions .nav-login:hover{color:var(--gold)}
.header-actions .nav-signup{display:inline-flex;align-items:center;gap:0.5rem;background:var(--gold);color:var(--teal-dark);padding:0.5rem 1rem;border-radius:var(--r-sm);font-size:0.7rem;font-weight:500;letter-spacing:0.08em;text-decoration:none;transition:all 0.2s}
.header-actions .nav-signup:hover{background:#ddb96e;transform:translateY(-1px)}
.header-actions .nav-signup svg{width:16px;height:16px}

.mobile-menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:199;opacity:0;visibility:hidden;transition:all 0.3s}
.mobile-menu-overlay.active{opacity:1;visibility:visible}
.mobile-menu-panel{position:fixed;top:0;right:-320px;width:300px;height:100vh;background:var(--teal-dark);z-index:200;padding:2rem;transition:right 0.3s ease;overflow-y:auto}
.mobile-menu-panel.active{right:0}
.mobile-close-btn{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--gold);font-size:2rem;cursor:pointer;line-height:1}
.mobile-logo{display:flex;align-items:center;gap:0.75rem;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid rgba(201,169,110,0.1)}
.mobile-logo span{font-family:'Playfair Display',serif;font-size:1rem;color:#FAF7F2;letter-spacing:0.1em}
.mobile-nav-links{list-style:none;margin-bottom:2rem}
.mobile-nav-links li{margin-bottom:1rem}
.mobile-nav-links a{font-size:0.9rem;color:rgba(250,247,242,0.7);text-decoration:none;transition:color 0.2s}
.mobile-nav-links a:hover,.mobile-nav-links a.active{color:var(--gold)}
.mobile-cta .btn-gold{width:100%;text-align:center}

/* HERO */
.hero{
  background:var(--teal-dark);
  min-height:100vh;
  display:grid;grid-template-columns:50% 50%;
  margin-top:-80px;padding-top:80px;
  position:relative;
}
.hero-img-pane{position:relative;overflow:hidden}
.hero-main-img{
  position:absolute;inset:0;
  background-image:url('https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?w=900&q=80');
  background-size:cover;background-position:center;
}
.hero-main-img::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(7,46,40,0.7) 0%,rgba(7,46,40,0.1) 100%);
}
.hero-img-overlay{
  position:absolute;bottom:2rem;right:2rem;
  background:rgba(7,46,40,0.85);
  border:1px solid rgba(201,169,110,0.3);
  border-radius:var(--r-sm);
  padding:1rem 1.25rem;
  backdrop-filter:blur(10px);
}
.hero-img-overlay strong{display:block;font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:400;color:#FAF7F2}
.hero-img-overlay span{font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold)}

.hero-left{
  padding:6rem 3rem 5rem 2rem;
  display:flex;flex-direction:column;justify-content:center;
  position:relative;z-index:2;
  background:var(--teal-dark);
}
.hero-location{
  display:flex;align-items:center;gap:0.75rem;
  font-size:0.72rem;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--gold);margin-bottom:2.5rem;
}
.hero-location-dot{width:5px;height:5px;background:var(--gold);border-radius:50%;flex-shrink:0}
.hero-h1{
  font-family:'Playfair Display',serif;
  font-size:clamp(3rem,4.5vw,5.2rem);
  font-weight:400;line-height:1.07;
  color:#FAF7F2;margin-bottom:0.5rem;
}
.hero-h1 em{font-style:italic;color:var(--gold)}
.hero-h1-dim{
  font-family:'Playfair Display',serif;
  font-size:clamp(3rem,4.5vw,5.2rem);
  font-weight:400;line-height:1.07;
  color:rgba(250,247,242,0.28);font-style:italic;
  margin-bottom:2.5rem;
}
.hero-rule{width:3.5rem;height:1.5px;background:var(--gold);margin-bottom:2rem;opacity:0.7;border-radius:2px}
.hero-sub{
  font-size:1.05rem;line-height:1.9;
  color:rgba(250,247,242,0.62);
  max-width:400px;margin-bottom:3rem;font-weight:300;
}
.hero-actions{display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
.btn-gold{
  padding:1rem 2.5rem;background:var(--gold);
  color:var(--teal-dark);font-family:'Jost',sans-serif;
  font-size:0.76rem;letter-spacing:0.16em;text-transform:uppercase;
  border:none;cursor:pointer;transition:all 0.25s;font-weight:500;
  border-radius:var(--r-sm);
  display:inline-block;
}
.btn-gold:hover{background:#ddb96e;transform:translateY(-2px)}
.btn-ghost-w{
  font-size:0.76rem;letter-spacing:0.13em;text-transform:uppercase;
  color:rgba(250,247,242,0.6);text-decoration:none;
  border-bottom:1px solid rgba(201,169,110,0.4);padding-bottom:2px;
  transition:all 0.2s;font-weight:300;
}
.btn-ghost-w:hover{color:var(--gold);border-color:var(--gold)}
.hero-stats{
  display:flex;gap:2.5rem;flex-wrap:wrap;
  margin-top:4rem;padding-top:2.5rem;
  border-top:1px solid rgba(201,169,110,0.12);
}
.stat-n{font-family:'Playfair Display',serif;font-size:2.6rem;font-weight:400;color:#FAF7F2;line-height:1}
.stat-l{font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(250,247,242,0.32);margin-top:0.4rem}

/* TICKER */
.ticker{background:var(--gold);padding:0.85rem 0;overflow:hidden}
.ticker-inner{display:flex;gap:3rem;animation:tick 22s linear infinite;white-space:nowrap;width:max-content}
@keyframes tick{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.t-item{font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--teal-dark);font-weight:500;display:flex;align-items:center;gap:1rem}
.t-item::after{content:'◆';font-size:0.4rem;opacity:0.4}

/* SECTIONS */
section{padding:7rem 2.5rem}
.sec-ey{display:flex;align-items:center;gap:1rem;font-size:0.68rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--teal-mid);margin-bottom:1.25rem}
.sec-ey::before{content:'';display:block;width:2.5rem;height:1.5px;background:var(--teal-mid);border-radius:2px}
.sec-h2{font-family:'Playfair Display',serif;font-size:clamp(2.2rem,3.5vw,3.4rem);font-weight:400;line-height:1.15;color:var(--charcoal)}
.sec-h2 em{font-style:italic;color:var(--teal)}

/* SERVICES */
.services{background:var(--cream)}
.svc-intro{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:end;margin-bottom:4rem}
.svc-intro p{font-size:1rem;line-height:1.9;color:var(--mist);align-self:end}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc{
  background:var(--ivory);padding:2.5rem 1.75rem;
  transition:background 0.35s,transform 0.2s;cursor:default;
  border-radius:var(--r);
  border:1px solid var(--border-light);
  position:relative;overflow:hidden;
}
.svc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--teal);border-radius:0 0 var(--r) var(--r);transform:scaleX(0);transform-origin:left;transition:transform 0.35s}
.svc:hover{background:var(--teal-dark);transform:translateY(-4px)}
.svc:hover::after{transform:scaleX(1)}
.svc:hover .svc-n,.svc:hover .svc-title,.svc:hover .svc-desc{color:rgba(250,247,242,0.85) !important}
.svc:hover .svc-ico{border-color:var(--gold) !important}
.svc-n{font-family:'Playfair Display',serif;font-size:0.9rem;color:var(--border);margin-bottom:1.5rem;font-style:italic;transition:color 0.35s}
.svc-ico{width:3rem;height:3rem;border:1px solid var(--border-light);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;transition:border-color 0.35s}
.svc-ico svg{width:20px;height:20px;stroke:var(--teal-mid);fill:none;stroke-width:1.5}
.svc-title{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:400;color:var(--charcoal);margin-bottom:0.6rem;line-height:1.25;transition:color 0.35s}
.svc-desc{font-size:0.88rem;line-height:1.85;color:var(--mist);transition:color 0.35s;font-weight:300}

/* PROCESS */
.process{background:var(--ivory)}
.proc-wrap{display:grid;grid-template-columns:1fr 1.5fr;gap:5rem;margin-top:4rem;align-items:start}
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:60px 1fr;gap:1.25rem;padding:2rem 0;border-bottom:1px solid var(--border-light)}
.step:first-child{padding-top:0}
.step-n{font-family:'Playfair Display',serif;font-size:2.4rem;font-weight:400;color:var(--gold-light);line-height:1;font-style:italic}
.step-title{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:400;color:var(--charcoal);margin-bottom:0.4rem}
.step-desc{font-size:0.9rem;line-height:1.85;color:var(--mist);font-weight:300}
.proc-img{
  border-radius:var(--r-lg);overflow:hidden;
  aspect-ratio:3/4;position:relative;
}
.proc-img img{width:100%;height:100%;object-fit:cover;display:block}
.proc-img-cap{
  position:absolute;bottom:0;left:0;right:0;
  background:rgba(7,46,40,0.8);backdrop-filter:blur(8px);
  padding:1.5rem;border-radius:0 0 var(--r-lg) var(--r-lg);
}
.proc-img-cap p{font-family:'Playfair Display',serif;font-size:1rem;font-style:italic;color:#FAF7F2}
.proc-img-cap span{font-size:0.68rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold)}

/* DIASPORA */
.diaspora{background:var(--teal-dark)}
.diaspora .sec-ey{color:var(--gold)}
.diaspora .sec-ey::before{background:var(--gold)}
.diaspora .sec-h2{color:#FAF7F2}
.diaspora .sec-h2 em{color:var(--gold)}
.dia-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-top:4rem;align-items:start}
.dia-img-stack{display:grid;grid-template-rows:1fr 1fr;gap:14px;height:520px}
.dia-img{border-radius:var(--r);overflow:hidden;position:relative}
.dia-img img{width:100%;height:100%;object-fit:cover;display:block}
.dia-text p{font-size:0.98rem;line-height:2;color:rgba(250,247,242,0.55);margin-bottom:1.25rem;font-weight:300}
.dia-feats{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}
.dia-f{display:flex;gap:1.25rem;align-items:flex-start;padding:1.25rem;border:1px solid rgba(201,169,110,0.12);border-radius:var(--r-sm);transition:border-color 0.25s,background 0.25s}
.dia-f:hover{border-color:rgba(201,169,110,0.35);background:rgba(201,169,110,0.04)}
.dia-f-ico{width:36px;height:36px;flex-shrink:0;border:1px solid rgba(201,169,110,0.3);border-radius:8px;display:flex;align-items:center;justify-content:center}
.dia-f-ico svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:1.5}
.dia-f-title{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:400;color:#FAF7F2;margin-bottom:0.25rem}
.dia-f-desc{font-size:0.82rem;line-height:1.7;color:rgba(250,247,242,0.38);font-weight:300}

/* AI SECTION */
.ai-sec{background:var(--cream)}
.ai-layout{display:grid;grid-template-columns:1fr 1fr;gap:5rem;margin-top:4rem;align-items:center}
.ai-card{display:grid;grid-template-columns:44px 1fr;gap:1rem;padding:1.5rem;border-bottom:1px solid var(--border-light);transition:background 0.2s;border-radius:var(--r-sm)}
.ai-card:hover{background:var(--teal-light)}
.ai-card:last-child{border-bottom:none}
.ai-card-ico{width:38px;height:38px;background:var(--teal);border-radius:8px;display:flex;align-items:center;justify-content:center}
.ai-card-ico svg{width:16px;height:16px;stroke:#FAF7F2;fill:none;stroke-width:1.5}
.ai-card-title{font-size:0.92rem;font-weight:500;color:var(--charcoal);margin-bottom:0.3rem}
.ai-card-desc{font-size:0.85rem;line-height:1.75;color:var(--mist);font-weight:300}
.ai-right h3{font-family:'Playfair Display',serif;font-size:2.6rem;font-weight:400;line-height:1.2;margin-bottom:1.5rem;color:var(--charcoal)}
.ai-right h3 em{font-style:italic;color:var(--teal)}
.ai-right p{font-size:0.95rem;line-height:1.95;color:var(--mist);margin-bottom:1.5rem;font-weight:300}

/* CURRENCY TOGGLE */
.currency-toggle-wrap{display:flex;justify-content:center;margin:2rem 0 1rem}
.currency-toggle{
  background:var(--teal-light);border:1px solid var(--border);
  border-radius:var(--r);padding:4px;display:flex;gap:4px;
  box-shadow:0 2px 12px rgba(0,0,0,0.08);
}
.currency-btn{
  padding:0.5rem 1.2rem;border:none;border-radius:var(--r-sm);
  font-family:'Jost',sans-serif;font-size:0.7rem;letter-spacing:0.1em;
  text-transform:uppercase;cursor:pointer;transition:all 0.2s;
  font-weight:400;color:var(--mist);-webkit-tap-highlight-color:transparent;
}
.currency-btn.active{
  background:var(--teal);color:#FAF7F2;box-shadow:0 2px 8px rgba(7,46,40,0.2);
}
.currency-btn:hover:not(.active){background:rgba(7,46,40,0.1)}
.currency-loading{display:inline-block;width:12px;height:12px;border:2px solid var(--gold);border-radius:50%;border-top-color:transparent;animation:spin 0.8s linear infinite;margin-left:0.5rem}
@keyframes spin{to{transform:rotate(360deg)}}

/* PRICING */
.pricing{background:var(--ivory)}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:4rem}
.price-card{padding:2.5rem 2rem;border-radius:var(--r);border:1px solid var(--border);position:relative}
.price-card.featured{background:var(--teal-dark);border-color:transparent}
.price-badge{display:inline-block;background:var(--gold);color:var(--teal-dark);font-size:0.6rem;letter-spacing:0.18em;text-transform:uppercase;padding:0.3rem 0.85rem;border-radius:20px;font-weight:500;margin-bottom:1.25rem}
.price-tier-label{font-size:0.66rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--mist);margin-bottom:0.6rem}
.price-card.featured .price-tier-label{color:rgba(250,247,242,0.38)}
.price-amt{font-family:'Playfair Display',serif;font-size:3.4rem;font-weight:400;color:var(--charcoal);line-height:1}
.price-card.featured .price-amt{color:#FAF7F2}
.price-cur{font-size:1.1rem;vertical-align:super}
.price-per{font-size:0.8rem;color:var(--mist);margin-top:0.3rem;margin-bottom:1.75rem}
.price-card.featured .price-per{color:rgba(250,247,242,0.32)}
.price-div{height:1px;background:var(--border-light);margin-bottom:1.5rem;border-radius:2px}
.price-card.featured .price-div{background:rgba(201,169,110,0.15)}
.price-ul{list-style:none;margin-bottom:2rem}
.price-ul li{font-size:0.88rem;line-height:1.6;color:var(--mist);padding:0.4rem 0;display:flex;align-items:flex-start;gap:0.7rem;font-weight:300}
.price-card.featured .price-ul li{color:rgba(250,247,242,0.52)}
.price-ul li::before{content:'';display:block;width:5px;height:5px;background:var(--gold);border-radius:50%;margin-top:6px;flex-shrink:0}
.price-btn{width:100%;padding:0.9rem;text-align:center;cursor:pointer;font-family:'Jost',sans-serif;font-size:0.76rem;letter-spacing:0.15em;text-transform:uppercase;font-weight:400;transition:all 0.22s;border:1px solid var(--teal);background:transparent;color:var(--teal);border-radius:var(--r-sm)}
.price-btn:hover{background:var(--teal);color:#FAF7F2}
.price-card.featured .price-btn{background:var(--gold);border-color:var(--gold);color:var(--teal-dark)}
.price-card.featured .price-btn:hover{background:#ddb96e}

/* BLOG */
.blog-sec{background:var(--cream)}
.blog-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:3rem;flex-wrap:wrap;gap:1.5rem}
.blog-all{font-size:0.74rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--teal);border-bottom:1px solid var(--teal);padding-bottom:2px;text-decoration:none;transition:opacity 0.2s;font-weight:400}
.blog-all:hover{opacity:0.6}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.blog-card{cursor:pointer;border-radius:var(--r);overflow:hidden;background:var(--ivory);border:1px solid var(--border-light);transition:transform 0.25s,box-shadow 0.25s}
.blog-card:hover{transform:translateY(-5px)}
.blog-img{aspect-ratio:16/10;overflow:hidden;position:relative}
.blog-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.4s}
.blog-card:hover .blog-img img{transform:scale(1.05)}
.blog-img-overlay{position:absolute;inset:0;background:rgba(7,46,40,0.25)}
.blog-cat-pill{position:absolute;top:1rem;left:1rem;background:var(--gold);color:var(--teal-dark);font-size:0.62rem;letter-spacing:0.15em;text-transform:uppercase;padding:0.3rem 0.75rem;border-radius:20px;font-weight:500}
.blog-body{padding:1.5rem}
.blog-title{font-family:'Playfair Display',serif;font-size:1.15rem;font-weight:400;line-height:1.45;color:var(--charcoal);margin-bottom:0.6rem;transition:color 0.2s}
.blog-card:hover .blog-title{color:var(--teal)}
.blog-meta{font-size:0.76rem;color:var(--mist);font-weight:300}
.blog-meta span{color:var(--gold);margin:0 0.3rem}

/* CTA BAND */
.cta-band{
  position:relative;overflow:hidden;
  padding:0;
  display:grid;grid-template-columns:1fr 1fr;
  min-height:420px;
}
.cta-img{position:relative;overflow:hidden}
.cta-img img{width:100%;height:100%;object-fit:cover;display:block}
.cta-img::after{content:'';position:absolute;inset:0;background:rgba(7,46,40,0.4)}
.cta-content{
  background:var(--teal);
  padding:5rem 3.5rem;
  display:flex;flex-direction:column;justify-content:center;
}
.cta-content h2{font-family:'Playfair Display',serif;font-size:clamp(2rem,2.8vw,3rem);font-weight:400;color:#FAF7F2;line-height:1.2;margin-bottom:1rem}
.cta-content h2 em{font-style:italic;color:var(--gold)}
.cta-sub{font-size:0.95rem;color:rgba(250,247,242,0.5);margin-bottom:2.5rem;font-weight:300}
.btn-ivory{padding:1rem 2.5rem;background:#FAF7F2;color:var(--teal);font-family:'Jost',sans-serif;font-size:0.76rem;letter-spacing:0.16em;text-transform:uppercase;border:none;cursor:pointer;transition:all 0.22s;font-weight:500;border-radius:var(--r-sm);display:inline-block}
.btn-ivory:hover{background:var(--gold);color:var(--teal-dark)}

/* FOOTER */
footer{background:var(--teal-dark);padding:5rem 2.5rem 2rem}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr 1fr;gap:2rem;margin-bottom:3.5rem}
.footer-brand-col{display:flex;flex-direction:column;align-items:flex-start}
.footer-logo{width:56px;height:56px;margin-bottom:1rem}
.footer-brand-name{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:400;color:#FAF7F2;letter-spacing:0.1em}
.footer-brand-tag{font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-top:0.25rem}
.footer-desc{font-size:0.85rem;line-height:1.9;color:rgba(250,247,242,0.3);margin-top:1rem;max-width:240px;font-weight:300}
.footer-socials{display:flex;gap:0.6rem;margin-top:1.25rem;flex-wrap:wrap}
.social-link{min-width:36px;height:36px;background:var(--gold);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:600;color:var(--teal-dark);text-decoration:none;transition:all 0.2s;text-transform:uppercase;letter-spacing:0.05em}
.social-link:hover{background:#ddb96e;transform:translateY(-2px)}
.footer-col h4{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem;font-weight:500}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:0.7rem;font-size:0.85rem;color:rgba(250,247,242,0.6);font-weight:300}
.footer-col a{font-size:0.85rem;color:rgba(250,247,242,0.6);text-decoration:none;transition:color 0.2s;font-weight:300}
.footer-col a:hover{color:var(--gold)}
.footer-col li strong{color:#FAF7F2;font-weight:500}
.footer-bottom{border-top:1px solid rgba(201,169,110,0.1);padding-top:1.75rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer-copy{font-size:0.75rem;color:rgba(250,247,242,0.2);letter-spacing:0.08em}
.footer-legal{display:flex;gap:1.5rem;flex-wrap:wrap}
.footer-legal a{font-size:0.7rem;color:rgba(250,247,242,0.25);text-decoration:none;letter-spacing:0.05em;transition:color 0.2s}
.footer-legal a:hover{color:var(--gold)}
.footer-flags{font-size:0.72rem;color:rgba(250,247,242,0.2);letter-spacing:0.1em}

@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
.hero-left>*{animation:fadeUp 0.8s ease both}
.hero-left>*:nth-child(1){animation-delay:0.1s}
.hero-left>*:nth-child(2){animation-delay:0.22s}
.hero-left>*:nth-child(3){animation-delay:0.36s}
.hero-left>*:nth-child(4){animation-delay:0.5s}
.hero-left>*:nth-child(5){animation-delay:0.63s}
.hero-left>*:nth-child(6){animation-delay:0.75s}

/* RESPONSIVE */
@media (max-width: 1024px) {
  .hero{grid-template-columns:1fr;min-height:90vh}
  .hero-img-pane{display:none}
  .hero-left{padding:4rem 2rem 3rem;text-align:center}
  .hero-location{justify-content:center}
  .hero-stats{justify-content:center}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .proc-wrap{grid-template-columns:1fr;gap:3rem}
  .dia-grid{grid-template-columns:1fr}
  .ai-layout{grid-template-columns:1fr}
  .price-grid{grid-template-columns:1fr;max-width:400px;margin:4rem auto 0}
  .blog-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}
  .cta-band{grid-template-columns:1fr}
  .cta-img{display:none}
  .footer-top{grid-template-columns:1fr;gap:2rem;text-align:center}
  .footer-brand-col{align-items:center}
}

@media (max-width: 768px) {
  .nav-wrap{padding:0 1rem}
  nav{padding:0 1rem;height:60px}
  .logo-text{display:flex}
  .logo-name{font-size:0.9rem}
  .logo-tag{font-size:0.5rem}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--teal-dark);flex-direction:column;padding:2rem;gap:1rem;border-radius:0 0 var(--r) var(--r);z-index:200;box-shadow:0 8px 32px rgba(0,0,0,0.3)}
  .nav-links.active{display:flex}
  .nav-cta{display:none}
  .mobile-menu-btn{display:flex}
  
  .hero{margin-top:-60px;padding-top:60px}
  .hero-left{padding:3rem 1.5rem 2rem}
  .hero-h1{font-size:clamp(2.5rem,8vw,3.5rem)}
  .hero-h1-dim{font-size:clamp(2.5rem,8vw,3.5rem)}
  .hero-sub{font-size:0.95rem;max-width:100%}
  .hero-actions{justify-content:center;gap:1rem}
  .hero-stats{gap:1.5rem}
  
  section{padding:4rem 1.5rem}
  .sec-h2{font-size:clamp(1.8rem,5vw,2.5rem)}
  
  .svc-intro{grid-template-columns:1fr;gap:2rem}
  .svc-grid{grid-template-columns:1fr;gap:12px}
  .svc{padding:2rem 1.5rem}
  
  .steps{gap:0}
  .step{padding:1.5rem 0}
  .step-n{font-size:2rem}
  
  .dia-feats{gap:0.75rem}
  .dia-f{padding:1rem}
  
  .ai-card{padding:1rem}
  
  .price-card{padding:2rem 1.5rem}
  .price-amt{font-size:2.8rem}
  
  .currency-toggle-wrap{margin:1.5rem 0 0.5rem}
  .currency-toggle{padding:3px;gap:3px}
  .currency-btn{padding:0.6rem 1rem;font-size:0.65rem}
  
  .blog-head{flex-direction:column;align-items:flex-start}
  
  .cta-content{padding:3rem 2rem}
  
  footer{padding:3rem 1.5rem 1.5rem}
}

@media (max-width: 480px) {
  .nav-wrap{padding:0 0.75rem}
  nav{padding:0 0.75rem;height:56px}
  .logo-hex{width:32px;height:32px}
  .logo-name{font-size:0.8rem}
  .logo-tag{font-size:0.45rem}
  .mobile-menu-btn{padding:6px}
  .mobile-menu-btn span{width:18px;height:1.8px}
  
  .hero-left{padding:2rem 1rem 1.5rem}
  .hero-h1{font-size:clamp(2rem,10vw,3rem)}
  .hero-h1-dim{font-size:clamp(2rem,10vw,3rem)}
  .hero-sub{font-size:0.9rem}
  .hero-actions{flex-direction:column;width:100%}
  .btn-gold,.btn-ghost-w{width:100%;text-align:center}
  .hero-stats{grid-template-columns:repeat(2,1fr);gap:1rem;text-align:center}
  
  section{padding:3rem 1rem}
  
  .svc{padding:1.5rem 1rem}
  
  .price-card{padding:1.5rem 1rem}
  .price-amt{font-size:2.4rem}
  
  .cta-content{padding:2rem 1.5rem}
  .cta-content h2{font-size:clamp(1.5rem,6vw,2rem)}
}

/* WORDPRESS SPECIFIC */
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;top:-100px;left:0;background:var(--teal);color:#FAF7F2;padding:1rem;z-index:100001;transition:top 0.2s}
.skip-link:focus{top:0}
.post-thumbnail img{width:100%;height:auto;border-radius:var(--r-sm)}
.entry-content,.entry-summary{line-height:1.8}
.entry-content p,.entry-summary p{margin-bottom:1rem}
.wp-caption{max-width:100%}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.gallery-item{margin:0}

/* PAGE CONTENT */
.page-content{padding:4rem 2rem;background:var(--ivory);min-height:60vh}
.page-header{margin-bottom:3rem;text-align:center}
.page-header h1{font-size:clamp(2rem,4vw,3rem);color:var(--charcoal);margin-bottom:1rem}
.entry-content{max-width:800px;margin:0 auto}
.entry-content p{font-size:1rem;color:var(--charcoal);margin-bottom:1.5rem;line-height:1.8}

/* SEARCH FORM */
.search-form{display:flex;gap:0.5rem;max-width:300px}
.search-field{flex:1;padding:0.5rem 1rem;border:1px solid var(--border);border-radius:var(--r-sm)}
.search-submit{background:var(--teal);color:#FAF7F2;border:none;padding:0.5rem 1rem;border-radius:var(--r-sm);cursor:pointer}

/* COMMENTS */
.comments-area{margin-top:3rem}
.comment-list{list-style:none}
.comment-body{padding:1rem;margin-bottom:1rem;border:1px solid var(--border-light);border-radius:var(--r-sm)}

/* WIDGETS */
.widget{margin-bottom:2rem}
.widget-title{font-family:'Playfair Display',serif;font-size:1rem;margin-bottom:1rem;padding-bottom:0.5rem;border-bottom:1px solid var(--border)}
.widget ul{list-style:none}
.widget li{padding:0.5rem 0;border-bottom:1px solid var(--border-light)}
.widget li:last-child{border-bottom:none}

/* ACCESSIBILITY */
a:focus,button:focus,input:focus,textarea:focus,select:focus{outline:2px solid var(--gold);outline-offset:2px}

/* PAGE CONTENT STYLES */
.main-content{padding:4rem 0;min-height:50vh}
.page-content,.entry-content{width:100%;max-width:1200px;margin:0 auto;padding:0 2rem}
.page-header{margin-bottom:3rem;padding:2rem 0;border-bottom:1px solid var(--border-light)}
.page-header h1{font-family:'Playfair Display',serif;font-size:2.5rem;color:var(--charcoal);font-weight:400}

/* PRINT */
@media print{
  .nav-wrap,.ticker,.cta-band,.footer-socials{display:none}
  body{font-size:12pt}
  a{color:#000;text-decoration:underline}
}

/* FOOTER - FORCE FULL WIDTH */
.site-footer {
    background: #072E28 !important;
    padding: 60px 20px 30px !important;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    float: none !important;
    clear: both !important;
}
.site-footer .container {
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: block !important;
}
.footer-top {
    margin-bottom: 30px !important;
    width: 100% !important;
    display: block !important;
}
.footer-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 20px !important;
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}
.footer-grid .footer-col {
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 1 !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.footer-brand-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: auto !important;
    flex: 1.5 !important;
}
.footer-logo { width: 56px; height: 56px; margin-bottom: 1rem }
.footer-brand-name { font-family: 'Playfair Display',serif; font-size: 1.3rem; font-weight: 400; color: #FAF7F2; letter-spacing: 0.1em }
.footer-brand-tag { font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: #C9A96E; margin-top: 0.25rem }
.footer-desc { font-size: 0.85rem; line-height: 1.9; color: rgba(250,247,242,0.3); margin-top: 1rem; max-width: 240px; font-weight: 300 }
.footer-socials { display: flex; gap: 0.6rem; margin-top: 1.25rem; flex-wrap: wrap }
.social-link { min-width: 36px; height: 36px; background: #C9A96E; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 600; color: #072E28; text-decoration: none; transition: all 0.2s; text-transform: uppercase; letter-spacing: 0.05em }
.social-link:hover { background: #ddb96e; transform: translateY(-2px) }
.footer-col h4 { font-size: 0.62rem; letter-spacing: 0.2em; text-transform: uppercase; color: #C9A96E; margin-bottom: 1.25rem; font-weight: 500 }
.footer-col ul { list-style: none; margin: 0; padding: 0 }
.footer-col li { margin-bottom: 0.7rem; font-size: 0.85rem; color: rgba(250,247,242,0.6); font-weight: 300 }
.footer-col a { font-size: 0.85rem; color: rgba(250,247,242,0.6); text-decoration: none; transition: color 0.2s; font-weight: 300 }
.footer-col a:hover { color: #C9A96E }
.footer-col li strong { color: #FAF7F2; font-weight: 500 }
.footer-col .coming-soon { font-size: 0.85rem; color: rgba(250,247,242,0.35); font-style: italic; }

/* FOOTER LEGAL BAR - Centered below footer */
.footer-legal-bar {
    background: rgba(0,0,0,0.2) !important;
    padding: 20px 0 !important;
    width: 100% !important;
    border-top: 1px solid rgba(201,169,110,0.15) !important;
    border-bottom: 1px solid rgba(201,169,110,0.1) !important;
}
.footer-legal-bar .container {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    text-align: center !important;
}
.footer-legal-links {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
}
.footer-legal-links a {
    font-size: 0.75rem !important;
    color: rgba(250,247,242,0.5) !important;
    text-decoration: none !important;
    letter-spacing: 0.05em !important;
    transition: color 0.2s !important;
}
.footer-legal-links a:hover {
    color: #C9A96E !important;
}
.legal-sep {
    color: rgba(250,247,242,0.2) !important;
    font-size: 0.7rem !important;
}

.footer-bottom {
    border-top: 1px solid rgba(201,169,110,0.1) !important;
    padding-top: 1.75rem !important;
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
}
.footer-bottom-inner {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
    width: 100% !important;
    max-width: 1400px !important;
}
.footer-copy { font-size: 0.75rem; color: rgba(250,247,242,0.2); letter-spacing: 0.08em }
.footer-legal { display: flex; gap: 1.5rem; flex-wrap: wrap }
.footer-legal a { font-size: 0.7rem; color: rgba(250,247,242,0.25); text-decoration: none; letter-spacing: 0.05em; transition: color 0.2s }
.footer-legal a:hover { color: #C9A96E }
.footer-flags { font-size: 0.72rem; color: rgba(250,247,242,0.2); letter-spacing: 0.1em }
  a{color:#000;text-decoration:underline}

/* PAGE TEMPLATE STYLES */
.page-hero {
  background: var(--teal-dark);
  padding: 8rem 2rem 4rem;
  text-align: center;
  margin-top: -80px;
}
.breadcrumb {
  font-size: 0.8rem;
  color: rgba(250,247,242,0.6);
  margin-bottom: 1.5rem;
}
.breadcrumb a {
  color: var(--gold);
  text-decoration: none;
}
.page-hero h1 {
  font-family: 'Playfair Display',serif;
  font-size: clamp(2.5rem,5vw,4rem);
  font-weight: 400;
  color: #FAF7F2;
  margin-bottom: 1rem;
}
.page-hero h1 em {
  color: var(--gold);
  font-style: italic;
}
.page-hero p {
  font-size: 1.1rem;
  color: rgba(250,247,242,0.7);
  max-width: 600px;
  margin: 0 auto;
}

.service-intro {
  padding: 5rem 2rem;
  background: var(--cream);
}
.intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
}
.intro-content .sec-ey {
  font-size: 0.68rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--teal-mid);
  margin-bottom: 1rem;
}
.intro-content h2 {
  font-family: 'Playfair Display',serif;
  font-size: clamp(2rem,3vw,2.8rem);
  font-weight: 400;
  color: var(--charcoal);
  margin-bottom: 1.5rem;
}
.intro-content h2 em {
  color: var(--teal);
  font-style: italic;
}
.intro-content p {
  font-size: 1rem;
  line-height: 1.9;
  color: var(--mist);
  margin-bottom: 1rem;
}
.intro-image img {
  width: 100%;
  border-radius: var(--r-lg);
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
}

.features-section {
  padding: 5rem 2rem;
  background: var(--ivory);
}
.features-section .sec-ey {
  text-align: center;
  justify-content: center;
  font-size: 0.68rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--teal-mid);
  margin-bottom: 1rem;
}
.features-section .sec-ey::before {
  display: inline-block;
  width: 2.5rem;
  height: 1.5px;
  background: var(--teal-mid);
  margin-right: 1rem;
  border-radius: 2px;
}
.features-section .sec-h2 {
  text-align: center;
  font-family: 'Playfair Display',serif;
  font-size: clamp(2.2rem,3.5vw,3.4rem);
  font-weight: 400;
  color: var(--charcoal);
  margin-bottom: 1rem;
}
.features-section .sec-h2 em {
  color: var(--teal);
  font-style: italic;
}
.sec-subtitle {
  text-align: center;
  font-size: 1rem;
  color: var(--mist);
  margin-bottom: 3rem;
}
.features-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
}
.feature-card {
  background: var(--ivory);
  padding: 2rem;
  border-radius: var(--r);
  border: 1px solid var(--border-light);
  transition: all 0.3s;
}
.feature-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 40px rgba(0,0,0,0.1);
  border-color: var(--gold);
}
.feature-icon {
  width: 48px;
  height: 48px;
  background: var(--teal-light);
  border-radius: var(--r-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5rem;
}
.feature-icon svg {
  width: 24px;
  height: 24px;
  stroke: var(--teal);
  fill: none;
  stroke-width: 1.5;
}
.feature-card h3 {
  font-family: 'Playfair Display',serif;
  font-size: 1.2rem;
  font-weight: 400;
  color: var(--charcoal);
  margin-bottom: 0.75rem;
}
.feature-card p {
  font-size: 0.9rem;
  line-height: 1.8;
  color: var(--mist);
}

/* ========== MOBILE RESPONSIVE ========== */
@media (max-width: 1024px) {
  .container { padding: 0 1rem; }
  .intro-grid { grid-template-columns: 1fr; }
  .features-grid { grid-template-columns: repeat(2, 1fr); }
  .nav-links, .header-actions { display: none !important; }
  .mobile-menu-btn { display: flex !important; }
  nav { padding: 0 1rem; height: 60px; }
  .logo-hex { width: 32px; height: 32px; }
  .logo-name { font-size: 0.85rem; }
  .logo-tag { display: none; }
}

@media (max-width: 768px) {
  .features-grid { grid-template-columns: 1fr; }
  .page-hero { padding: 5rem 1rem 2.5rem; margin-top: -60px; }
  .page-hero h1 { font-size: 1.8rem; }
  .hero h1 { font-size: 2rem !important; }
  .hero-sub { font-size: 0.95rem; }
  .hero-stats { gap: 1.5rem; }
  .services-grid { grid-template-columns: 1fr; }
  .portfolio-masonry { grid-template-columns: 1fr 1fr; }
  .blog-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer-top { padding: 2rem 1rem; }
  .cta-buttons { flex-direction: column; }
}

@media (max-width: 480px) {
  html { font-size: 14px; }
  .mobile-menu-panel { width: 85%; right: -85%; }
  .portfolio-masonry { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: 1fr; }
  .price-grid { grid-template-columns: 1fr; }
  .hero-actions { flex-direction: column; gap: 0.75rem; }
  .btn-gold, .nav-cta { width: 100%; text-align: center; }
  .section-header h2 { font-size: 1.5rem; }
  .blog-filter { gap: 0.35rem; }
  .filter-btn { padding: 0.4rem 0.75rem; font-size: 0.65rem; }
  .pagination { flex-wrap: wrap; gap: 0.35rem; }
  .nav-cta { display: block; }
  .mobile-menu-btn { display: flex !important; }
}

/* PROCESS SECTION */
.process { padding: 6rem 2rem; background: var(--cream); }
.process-intro { text-align: center; max-width: 600px; margin: 0 auto 4rem; }
.process-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.process-step { text-align: center; padding: 2rem; background: var(--ivory); border-radius: var(--r); border: 1px solid var(--border-light); }
.step-num { font-family: 'Playfair Display', serif; font-size: 2.5rem; color: var(--gold); margin-bottom: 1rem; }
.process-step h3 { font-size: 1.1rem; margin-bottom: 0.75rem; }
.process-step p { font-size: 0.85rem; color: var(--mist); line-height: 1.6; }

@media (max-width: 1024px) { .process-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .process-steps { grid-template-columns: 1fr; } }

/* DIASPORA SECTION */
.diaspora { padding: 6rem 2rem; background: var(--teal-dark); }
.diaspora-content { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.diaspora-text { color: #FAF7F2; }
.diaspora-text h2 { color: #FAF7F2; margin-bottom: 1.5rem; }
.diaspora-text p { color: rgba(250,247,242,0.7); margin-bottom: 2rem; font-size: 1rem; }
.diaspora-features { list-style: none; margin-bottom: 2rem; }
.diaspora-features li { padding: 0.75rem 0; border-bottom: 1px solid rgba(201,169,110,0.2); color: rgba(250,247,242,0.8); }
.diaspora-features li:before { content: '✓'; color: var(--gold); margin-right: 0.75rem; }
.diaspora-image img { border-radius: var(--r); width: 100%; }

@media (max-width: 1024px) { .diaspora-content { grid-template-columns: 1fr; gap: 2rem; } .diaspora-image { order: -1; } }
@media (max-width: 768px) { .diaspora { padding: 4rem 1.5rem; } }

/* PRICING SECTION */
.pricing { padding: 6rem 2rem; background: var(--ivory); }
.pricing-intro { text-align: center; max-width: 600px; margin: 0 auto 4rem; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.pricing-card { background: var(--cream); padding: 2.5rem; border-radius: var(--r); border: 1px solid var(--border-light); text-align: center; position: relative; }
.pricing-card.featured { border-color: var(--gold); transform: scale(1.02); }
.price-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--gold); color: var(--teal-dark); padding: 0.35rem 1rem; font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; border-radius: 20px; }
.price-tier { font-size: 0.8rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--mist); margin-bottom: 1rem; }
.price-amount { font-family: 'Playfair Display', serif; font-size: 3rem; color: var(--charcoal); margin-bottom: 0.5rem; }
.price-desc { color: var(--mist); font-size: 0.9rem; margin-bottom: 1.5rem; }
.price-features { list-style: none; margin-bottom: 2rem; text-align: left; }
.price-features li { padding: 0.6rem 0; font-size: 0.85rem; color: var(--mist); border-bottom: 1px solid var(--border-light); }
.price-features li:last-child { border-bottom: none; }
.btn-outline { display: inline-block; padding: 0.9rem 2rem; border: 2px solid var(--teal); color: var(--teal); border-radius: var(--r-sm); text-decoration: none; font-weight: 600; transition: all 0.2s; }
.btn-outline:hover { background: var(--teal); color: #FAF7F2; }

@media (max-width: 1024px) { .pricing-grid { grid-template-columns: 1fr; } .pricing-card.featured { transform: none; } }
@media (max-width: 768px) { .pricing { padding: 4rem 1.5rem; } }

/* BLOG SECTION */
.blog-section { padding: 6rem 2rem; background: var(--cream); }
.blog-intro { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3rem; max-width: 1200px; margin-left: auto; margin-right: auto; padding: 0 1.5rem; }
.blog-intro h2 { font-size: 2rem; }
.view-all { color: var(--teal); font-size: 0.85rem; font-weight: 500; }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.blog-card { background: var(--ivory); border-radius: var(--r); overflow: hidden; border: 1px solid var(--border-light); transition: transform 0.25s; }
.blog-card:hover { transform: translateY(-5px); }
.blog-img { aspect-ratio: 16/10; overflow: hidden; }
.blog-img img { width: 100%; height: 100%; object-fit: cover; }
.blog-body { padding: 1.5rem; }
.blog-cat { font-size: 0.65rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gold); margin-bottom: 0.5rem; }
.blog-title { font-size: 1.1rem; font-weight: 400; line-height: 1.4; margin-bottom: 0.5rem; }
.blog-title a { color: var(--charcoal); text-decoration: none; }
.blog-meta { font-size: 0.75rem; color: var(--mist); }

@media (max-width: 1024px) { .blog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .blog-grid { grid-template-columns: 1fr; } .blog-intro { flex-direction: column; align-items: flex-start; gap: 1rem; } }

/* CONTACT CTA SECTION */
.contact-cta { background: var(--teal); padding: 5rem 2rem; text-align: center; }
.contact-cta h2 { color: #FAF7F2; font-size: 2.5rem; margin-bottom: 1rem; }
.contact-cta p { color: rgba(250,247,242,0.7); font-size: 1.1rem; margin-bottom: 2rem; }
.cta-buttons { display: flex; justify-content: center; gap: 1rem; }
.contact-cta .btn-gold { background: var(--gold); color: var(--teal-dark); padding: 1rem 2rem; border-radius: var(--r-sm); text-decoration: none; font-weight: 600; }
.contact-cta .btn-outline { border: 2px solid #FAF7F2; color: #FAF7F2; padding: 1rem 2rem; border-radius: var(--r-sm); text-decoration: none; font-weight: 600; }
.contact-cta .btn-outline:hover { background: #FAF7F2; color: var(--teal); }

@media (max-width: 768px) { .cta-buttons { flex-direction: column; } }

/* =========================================================================
   CAREERS PAGE STYLES
   ========================================================================= */

/* Intro Section */
.intro-section { background: var(--cream); padding: 5rem 2rem; }
.intro-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 4rem; align-items: center; max-width: 1200px; margin: 0 auto; }
.intro-text { padding: 2rem 0; }
.intro-text .sec-ey { display: flex; align-items: center; gap: 1rem; font-size: 0.68rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--teal-mid); margin-bottom: 1rem; }
.intro-text .sec-ey::before { content: ''; display: block; width: 2.5rem; height: 1.5px; background: var(--teal-mid); border-radius: 2px; }
.intro-text h2 { font-size: clamp(2rem, 3vw, 2.8rem); margin-bottom: 1.5rem; line-height: 1.2; }
.intro-text h2 em { font-style: italic; color: var(--teal); }
.intro-text p { font-size: 1rem; line-height: 1.9; color: var(--mist); margin-bottom: 1rem; }
.intro-stats { display: flex; gap: 2rem; margin-top: 2rem; }
.stat-item { text-align: center; padding: 1rem 1.5rem; background: var(--ivory); border-radius: var(--r); }
.stat-item .stat-num { font-family: 'Playfair Display', serif; font-size: 1.8rem; color: var(--teal); }
.stat-item .stat-label { font-size: 0.7rem; color: var(--mist); letter-spacing: 0.1em; text-transform: uppercase; }
.intro-image img { width: 100%; border-radius: var(--r-lg); box-shadow: 0 20px 60px rgba(0,0,0,0.1); }

/* Values Section */
.values-section { background: var(--ivory); padding: 5rem 2rem; }
.values-section .sec-ey { text-align: center; justify-content: center; font-size: 0.68rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--teal-mid); margin-bottom: 0.5rem; }
.values-section .sec-h2 { text-align: center; font-size: clamp(2rem, 3vw, 2.5rem); margin-bottom: 0.5rem; }
.values-section .sec-subtitle { text-align: center; font-size: 1rem; color: var(--mist); max-width: 600px; margin: 0 auto 3rem; }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; max-width: 1100px; margin: 0 auto; }
.value-card { background: var(--cream); padding: 2rem; border-radius: var(--r); text-align: center; }
.value-icon { width: 56px; height: 56px; background: var(--teal); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; }
.value-icon svg { width: 24px; height: 24px; stroke: #FAF7F2; fill: none; stroke-width: 1.5; }
.value-card h3 { font-size: 1.2rem; margin-bottom: 0.75rem; }
.value-card p { font-size: 0.9rem; color: var(--mist); line-height: 1.7; }

/* AI Section */
.ai-section { background: var(--teal-dark); padding: 5rem 2rem; }
.ai-section .sec-ey { text-align: center; justify-content: center; font-size: 0.68rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--gold); margin-bottom: 0.5rem; }
.ai-section .sec-ey::before { background: var(--gold); }
.ai-section .sec-h2 { text-align: center; font-size: clamp(2rem, 3vw, 2.5rem); color: #FAF7F2; margin-bottom: 0.5rem; }
.ai-section .sec-h2 em { font-style: italic; color: var(--gold); }
.ai-section .sec-subtitle { text-align: center; font-size: 1rem; color: rgba(250,247,242,0.6); max-width: 600px; margin: 0 auto 3rem; }
.ai-features { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; max-width: 1000px; margin: 0 auto; }
.ai-feature { background: rgba(255,255,255,0.05); padding: 2rem; border-radius: var(--r); text-align: center; border: 1px solid rgba(201,169,110,0.1); }
.ai-feature-icon { width: 48px; height: 48px; background: var(--gold); border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; }
.ai-feature-icon svg { width: 24px; height: 24px; stroke: var(--teal-dark); fill: none; stroke-width: 1.5; }
.ai-feature h4 { color: #FAF7F2; font-size: 1rem; margin-bottom: 0.5rem; }
.ai-feature p { color: rgba(250,247,242,0.5); font-size: 0.8rem; }

/* Positions Section */
.positions-section { background: var(--cream); padding: 5rem 2rem; }
.positions-section .sec-ey { text-align: center; justify-content: center; font-size: 0.68rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--teal-mid); margin-bottom: 0.5rem; }
.positions-section .sec-h2 { text-align: center; font-size: clamp(2rem, 3vw, 2.5rem); margin-bottom: 3rem; }
.positions-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; max-width: 1000px; margin: 0 auto; }
.position-card { background: var(--ivory); padding: 2rem; border-radius: var(--r); border: 1px solid var(--border-light); }
.position-type { display: inline-block; background: var(--teal-light); color: var(--teal); font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.3rem 0.75rem; border-radius: 20px; margin-bottom: 1rem; }
.position-card h3 { font-size: 1.3rem; margin-bottom: 0.5rem; }
.position-card .location { font-size: 0.85rem; color: var(--mist); margin-bottom: 1rem; }
.position-card > p { font-size: 0.9rem; color: var(--mist); line-height: 1.7; margin-bottom: 1rem; }
.position-card .tags { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.position-card .tag { background: var(--gold-pale); color: var(--teal-dark); font-size: 0.7rem; padding: 0.3rem 0.6rem; border-radius: 4px; }

/* CTA Section */
.cta-section { background: var(--teal); padding: 5rem 2rem; text-align: center; }
.cta-section h2 { font-size: clamp(2rem, 3vw, 2.5rem); color: #FAF7F2; margin-bottom: 1rem; }
.cta-section h2 em { font-style: italic; color: var(--gold); }
.cta-section p { color: rgba(250,247,242,0.6); font-size: 1rem; max-width: 500px; margin: 0 auto 2rem; }
.cta-section .btn-gold { display: inline-block; background: var(--gold); color: var(--teal-dark); padding: 1rem 2.5rem; border-radius: var(--r-sm); text-decoration: none; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; font-size: 0.8rem; }

/* Responsive */
@media (max-width: 900px) {
  .intro-grid { grid-template-columns: 1fr; gap: 2rem; }
  .values-grid { grid-template-columns: 1fr; }
  .ai-features { grid-template-columns: repeat(2, 1fr); }
  .positions-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .intro-stats { flex-direction: column; gap: 1rem; }
  .ai-features { grid-template-columns: 1fr; }
}

/* ============================================
   WOOCOMMERCE MY-ACCOUNT OVERRIDES
   Aligns WooCommerce forms to Gabochie style guide
   ============================================ */

/* Auth wrapper */
.gd-woocommerce-auth-wrapper {
  background: var(--cream);
  padding: 4rem 2rem;
}

.gd-auth-value-prop {
  max-width: 480px;
  margin: 0 auto 3rem;
  text-align: center;
}

.gd-auth-value-prop h2 {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  color: var(--charcoal);
  margin-bottom: 1rem;
}

.gd-auth-value-prop h2 em {
  color: var(--teal);
  font-style: italic;
}

.gd-auth-value-prop > p {
  font-family: 'Jost', sans-serif;
  font-size: 1rem;
  color: var(--mist);
  line-height: 1.7;
  margin-bottom: 2rem;
}

.badge-row {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.value-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--gold-pale);
  border: 1px solid var(--gold-light);
  padding: 0.5rem 1rem;
  border-radius: 20px;
  font-family: 'Jost', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--teal-dark);
}

.badge-icon {
  width: 16px;
  height: 16px;
  color: var(--gold);
}

.auth-features {
  list-style: none;
  text-align: left;
  max-width: 320px;
  margin: 0 auto;
}

.feature-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.feature-icon {
  width: 36px;
  height: 36px;
  background: var(--teal-light);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--teal);
}

.feature-icon svg {
  width: 18px;
  height: 18px;
}

.feature-content h4 {
  font-family: 'Jost', sans-serif;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--charcoal);
  margin-bottom: 0.2rem;
}

.feature-content p {
  font-family: 'Jost', sans-serif;
  font-size: 0.8rem;
  color: var(--mist);
  line-height: 1.5;
}

/* WooCommerce Form Overrides */
.woocommerce-account .woocommerce {
  max-width: 500px;
  margin: 0 auto;
}

.woocommerce-account .u-columns {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

@media (min-width: 768px) {
  .woocommerce-account .u-columns {
    flex-direction: row;
  }
  .woocommerce-account .u-column1,
  .woocommerce-account .u-column2 {
    flex: 1;
  }
}

.woocommerce-account h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 1.5rem !important;
  font-weight: 500;
  color: var(--charcoal) !important;
  margin-bottom: 1.5rem !important;
  text-align: center;
}

.woocommerce-account .form-row,
.woocommerce-account .woocommerce-form-row {
  margin-bottom: 1.25rem !important;
}

.woocommerce-account label {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.8rem !important;
  font-weight: 500;
  color: var(--charcoal) !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 0.4rem;
}

.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"],
.woocommerce-account input.input-text,
.woocommerce-account .woocommerce-Input {
  width: 100% !important;
  padding: 0.65rem 0.85rem !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.9rem !important;
  color: var(--charcoal) !important;
  background: var(--ivory) !important;
  border: 1px solid var(--border-light) !important;
  border-radius: var(--r-sm) !important;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.woocommerce-account input:focus {
  outline: none !important;
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 3px rgba(201, 169, 110, 0.2) !important;
}

.woocommerce-account .woocommerce-button,
.woocommerce-account .button,
.woocommerce-account .woocommerce-form-login__submit,
.woocommerce-account .woocommerce-form-register__submit {
  display: inline-block !important;
  width: 100% !important;
  background: var(--gold) !important;
  color: var(--teal-dark) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  padding: 0.9rem 2rem !important;
  border: none !important;
  border-radius: var(--r-sm) !important;
  cursor: pointer;
  transition: all 0.25s !important;
}

.woocommerce-account .woocommerce-button:hover,
.woocommerce-account .button:hover {
  background: #ddb96e !important;
  transform: translateY(-2px) !important;
  color: var(--teal-dark) !important;
}

.woocommerce-account .lost_password a,
.woocommerce-account .woocommerce-LostPassword a {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.8rem !important;
  color: var(--teal) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.woocommerce-account .lost_password a:hover,
.woocommerce-account .woocommerce-LostPassword a:hover {
  color: var(--teal-mid) !important;
}

.woocommerce-account .form-row .required {
  color: #c0392b !important;
  font-weight: 600;
}

/* Remember me checkbox */
.woocommerce-account .woocommerce-form-login__rememberme {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  font-family: 'Jost', sans-serif !important;
  font-size: 0.85rem !important;
  color: var(--charcoal) !important;
}

.woocommerce-account input[type="checkbox"] {
  accent-color: var(--teal) !important;
  width: 16px !important;
  height: 16px !important;
}

/* Privacy policy text */
.woocommerce-account .woocommerce-privacy-policy-text,
.woocommerce-account .woocommerce-privacy-policy-text p {
  font-family: 'Jost', sans-serif !important;
  font-size: 0.75rem !important;
  color: var(--mist) !important;
  line-height: 1.6;
}

.woocommerce-account .woocommerce-privacy-policy-text a {
  color: var(--teal) !important;
}

/* Google Sign-In button - match site style */
.woocommerce-account .gform-button {
  background: var(--gold) !important;
  color: var(--teal-dark) !important;
  font-family: 'Jost', sans-serif !important;
  border: none !important;
  border-radius: var(--r-sm) !important;
  padding: 0.7rem 1.5rem !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
}

/* Responsive: stack columns on mobile */
@media (max-width: 768px) {
  .gd-woocommerce-auth-wrapper {
    padding: 3rem 1rem;
  }
  .woocommerce-account h2 {
    font-size: 1.3rem !important;
  }
}
}