/* ================================================================
   AOLFS — Advanced Operations, Logistics & Financial Solutions
   Design System · main.css · v1.0.0
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&family=Outfit:wght@300;400;500;600;700;800&family=DM+Sans:ital,opsz,wght@0,9..18,300;0,9..18,400;0,9..18,500;0,9..18,600;1,9..18,300;1,9..18,400&display=swap');

/* ── DESIGN TOKENS ────────────────────────────────────────────── */
:root {
  --c-brand:         #465433;
  --c-brand-light:   #5a6b42;
  --c-brand-dark:    #2e3821;
  --c-brand-deeper:  #1d2415;
  --c-accent:        #b49a83;
  --c-accent-light:  #cdb09c;
  --c-accent-dark:   #9a7f68;
  --c-accent-muted:  rgba(180,154,131,0.18);
  --c-void:          #07080a;
  --c-dark:          #0c0d09;
  --c-dark-2:        #111308;
  --c-dark-3:        #181c0f;
  --c-dark-4:        #212815;
  --c-cream:         #f5f0e8;
  --c-cream-2:       #ece6d8;
  --c-white:         #ffffff;
  --c-text:          #e8e4dc;
  --c-text-muted:    #9a9690;
  --c-text-faint:    #5a5a54;
  --c-text-dark:     #1a1a14;
  --c-border:        rgba(180,154,131,0.12);
  --c-border-light:  rgba(255,255,255,0.06);

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-ui:      'Outfit', system-ui, sans-serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  --text-xs:   0.6875rem;
  --text-sm:   0.8125rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  2rem;
  --text-3xl:  2.75rem;
  --text-4xl:  clamp(2.5rem, 4vw, 3.75rem);
  --text-5xl:  clamp(3rem, 6vw, 5.5rem);
  --text-6xl:  clamp(4rem, 8vw, 8rem);
  --text-hero: clamp(4.5rem, 10vw, 10.5rem);

  --weight-light:     300;
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  --leading-none:   1;
  --leading-tight:  1.1;
  --leading-snug:   1.25;
  --leading-normal: 1.5;
  --leading-loose:  1.75;

  --tracking-tightest: -0.05em;
  --tracking-tight:    -0.03em;
  --tracking-normal:   -0.01em;
  --tracking-wide:      0.06em;
  --tracking-wider:     0.12em;
  --tracking-widest:    0.2em;

  --sp-1: 0.25rem; --sp-2: 0.5rem;  --sp-3: 0.75rem; --sp-4: 1rem;
  --sp-5: 1.25rem; --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-10: 2.5rem;
  --sp-12: 3rem;   --sp-16: 4rem;   --sp-20: 5rem;   --sp-24: 6rem;
  --sp-32: 8rem;

  --section-py: clamp(5rem, 9vw, 9rem);
  --section-px: clamp(1.5rem, 5vw, 6rem);
  --gutter:     clamp(1rem, 2.5vw, 2rem);

  --max-w:        1440px;
  --max-w-wide:   1280px;
  --max-w-mid:    1024px;
  --max-w-narrow: 768px;

  --radius-xs:  3px;  --radius-sm:  6px;  --radius-md: 12px;
  --radius-lg: 20px;  --radius-xl: 32px;  --radius-full: 9999px;

  --shadow-sm:     0 1px 4px rgba(0,0,0,0.35);
  --shadow-md:     0 4px 20px rgba(0,0,0,0.45);
  --shadow-lg:     0 8px 40px rgba(0,0,0,0.55);
  --shadow-xl:     0 16px 64px rgba(0,0,0,0.65);
  --shadow-accent: 0 0 48px rgba(180,154,131,0.22);
  --shadow-brand:  0 0 48px rgba(70,84,51,0.45);

  --ease-smooth: cubic-bezier(0.25,0.1,0.25,1);
  --ease-out:    cubic-bezier(0,0,0.2,1);
  --ease-spring: cubic-bezier(0.34,1.56,0.64,1);
  --ease-sharp:  cubic-bezier(0.4,0,0.2,1);

  --dur-fast:   150ms;
  --dur-base:   280ms;
  --dur-slow:   520ms;
  --dur-slower: 900ms;

  --nav-h:        72px;
  --nav-h-mobile: 60px;

  --z-base:    0;  --z-raised: 10; --z-sticky: 50;
  --z-nav:   100;  --z-mega:  110; --z-overlay: 200;
  --z-modal: 300;  --z-cursor: 9999;
}

/* ── RESET ────────────────────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; -webkit-font-smoothing:antialiased; }
html { font-size:16px; scroll-behavior:smooth; scrollbar-width:thin; scrollbar-color:var(--c-brand) var(--c-dark-3); }
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background:var(--c-dark-3); }
::-webkit-scrollbar-thumb { background:var(--c-brand); border-radius:2px; }
::selection { background:var(--c-accent-muted); color:var(--c-accent-light); }
body { font-family:var(--font-body); font-size:var(--text-base); line-height:var(--leading-normal); color:var(--c-text); background:var(--c-dark); overflow-x:hidden; cursor:none; }
img, video, svg { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button { cursor:none; border:none; background:none; font-family:inherit; }
ul, ol { list-style:none; }

/* ── CUSTOM CURSOR ────────────────────────────────────────────── */
.cursor { position:fixed; pointer-events:none; z-index:var(--z-cursor); mix-blend-mode:difference; }
.cursor__dot { width:8px; height:8px; background:var(--c-accent); border-radius:50%; transform:translate(-50%,-50%); transition:transform var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out); }
.cursor__ring { width:36px; height:36px; border:1.5px solid var(--c-accent); border-radius:50%; transform:translate(-50%,-50%); transition:transform var(--dur-base) var(--ease-out), width 0.25s var(--ease-out), height 0.25s var(--ease-out); opacity:0.6; }
body.cursor-hover .cursor__dot { transform:translate(-50%,-50%) scale(0); }
body.cursor-hover .cursor__ring { width:52px; height:52px; border-color:var(--c-accent-light); opacity:1; }
@media (hover:none) { .cursor { display:none; } body { cursor:auto; } button,a { cursor:pointer; } }

/* ── TYPOGRAPHY ───────────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6 { font-family:var(--font-ui); font-weight:var(--weight-semibold); line-height:var(--leading-tight); letter-spacing:var(--tracking-tight); color:var(--c-text); }
.t-display { font-family:var(--font-display); font-weight:var(--weight-light); letter-spacing:var(--tracking-tightest); line-height:var(--leading-none); font-style:italic; }
.t-label { font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--c-accent); display:flex; align-items:center; gap:var(--sp-3); }
.t-label::before { content:''; display:block; width:24px; height:1px; background:var(--c-accent); flex-shrink:0; }
.t-hero { font-size:var(--text-hero); line-height:0.93; letter-spacing:var(--tracking-tightest); }
.t-accent { color:var(--c-accent); }
.t-brand  { color:var(--c-brand-light); }
.t-muted  { color:var(--c-text-muted); }
.on-light { color:var(--c-text-dark); }

/* ── LAYOUT ───────────────────────────────────────────────────── */
.container { width:100%; max-width:var(--max-w-wide); margin:0 auto; padding:0 var(--section-px); }
.container--wide { max-width:var(--max-w); }
.container--narrow { max-width:var(--max-w-narrow); }
.section { padding:var(--section-py) 0; }
.section--dark   { background:var(--c-dark); }
.section--dark-2 { background:var(--c-dark-3); }
.section--brand  { background:var(--c-brand-dark); }
.section--light  { background:var(--c-cream); color:var(--c-text-dark); }
.section--cream  { background:var(--c-cream-2); color:var(--c-text-dark); }

/* ── BUTTONS ──────────────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2); font-family:var(--font-ui); font-size:var(--text-sm); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide); text-transform:uppercase; padding:0.9em 2em; border-radius:var(--radius-full); transition:all var(--dur-base) var(--ease-out); position:relative; overflow:hidden; white-space:nowrap; }
.btn--primary { background:var(--c-brand); color:var(--c-cream); border:1.5px solid var(--c-brand); }
.btn--primary:hover { background:var(--c-brand-light); border-color:var(--c-brand-light); box-shadow:var(--shadow-brand); transform:translateY(-2px); }
.btn--accent { background:var(--c-accent); color:var(--c-dark); border:1.5px solid var(--c-accent); }
.btn--accent:hover { background:var(--c-accent-light); box-shadow:var(--shadow-accent); transform:translateY(-2px); }
.btn--outline { background:transparent; color:var(--c-text); border:1.5px solid var(--c-border); }
.btn--outline:hover { border-color:var(--c-accent); color:var(--c-accent); transform:translateY(-2px); }
.btn--outline-light { background:transparent; color:var(--c-text-dark); border:1.5px solid rgba(70,84,51,0.3); }
.btn--outline-light:hover { border-color:var(--c-brand); color:var(--c-brand); }
.btn--lg { padding:1.1em 2.5em; font-size:var(--text-base); }
.btn--sm { padding:0.6em 1.4em; font-size:var(--text-xs); }

/* ── DECORATIVE ───────────────────────────────────────────────── */
.divider-line { width:40px; height:1px; background:var(--c-accent); margin:var(--sp-4) 0; }
.divider-line--center { margin:var(--sp-4) auto; }
.grain-overlay { position:absolute; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.035'/%3E%3C/svg%3E"); background-size:200px; pointer-events:none; z-index:1; opacity:0.6; }

/* ── SECTION HEADERS ──────────────────────────────────────────── */
.section-head { margin-bottom:clamp(3rem,5vw,5rem); }
.section-head--center { text-align:center; }
.section-head .t-label { margin-bottom:var(--sp-5); }
.section-head h2 { font-family:var(--font-display); font-weight:var(--weight-regular); font-size:var(--text-5xl); letter-spacing:var(--tracking-tightest); line-height:var(--leading-tight); margin-bottom:var(--sp-5); }
.section-head h2 em { font-style:italic; color:var(--c-accent); }
.section-head p { font-size:var(--text-md); color:var(--c-text-muted); max-width:52ch; line-height:var(--leading-loose); }
.section-head--center p { margin:0 auto; }

/* ── CARDS ────────────────────────────────────────────────────── */
.card { background:var(--c-dark-3); border:1px solid var(--c-border); border-radius:var(--radius-lg); padding:var(--sp-8); transition:all var(--dur-base) var(--ease-out); position:relative; overflow:hidden; }
.card:hover { border-color:rgba(180,154,131,0.22); transform:translateY(-4px); box-shadow:var(--shadow-lg); }

/* ── NAV ──────────────────────────────────────────────────────── */
#site-nav { position:fixed; top:0; left:0; right:0; z-index:var(--z-nav); height:var(--nav-h); display:flex; align-items:center; transition:background var(--dur-slow) var(--ease-out), box-shadow var(--dur-slow) var(--ease-out), height var(--dur-base) var(--ease-out); }
#site-nav.scrolled { background:rgba(8,9,7,0.96); backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2); box-shadow:0 1px 0 var(--c-border), 0 4px 32px rgba(0,0,0,0.5); height:64px; }
.nav-container { display:flex; align-items:center; justify-content:space-between; width:100%; max-width:var(--max-w); margin:0 auto; padding:0 var(--section-px); gap:var(--sp-6); }
.nav-logo { display:flex; align-items:center; gap:var(--sp-3); flex-shrink:0; }
.nav-logo__mark { width:36px; height:36px; flex-shrink:0; }
.nav-logo__text { display:flex; flex-direction:column; line-height:1; }
.nav-logo__name { font-family:var(--font-ui); font-size:1.1rem; font-weight:var(--weight-bold); letter-spacing:0.14em; color:var(--c-white); text-transform:uppercase; }
.nav-logo__tagline { font-size:0.55rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--c-accent); margin-top:3px; }
.nav-links { display:flex; align-items:center; gap:0; list-style:none; }
.nav-links > li > a, .nav-links > li > button { font-family:var(--font-ui); font-size:var(--text-sm); font-weight:var(--weight-medium); color:rgba(232,228,220,0.72); padding:var(--sp-2) var(--sp-3); border-radius:var(--radius-sm); transition:color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out); display:flex; align-items:center; gap:var(--sp-1); background:none; border:none; white-space:nowrap; }
.nav-links > li > a:hover, .nav-links > li > button:hover { color:var(--c-text); background:rgba(255,255,255,0.04); }
.nav-links > li > a.active { color:var(--c-accent); }
.nav-chevron { width:14px; height:14px; transition:transform var(--dur-base) var(--ease-out); }
.nav-services-btn.open .nav-chevron { transform:rotate(180deg); }
.nav-portals { display:flex; align-items:center; gap:var(--sp-2); flex-shrink:0; }
.nav-portal-btn { font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide); text-transform:uppercase; padding:0.55em 1.2em; border-radius:var(--radius-full); transition:all var(--dur-base) var(--ease-out); white-space:nowrap; }
.nav-portal-btn--customer { background:transparent; color:var(--c-accent); border:1.5px solid rgba(180,154,131,0.35); }
.nav-portal-btn--customer:hover { background:var(--c-accent-muted); border-color:var(--c-accent); }
.nav-portal-btn--employee { background:var(--c-brand); color:var(--c-cream); border:1.5px solid var(--c-brand); }
.nav-portal-btn--employee:hover { background:var(--c-brand-light); box-shadow:var(--shadow-brand); }
.nav-hamburger { display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:40px; height:40px; background:transparent; border:1.5px solid var(--c-border); border-radius:var(--radius-sm); flex-shrink:0; }
.nav-hamburger span { display:block; width:20px; height:1.5px; background:var(--c-text); transition:all var(--dur-base) var(--ease-sharp); }
.nav-hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.nav-hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* ── MEGA MENU ────────────────────────────────────────────────── */
.mega-menu { position:fixed; top:0; left:0; right:0; z-index:var(--z-mega); background:rgba(10,12,8,0.98); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); border-bottom:1px solid var(--c-border); padding-top:calc(var(--nav-h) + var(--sp-8)); padding-bottom:var(--sp-10); padding-left:var(--section-px); padding-right:var(--section-px); transform:translateY(-105%); opacity:0; transition:transform var(--dur-slow) var(--ease-out), opacity var(--dur-slow) var(--ease-out); pointer-events:none; }
.mega-menu.open { transform:translateY(0); opacity:1; pointer-events:auto; }
.mega-menu__inner { max-width:var(--max-w-wide); margin:0 auto; }
.mega-menu__header { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:var(--sp-8); padding-bottom:var(--sp-6); border-bottom:1px solid var(--c-border); }
.mega-menu__title { font-family:var(--font-display); font-size:var(--text-2xl); font-weight:var(--weight-light); color:var(--c-text); letter-spacing:var(--tracking-tightest); }
.mega-menu__title em { color:var(--c-accent); font-style:italic; }
.mega-menu__all-link { font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--c-accent); display:flex; align-items:center; gap:var(--sp-2); transition:gap var(--dur-base); }
.mega-menu__all-link:hover { gap:var(--sp-4); }
.mega-menu__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-8); }
.mega-col__title { font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--c-brand-light); margin-bottom:var(--sp-4); padding-bottom:var(--sp-3); border-bottom:1px solid rgba(70,84,51,0.25); }
.mega-col__links { display:flex; flex-direction:column; gap:2px; }
.mega-col__link { display:flex; align-items:center; gap:var(--sp-2); font-size:var(--text-sm); color:var(--c-text-muted); padding:var(--sp-2) var(--sp-3); border-radius:var(--radius-xs); transition:all var(--dur-fast); border-left:2px solid transparent; }
.mega-col__link:hover { color:var(--c-text); background:rgba(255,255,255,0.04); border-left-color:var(--c-accent); padding-left:calc(var(--sp-3) + 4px); }

/* ── MOBILE NAV ───────────────────────────────────────────────── */
.mobile-nav { position:fixed; top:var(--nav-h-mobile); left:0; right:0; bottom:0; z-index:calc(var(--z-nav) - 1); background:var(--c-void); border-top:1px solid var(--c-border); overflow-y:auto; transform:translateX(100%); transition:transform var(--dur-slow) var(--ease-out); padding:var(--sp-6) var(--sp-6) var(--sp-12); display:flex; flex-direction:column; gap:var(--sp-1); }
.mobile-nav.open { transform:translateX(0); }
.mobile-nav__link { font-family:var(--font-ui); font-size:var(--text-md); font-weight:var(--weight-medium); color:var(--c-text-muted); padding:var(--sp-4) 0; border-bottom:1px solid var(--c-border-light); display:flex; align-items:center; justify-content:space-between; transition:color var(--dur-fast); }
.mobile-nav__link:hover { color:var(--c-text); }
.mobile-services-toggle { width:100%; text-align:left; }
.mobile-services-items { display:none; flex-direction:column; gap:2px; padding:var(--sp-3) 0 var(--sp-2) var(--sp-4); }
.mobile-services-items.open { display:flex; }
.mobile-nav__section-title { font-size:var(--text-xs); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--c-brand-light); padding:var(--sp-4) 0 var(--sp-2); font-family:var(--font-ui); font-weight:var(--weight-bold); }
.mobile-nav__sub-link { font-size:var(--text-sm); color:var(--c-text-muted); padding:var(--sp-2) var(--sp-2); display:block; transition:color var(--dur-fast); border-left:2px solid transparent; }
.mobile-nav__sub-link:hover { color:var(--c-accent); border-left-color:var(--c-accent); padding-left:calc(var(--sp-2) + 4px); }
.mobile-nav__portals { display:flex; gap:var(--sp-3); margin-top:var(--sp-6); padding-top:var(--sp-6); border-top:1px solid var(--c-border); }
.mobile-nav__portals .nav-portal-btn { flex:1; text-align:center; }

/* ── FOOTER ───────────────────────────────────────────────────── */
#site-footer { background:var(--c-void); border-top:1px solid var(--c-border); position:relative; overflow:hidden; }
#site-footer::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg, transparent, var(--c-brand), var(--c-accent), var(--c-brand), transparent); opacity:0.5; }
.footer-main { padding:var(--sp-20) 0 var(--sp-16); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:clamp(2rem,4vw,5rem); align-items:start; }
.footer-brand__logo { margin-bottom:var(--sp-5); }
.footer-brand__desc { font-size:var(--text-sm); color:var(--c-text-muted); line-height:var(--leading-loose); max-width:36ch; margin-bottom:var(--sp-6); }
.footer-social { display:flex; gap:var(--sp-3); }
.footer-social__link { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--c-border); border-radius:50%; color:var(--c-text-muted); font-size:var(--text-sm); transition:all var(--dur-base); }
.footer-social__link:hover { border-color:var(--c-accent); color:var(--c-accent); transform:translateY(-2px); }
.footer-col__title { font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--c-accent); margin-bottom:var(--sp-5); }
.footer-col__links { display:flex; flex-direction:column; gap:var(--sp-2); }
.footer-col__link { font-size:var(--text-sm); color:var(--c-text-muted); transition:color var(--dur-fast); padding:1px 0; }
.footer-col__link:hover { color:var(--c-text); }
.footer-contact-item { display:flex; gap:var(--sp-3); margin-bottom:var(--sp-4); align-items:flex-start; }
.footer-contact-icon { width:16px; flex-shrink:0; color:var(--c-accent); margin-top:2px; }
.footer-contact-text { font-size:var(--text-sm); color:var(--c-text-muted); line-height:var(--leading-snug); }
.footer-contact-text a { color:var(--c-text-muted); transition:color var(--dur-fast); }
.footer-contact-text a:hover { color:var(--c-accent); }
.footer-bottom { border-top:1px solid var(--c-border); padding:var(--sp-6) 0; }
.footer-bottom__inner { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); flex-wrap:wrap; }
.footer-bottom__copy { font-size:var(--text-xs); color:var(--c-text-faint); }
.footer-bottom__links { display:flex; gap:var(--sp-6); }
.footer-bottom__links a { font-size:var(--text-xs); color:var(--c-text-faint); transition:color var(--dur-fast); }
.footer-bottom__links a:hover { color:var(--c-text-muted); }

/* ── WHATSAPP WIDGET ──────────────────────────────────────────── */
.wa-widget { position:fixed; bottom:var(--sp-8); right:var(--sp-8); z-index:calc(var(--z-modal) - 1); display:flex; flex-direction:column; align-items:flex-end; gap:var(--sp-3); }
.wa-widget__bubble { background:var(--c-dark-3); border:1px solid var(--c-border); border-radius:var(--radius-lg); padding:var(--sp-4) var(--sp-5); font-size:var(--text-sm); color:var(--c-text-muted); max-width:200px; text-align:center; opacity:0; transform:translateY(8px) scale(0.95); transition:all var(--dur-base); pointer-events:none; }
.wa-widget:hover .wa-widget__bubble { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.wa-widget__btn { width:54px; height:54px; background:#25d366; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(37,211,102,0.35); transition:all var(--dur-base) var(--ease-spring); }
.wa-widget__btn:hover { transform:scale(1.1); box-shadow:0 6px 28px rgba(37,211,102,0.5); }
.wa-widget__btn svg { width:28px; height:28px; fill:white; }

/* ── PAGE LOADER ──────────────────────────────────────────────── */
.page-loader { position:fixed; inset:0; z-index:calc(var(--z-cursor) - 1); background:var(--c-void); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-6); transition:opacity 0.5s var(--ease-out), visibility 0.5s; }
.page-loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loader-logo { font-family:var(--font-ui); font-size:1.2rem; font-weight:var(--weight-bold); letter-spacing:0.2em; text-transform:uppercase; color:var(--c-text); animation:pulse-loader 1.5s ease-in-out infinite; }
.loader-bar { width:120px; height:1px; background:var(--c-dark-3); position:relative; overflow:hidden; }
.loader-bar::after { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg, var(--c-brand), var(--c-accent)); animation:loader-slide 1.2s ease-in-out infinite; }
@keyframes loader-slide { 0% { left:-100%; } 50% { left:0%; } 100% { left:100%; } }
@keyframes pulse-loader { 0%,100% { opacity:1; } 50% { opacity:0.4; } }

/* ── HERO ─────────────────────────────────────────────────────── */
.hero { position:relative; height:100vh; min-height:700px; display:flex; align-items:flex-end; overflow:hidden; background:var(--c-void); }
.hero__bg { position:absolute; inset:0; overflow:hidden; }
.hero__orb { position:absolute; border-radius:50%; filter:blur(120px); will-change:transform; }
.hero__orb--1 { width:900px; height:900px; background:radial-gradient(circle, rgba(70,84,51,0.45) 0%, transparent 70%); top:-30%; right:-15%; animation:orb-float-1 18s ease-in-out infinite; }
.hero__orb--2 { width:700px; height:700px; background:radial-gradient(circle, rgba(180,154,131,0.15) 0%, transparent 70%); bottom:-20%; left:-10%; animation:orb-float-2 22s ease-in-out infinite; }
.hero__orb--3 { width:500px; height:500px; background:radial-gradient(circle, rgba(46,56,33,0.5) 0%, transparent 70%); top:40%; left:40%; animation:orb-float-3 15s ease-in-out infinite; }
@keyframes orb-float-1 { 0%,100% { transform:translate(0,0) scale(1); } 33% { transform:translate(-5%,5%) scale(1.05); } 66% { transform:translate(3%,-3%) scale(0.97); } }
@keyframes orb-float-2 { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(6%,-6%) scale(1.08); } }
@keyframes orb-float-3 { 0%,100% { transform:translate(0,0); } 50% { transform:translate(-8%,4%); } }
.hero__noise { opacity:0.4; }
.hero__content { position:relative; z-index:2; width:100%; padding:0 var(--section-px) clamp(4rem,7vh,6rem); max-width:var(--max-w); margin:0 auto; }
.hero__label { font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--c-accent); margin-bottom:var(--sp-6); opacity:0; animation:fade-up 0.8s var(--ease-out) 0.3s forwards; display:flex; align-items:center; gap:var(--sp-3); }
.hero__label::before { content:''; display:block; width:30px; height:1px; background:var(--c-accent); }
.hero__headline { font-family:var(--font-display); font-weight:var(--weight-light); line-height:0.93; letter-spacing:var(--tracking-tightest); color:var(--c-text); margin-bottom:clamp(2rem,3vw,3rem); font-size:var(--text-hero); }
.hero__headline .line { display:block; overflow:hidden; }
.hero__headline .line span { display:block; transform:translateY(110%); animation:line-reveal 0.9s var(--ease-out) forwards; }
.hero__headline .line:nth-child(1) span { animation-delay:0.5s; }
.hero__headline .line:nth-child(2) span { animation-delay:0.65s; }
.hero__headline .line:nth-child(3) span { animation-delay:0.8s; }
.hero__headline .line:nth-child(4) span { animation-delay:0.95s; }
.hero__headline em { font-style:italic; color:var(--c-accent); }
.hero__bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--sp-8); flex-wrap:wrap; }
.hero__sub { font-size:var(--text-md); color:var(--c-text-muted); max-width:48ch; line-height:var(--leading-loose); opacity:0; animation:fade-up 0.8s var(--ease-out) 1.1s forwards; }
.hero__ctas { display:flex; align-items:center; gap:var(--sp-4); flex-wrap:wrap; opacity:0; animation:fade-up 0.8s var(--ease-out) 1.25s forwards; }
.hero__scroll { position:absolute; bottom:clamp(2rem,4vh,3.5rem); right:var(--section-px); z-index:2; display:flex; flex-direction:column; align-items:center; gap:var(--sp-2); opacity:0; animation:fade-in 1s var(--ease-out) 1.8s forwards; }
.hero__scroll-text { font-size:0.65rem; letter-spacing:var(--tracking-widest); text-transform:uppercase; color:var(--c-text-faint); writing-mode:vertical-rl; }
.hero__scroll-line { width:1px; height:60px; background:var(--c-border); position:relative; overflow:hidden; }
.hero__scroll-line::after { content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--c-accent); animation:scroll-line 2s ease-in-out 2s infinite; }
@keyframes scroll-line { 0% { top:-100%; } 50% { top:0%; } 100% { top:100%; } }

/* ── MARQUEE ──────────────────────────────────────────────────── */
.marquee-strip { background:var(--c-brand-dark); border-top:1px solid rgba(70,84,51,0.4); border-bottom:1px solid rgba(70,84,51,0.4); overflow:hidden; padding:var(--sp-3) 0; position:relative; z-index:2; }
.marquee-strip::before, .marquee-strip::after { content:''; position:absolute; top:0; bottom:0; width:120px; z-index:1; pointer-events:none; }
.marquee-strip::before { left:0; background:linear-gradient(90deg, var(--c-brand-dark), transparent); }
.marquee-strip::after { right:0; background:linear-gradient(-90deg, var(--c-brand-dark), transparent); }
.marquee-track { display:flex; align-items:center; animation:marquee-scroll 40s linear infinite; width:max-content; }
.marquee-track:hover { animation-play-state:paused; }
.marquee-item { display:flex; align-items:center; gap:var(--sp-4); padding:0 var(--sp-8); white-space:nowrap; font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:rgba(245,240,232,0.55); }
.marquee-item .sep { width:3px; height:3px; border-radius:50%; background:var(--c-accent); opacity:0.6; }
@keyframes marquee-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* ── STATS ────────────────────────────────────────────────────── */
.stats-section { background:var(--c-dark-3); padding:var(--sp-16) 0; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--c-border); border:1px solid var(--c-border); border-radius:var(--radius-md); overflow:hidden; }
.stat-item { background:var(--c-dark-3); padding:var(--sp-10) var(--sp-8); text-align:center; position:relative; }
.stat-item::after { content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); width:0; height:2px; background:linear-gradient(90deg, var(--c-brand), var(--c-accent)); transition:width var(--dur-slow) var(--ease-out); }
.stat-item.in-view::after { width:60%; }
.stat-number { font-family:var(--font-display); font-size:clamp(2.5rem,4vw,4rem); font-weight:var(--weight-medium); color:var(--c-text); letter-spacing:var(--tracking-tightest); line-height:1; margin-bottom:var(--sp-2); }
.stat-number .suffix { color:var(--c-accent); }
.stat-label { font-size:var(--text-xs); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--c-text-muted); font-family:var(--font-ui); font-weight:var(--weight-medium); }

/* ── SERVICE CATEGORY CARDS ───────────────────────────────────── */
.service-cat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--c-border); border-radius:var(--radius-lg); overflow:hidden; }
.service-cat-card { background:var(--c-dark-2); padding:var(--sp-10) var(--sp-8); position:relative; overflow:hidden; transition:background var(--dur-base); display:flex; flex-direction:column; gap:var(--sp-4); }
.service-cat-card::before { content:''; position:absolute; bottom:0; left:0; right:0; height:0; background:linear-gradient(to top, rgba(70,84,51,0.12), transparent); transition:height var(--dur-slow); }
.service-cat-card:hover { background:var(--c-dark-3); }
.service-cat-card:hover::before { height:100%; }
.service-cat-icon { width:48px; height:48px; border-radius:var(--radius-sm); background:rgba(70,84,51,0.15); border:1px solid rgba(70,84,51,0.25); display:flex; align-items:center; justify-content:center; font-size:1.4rem; flex-shrink:0; transition:all var(--dur-base); }
.service-cat-card:hover .service-cat-icon { background:rgba(70,84,51,0.28); border-color:var(--c-brand); }
.service-cat-title { font-family:var(--font-ui); font-size:var(--text-lg); font-weight:var(--weight-semibold); color:var(--c-text); letter-spacing:var(--tracking-tight); }
.service-cat-sub { font-size:var(--text-sm); color:var(--c-text-muted); line-height:var(--leading-loose); flex:1; }
.service-cat-count { font-size:var(--text-xs); color:var(--c-accent); font-family:var(--font-ui); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide); display:flex; align-items:center; gap:var(--sp-2); margin-top:auto; }
.service-cat-count::after { content:'→'; transition:transform var(--dur-base); }
.service-cat-card:hover .service-cat-count::after { transform:translateX(4px); }

/* ── PAIN / SOLUTION CARDS ────────────────────────────────────── */
.pain-section { background:var(--c-cream); color:var(--c-text-dark); }
.pain-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4); }
.pain-card { padding:var(--sp-8); border-radius:var(--radius-lg); border:1px solid rgba(70,84,51,0.12); transition:all var(--dur-base); }
.pain-card--problem { background:rgba(26,26,20,0.04); }
.pain-card--problem:hover { background:rgba(26,26,20,0.07); transform:translateY(-3px); }
.pain-card--solution { background:var(--c-brand-dark); color:var(--c-text); border-color:transparent; }
.pain-card--solution:hover { transform:translateY(-3px); box-shadow:var(--shadow-brand); }
.pain-card__badge { display:inline-flex; align-items:center; gap:var(--sp-2); font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wider); text-transform:uppercase; padding:var(--sp-1) var(--sp-3); border-radius:var(--radius-full); margin-bottom:var(--sp-4); }
.pain-card__badge--problem { background:rgba(139,58,58,0.12); color:#b06060; }
.pain-card__badge--solution { background:rgba(70,84,51,0.3); color:var(--c-brand-light); }
.pain-card h3 { font-size:var(--text-xl); font-weight:var(--weight-semibold); margin-bottom:var(--sp-3); color:inherit; }
.pain-card--problem h3 { color:var(--c-text-dark); }
.pain-card p { font-size:var(--text-sm); opacity:0.75; line-height:var(--leading-loose); }

/* ── INDUSTRIES ───────────────────────────────────────────────── */
.industries-section { background:var(--c-dark-3); }
.industries-scroll-track { display:flex; gap:var(--sp-4); overflow-x:auto; padding-bottom:var(--sp-4); scrollbar-width:none; cursor:grab; }
.industries-scroll-track::-webkit-scrollbar { display:none; }
.industries-scroll-track:active { cursor:grabbing; }
.industry-card { min-width:200px; padding:var(--sp-6) var(--sp-5); border:1px solid var(--c-border); border-radius:var(--radius-md); background:var(--c-dark-2); text-align:center; flex-shrink:0; transition:all var(--dur-base); }
.industry-card:hover { border-color:var(--c-accent); transform:translateY(-4px); }
.industry-card__icon { font-size:2rem; margin-bottom:var(--sp-3); }
.industry-card__name { font-size:var(--text-sm); font-weight:var(--weight-medium); color:var(--c-text-muted); font-family:var(--font-ui); }
.industry-card:hover .industry-card__name { color:var(--c-text); }

/* ── PROCESS ──────────────────────────────────────────────────── */
.process-section { background:var(--c-dark); }
.process-steps { display:grid; grid-template-columns:repeat(4,1fr); position:relative; }
.process-steps::before { content:''; position:absolute; top:28px; left:calc(25%/2); width:calc(100% - (25%/2)*2); height:1px; background:linear-gradient(90deg, var(--c-brand-dark), var(--c-accent), var(--c-brand-dark)); z-index:0; }
.process-step { padding:0 var(--sp-8) var(--sp-8); position:relative; z-index:1; text-align:center; }
.process-step__num { width:56px; height:56px; border-radius:50%; background:var(--c-dark-3); border:1px solid var(--c-brand); display:flex; align-items:center; justify-content:center; margin:0 auto var(--sp-6); font-family:var(--font-display); font-size:1.4rem; font-weight:var(--weight-medium); color:var(--c-accent); transition:all var(--dur-base); }
.process-step:hover .process-step__num { background:var(--c-brand-dark); border-color:var(--c-accent); box-shadow:var(--shadow-accent); transform:scale(1.08); }
.process-step h3 { font-size:var(--text-lg); font-weight:var(--weight-semibold); margin-bottom:var(--sp-3); }
.process-step p { font-size:var(--text-sm); color:var(--c-text-muted); line-height:var(--leading-loose); }

/* ── LEADERSHIP ───────────────────────────────────────────────── */
.leadership-section { background:var(--c-dark-3); overflow:hidden; }
.leadership-inner { display:grid; grid-template-columns:1fr 1.4fr; gap:clamp(3rem,6vw,7rem); align-items:center; }
.leadership-img-wrap { position:relative; aspect-ratio:3/4; max-width:380px; }
.leadership-img-bg { position:absolute; inset:var(--sp-4) 0 0 var(--sp-4); background:linear-gradient(135deg, var(--c-brand-dark), var(--c-dark-4)); border-radius:var(--radius-lg); z-index:0; }
.leadership-img-placeholder { position:relative; z-index:1; width:100%; height:100%; background:linear-gradient(160deg, var(--c-dark-4), var(--c-brand-deeper)); border-radius:var(--radius-lg); border:1px solid var(--c-border); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.leadership-img-wrap img { position:relative; z-index:1; width:100%; height:100%; object-fit:cover; border-radius:var(--radius-lg); border:1px solid var(--c-border); }
.leadership-badge { position:absolute; bottom:-16px; right:-16px; z-index:2; background:var(--c-accent); color:var(--c-dark); padding:var(--sp-3) var(--sp-5); border-radius:var(--radius-md); font-family:var(--font-ui); font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wide); text-transform:uppercase; }
.leadership-name { font-family:var(--font-display); font-size:var(--text-5xl); font-weight:var(--weight-light); letter-spacing:var(--tracking-tightest); line-height:var(--leading-tight); margin-bottom:var(--sp-2); }
.leadership-title { font-size:var(--text-sm); color:var(--c-accent); font-family:var(--font-ui); font-weight:var(--weight-medium); letter-spacing:var(--tracking-wide); text-transform:uppercase; margin-bottom:var(--sp-6); }
.leadership-bio { font-size:var(--text-md); color:var(--c-text-muted); line-height:var(--leading-loose); margin-bottom:var(--sp-8); max-width:56ch; }
.leadership-tags { display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.leadership-tag { font-size:var(--text-xs); font-family:var(--font-ui); font-weight:var(--weight-medium); color:var(--c-text-muted); padding:var(--sp-1) var(--sp-4); border:1px solid var(--c-border); border-radius:var(--radius-full); }

/* ── BLOG PREVIEW ─────────────────────────────────────────────── */
.blog-preview { background:var(--c-dark); }
.blog-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:var(--sp-6); }
.blog-card { border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--c-border); background:var(--c-dark-2); transition:all var(--dur-base); display:flex; flex-direction:column; }
.blog-card:hover { border-color:rgba(180,154,131,0.2); transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.blog-card__img { width:100%; aspect-ratio:3/2; overflow:hidden; background:var(--c-dark-4); }
.blog-card--featured .blog-card__img { aspect-ratio:16/9; }
.blog-card__img-inner { width:100%; height:100%; background:linear-gradient(135deg, var(--c-brand-deeper) 0%, var(--c-dark-3) 60%, rgba(180,154,131,0.1) 100%); transition:transform var(--dur-slow); display:flex; align-items:center; justify-content:center; font-size:3rem; opacity:0.4; }
.blog-card:hover .blog-card__img-inner { transform:scale(1.04); }
.blog-card__body { padding:var(--sp-6); flex:1; display:flex; flex-direction:column; }
.blog-card__cat { font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wider); text-transform:uppercase; color:var(--c-brand-light); margin-bottom:var(--sp-3); }
.blog-card__title { font-family:var(--font-ui); font-size:var(--text-lg); font-weight:var(--weight-semibold); color:var(--c-text); line-height:var(--leading-snug); margin-bottom:var(--sp-3); letter-spacing:var(--tracking-tight); flex:1; }
.blog-card--featured .blog-card__title { font-size:var(--text-xl); }
.blog-card__excerpt { font-size:var(--text-sm); color:var(--c-text-muted); line-height:var(--leading-loose); margin-bottom:var(--sp-4); }
.blog-card__meta { display:flex; align-items:center; justify-content:space-between; font-size:var(--text-xs); color:var(--c-text-faint); margin-top:auto; padding-top:var(--sp-4); border-top:1px solid var(--c-border-light); }
.blog-card__read-link { font-size:var(--text-xs); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-wide); text-transform:uppercase; color:var(--c-accent); display:flex; align-items:center; gap:var(--sp-1); transition:gap var(--dur-base); }
.blog-card:hover .blog-card__read-link { gap:var(--sp-3); }

/* ── CTA SECTION ──────────────────────────────────────────────── */
.cta-section { background:var(--c-brand-deeper); position:relative; overflow:hidden; text-align:center; }
.cta-section::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center, rgba(70,84,51,0.5) 0%, transparent 70%); }
.cta-bg-text { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-family:var(--font-display); font-size:clamp(8rem,18vw,22rem); font-weight:var(--weight-bold); color:rgba(255,255,255,0.025); letter-spacing:var(--tracking-widest); white-space:nowrap; pointer-events:none; user-select:none; text-transform:uppercase; }
.cta-content { position:relative; z-index:1; }
.cta-headline { font-family:var(--font-display); font-size:var(--text-5xl); font-weight:var(--weight-light); letter-spacing:var(--tracking-tightest); line-height:var(--leading-tight); margin-bottom:var(--sp-5); }
.cta-headline em { color:var(--c-accent); font-style:italic; }
.cta-sub { font-size:var(--text-md); color:rgba(232,228,220,0.6); max-width:52ch; margin:0 auto var(--sp-10); line-height:var(--leading-loose); }
.cta-actions { display:flex; align-items:center; justify-content:center; gap:var(--sp-4); flex-wrap:wrap; }

/* ── PORTAL PAGES ─────────────────────────────────────────────── */
.portal-page { min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--c-dark); padding:var(--sp-8); }
.portal-card { max-width:440px; width:100%; background:var(--c-dark-3); border:1px solid var(--c-border); border-radius:var(--radius-xl); padding:var(--sp-12) var(--sp-10); text-align:center; position:relative; overflow:hidden; }
.portal-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--c-brand), var(--c-accent)); }
.portal-card__icon { width:72px; height:72px; border-radius:50%; background:rgba(70,84,51,0.15); border:1px solid rgba(70,84,51,0.25); display:flex; align-items:center; justify-content:center; font-size:2rem; margin:0 auto var(--sp-6); }
.portal-card h1 { font-size:var(--text-3xl); font-family:var(--font-display); font-weight:var(--weight-medium); letter-spacing:var(--tracking-tightest); margin-bottom:var(--sp-3); }
.portal-card p { color:var(--c-text-muted); font-size:var(--text-sm); line-height:var(--leading-loose); margin-bottom:var(--sp-8); }
.portal-coming-badge { display:inline-flex; align-items:center; gap:var(--sp-2); font-size:var(--text-xs); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wider); text-transform:uppercase; padding:var(--sp-2) var(--sp-4); background:rgba(180,154,131,0.1); border:1px solid rgba(180,154,131,0.2); border-radius:var(--radius-full); color:var(--c-accent); margin-bottom:var(--sp-6); }
.portal-coming-badge::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--c-accent); animation:pulse-dot 2s ease-in-out infinite; }
@keyframes pulse-dot { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.5; transform:scale(0.8); } }

/* ── SCROLL REVEAL ────────────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(32px); transition:opacity var(--dur-slower) var(--ease-out), transform var(--dur-slower) var(--ease-out); }
.reveal.in-view { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:0.1s; } .reveal-delay-2 { transition-delay:0.2s; }
.reveal-delay-3 { transition-delay:0.3s; } .reveal-delay-4 { transition-delay:0.4s; }
.reveal-delay-5 { transition-delay:0.5s; } .reveal-delay-6 { transition-delay:0.6s; }

/* ── KEYFRAMES ────────────────────────────────────────────────── */
@keyframes fade-up { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes fade-in { from { opacity:0; } to { opacity:1; } }
@keyframes line-reveal { from { transform:translateY(110%); } to { transform:translateY(0); } }

/* ── RESPONSIVE ───────────────────────────────────────────────── */
@media (max-width:1024px) {
  .nav-links, .nav-portals { display:none; }
  .nav-hamburger { display:flex; }
  .mega-menu { display:none; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .service-cat-grid { grid-template-columns:repeat(2,1fr); }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px) {
  :root { --section-py:clamp(3.5rem,8vw,6rem); --section-px:1.25rem; }
  .hero { height:100svh; }
  .hero__scroll { display:none; }
  .hero__ctas { flex-direction:column; align-items:flex-start; }
  .pain-grid { grid-template-columns:1fr; }
  .process-steps { grid-template-columns:1fr 1fr; }
  .process-steps::before { display:none; }
  .leadership-inner { grid-template-columns:1fr; }
  .leadership-img-wrap { max-width:300px; margin:0 auto; }
  .blog-grid { grid-template-columns:1fr; }
  .wa-widget { bottom:var(--sp-5); right:var(--sp-4); }
}
@media (max-width:640px) {
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom__inner { flex-direction:column; align-items:flex-start; }
  .service-cat-grid { grid-template-columns:1fr; }
  .process-steps { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:1fr; }
}