/* ============================================
   LELISS Consulting — Stylesheet
   Brand: teal #15788C · lime #B4C82A
   ============================================ */

:root{
    /* Brand — extracted from logo */
    --teal-900:#0a3a45;
    --teal-700:#0e5a6b;
    --teal-500:#15788C;        /* primary brand teal */
    --teal-400:#1e92a8;
    --teal-300:#67b8c8;
    --lime-600:#9aaa1f;
    --lime-500:#B4C82A;        /* primary brand lime */
    --lime-400:#c5d84a;
    --lime-200:#e6efb0;

    --ink-900:#0c1418;
    --ink-700:#2a3a40;
    --ink-500:#5c6e74;
    --ink-300:#a8b4b8;
    --paper:#f7f5ef;           /* warm off-white, plays with lime */
    --paper-2:#efece3;
    --white:#ffffff;

    --grid: 1.5rem;
    --radius-sm:6px;
    --radius:14px;
    --radius-lg:28px;

    --font-display:"Fraunces", "Times New Roman", serif;
    --font-body:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono:"JetBrains Mono", monospace;
  }

  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:var(--font-body);
    background:var(--paper);
    color:var(--ink-900);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}

  /* ============ Layout ============ */
  .container{max-width:1360px;margin:0 auto;padding:0 2rem}
  @media (max-width:720px){.container{padding:0 1.25rem}}

  /* ============ NAV ============ */
  nav.top{
    position:fixed;top:0;left:0;right:0;z-index:50;
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    background:rgba(247,245,239,.78);
    border-bottom:1px solid rgba(21,120,140,.08);
  }
  nav.top .inner{
    display:flex;align-items:center;justify-content:space-between;
    height:78px;
  }
  .logo-mark{display:inline-flex;align-items:center;line-height:0}
  .logo-mark img{height:42px;width:auto;display:block;transition:opacity .25s ease}
  .logo-mark:hover img{opacity:.85}
  @media (max-width:600px){.logo-mark img{height:36px}}
  .nav-links{display:flex;gap:2.2rem;align-items:center}
  .nav-links a{font-size:.92rem;color:var(--ink-700);font-weight:500;position:relative;display:inline-flex;align-items:center;gap:.4rem}
  .nav-links a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--lime-500);transition:width .3s ease}
  .nav-links a:hover::after{width:100%}
  .nav-links a svg{width:13px;height:13px;transition:transform .25s}
  .nav-links a:hover svg{transform:translateY(2px)}

  /* Brochure link — special accent treatment */
  .nav-links a.nav-brochure{
    color:var(--teal-700);
    padding:.4rem .85rem;
    background:rgba(180,200,42,.12);
    border:1px solid rgba(180,200,42,.35);
    border-radius:999px;
    transition:all .25s ease;
  }
  .nav-links a.nav-brochure::after{display:none}
  .nav-links a.nav-brochure:hover{
    background:var(--lime-500);
    color:var(--ink-900);
    border-color:var(--lime-500);
    transform:translateY(-1px);
  }
  .nav-links a.nav-brochure svg{
    color:currentColor;
  }
  .nav-links a.nav-brochure:hover svg{transform:translateY(1px)}
  .nav-cta{
    background:var(--teal-500);color:#fff;padding:.7rem 1.2rem;border-radius:999px;
    font-size:.88rem;font-weight:500;transition:all .25s ease;
    display:inline-flex;align-items:center;gap:.5rem;
  }
  .nav-cta:hover{background:var(--teal-700);transform:translateY(-1px)}
  .nav-cta svg{width:14px;height:14px}
  .burger{display:none}
  @media (max-width:900px){
    .nav-links{display:none}
    .burger{display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer}
    .burger span{width:24px;height:2px;background:var(--ink-900)}
  }

  /* ============ HERO — WITH ANIMATED GRADIENT BACKGROUND ============ */
  .hero{
    position:relative;padding:9rem 0 6rem;overflow:hidden;
  }

  /* Animated mesh gradient backdrop */
  .hero-bg{
    position:absolute;inset:0;z-index:-1;overflow:hidden;
    background:var(--paper);
  }

  /* Floating gradient blobs */
  .hero-bg .blob{
    position:absolute;border-radius:50%;filter:blur(90px);
    opacity:.55;will-change:transform;
  }
  .hero-bg .blob-1{
    width:600px;height:600px;
    background:radial-gradient(circle, var(--teal-500) 0%, transparent 65%);
    top:-15%;left:-10%;
    animation:floatBlob1 18s ease-in-out infinite;
  }
  .hero-bg .blob-2{
    width:500px;height:500px;
    background:radial-gradient(circle, var(--lime-500) 0%, transparent 65%);
    bottom:-20%;right:-5%;opacity:.45;
    animation:floatBlob2 22s ease-in-out infinite;
  }
  .hero-bg .blob-3{
    width:400px;height:400px;
    background:radial-gradient(circle, var(--teal-400) 0%, transparent 60%);
    top:40%;right:30%;opacity:.35;
    animation:floatBlob3 25s ease-in-out infinite;
  }

  @keyframes floatBlob1{
    0%,100%{transform:translate(0,0) scale(1)}
    33%{transform:translate(60px,40px) scale(1.1)}
    66%{transform:translate(-30px,80px) scale(.95)}
  }
  @keyframes floatBlob2{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(-80px,-60px) scale(1.15)}
  }
  @keyframes floatBlob3{
    0%,100%{transform:translate(0,0) rotate(0deg)}
    50%{transform:translate(40px,-30px) rotate(20deg) scale(1.08)}
  }

  @media (prefers-reduced-motion: reduce){
    .hero-bg .blob{animation:none !important}
  }

  .hero-grid{
    display:grid;grid-template-columns:1.15fr .9fr;gap:5rem;align-items:center;
    position:relative;z-index:2;
  }
  @media (max-width:1024px){.hero-grid{grid-template-columns:1fr;gap:3rem}}

  .eyebrow{
    display:inline-flex;align-items:center;gap:.6rem;
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
    color:var(--teal-700);padding:.5rem .9rem;border:1px solid rgba(21,120,140,.25);
    border-radius:999px;background:rgba(255,255,255,.7);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  }
  .eyebrow .pulse{width:7px;height:7px;border-radius:50%;background:var(--lime-500);box-shadow:0 0 0 0 rgba(180,200,42,.6);animation:pulse 2s infinite}
  @keyframes pulse{
    0%{box-shadow:0 0 0 0 rgba(180,200,42,.6)}
    70%{box-shadow:0 0 0 10px rgba(180,200,42,0)}
    100%{box-shadow:0 0 0 0 rgba(180,200,42,0)}
  }

  h1.hero-title{
    font-family:var(--font-display);
    font-weight:400;
    font-size:clamp(2.6rem, 5.4vw, 4.6rem);
    line-height:1.02;
    letter-spacing:-.025em;
    color:var(--ink-900);
    margin:1.5rem 0 1.75rem;
    font-variation-settings: "opsz" 144;
  }
  h1.hero-title em{
    font-style:italic;color:var(--teal-500);font-weight:500;
    position:relative;display:inline-block;
  }
  h1.hero-title em::after{
    content:"";position:absolute;left:0;right:0;bottom:.05em;height:.18em;
    background:var(--lime-500);opacity:.45;z-index:-1;border-radius:2px;
  }
  .hero-sub{
    font-size:1.13rem;color:var(--ink-500);max-width:560px;
    margin-bottom:2.5rem;line-height:1.65;
  }
  .hero-ctas{display:flex;gap:1rem;flex-wrap:wrap;align-items:center}
  .btn{
    display:inline-flex;align-items:center;gap:.7rem;
    padding:1rem 1.6rem;border-radius:999px;font-weight:500;font-size:.95rem;
    transition:all .3s cubic-bezier(.2,.8,.2,1);cursor:pointer;border:none;
  }
  .btn-primary{background:var(--ink-900);color:var(--paper)}
  .btn-primary:hover{background:var(--teal-700);transform:translateY(-2px);box-shadow:0 10px 30px -10px rgba(14,90,107,.5)}
  .btn-ghost{background:transparent;color:var(--ink-900);border:1px solid rgba(12,20,24,.18)}
  .btn-ghost:hover{border-color:var(--ink-900);background:rgba(12,20,24,.04)}
  .btn svg{width:16px;height:16px;transition:transform .3s}
  .btn:hover svg{transform:translateX(3px)}

  .hero-meta{
    display:flex;gap:2.5rem;margin-top:3rem;padding-top:2rem;
    border-top:1px solid rgba(12,20,24,.1);
  }
  .hero-meta div b{
    display:block;font-family:var(--font-display);font-size:1.9rem;font-weight:500;
    color:var(--teal-500);letter-spacing:-.02em;
  }
  .hero-meta div span{font-size:.82rem;color:var(--ink-500);letter-spacing:.02em}

  /* ----- Hero visual ----- */
  .hero-visual{position:relative;height:560px}
  @media (max-width:1024px){.hero-visual{height:480px}}

  .visual-card{
    position:absolute;background:#fff;border-radius:var(--radius-lg);
    box-shadow:0 30px 80px -30px rgba(10,58,69,.25), 0 8px 20px -8px rgba(10,58,69,.1);
    overflow:hidden;
  }
  .vc-main{
    inset:0 0 80px 0;
    background:linear-gradient(155deg,var(--teal-500) 0%,var(--teal-700) 60%,var(--teal-900) 100%);
    padding:2.5rem;display:flex;flex-direction:column;justify-content:space-between;
    color:#fff;
  }
  .vc-main::before{
    content:"";position:absolute;top:-50%;right:-30%;width:80%;height:160%;
    background:radial-gradient(circle, rgba(180,200,42,.3) 0%, transparent 60%);
    pointer-events:none;
  }
  .vc-main .iso-badge{
    align-self:flex-start;display:inline-flex;align-items:center;gap:.5rem;
    background:rgba(255,255,255,.12);backdrop-filter:blur(8px);
    padding:.5rem .9rem;border-radius:999px;font-size:.72rem;letter-spacing:.15em;
    font-family:var(--font-mono);border:1px solid rgba(255,255,255,.18);
  }
  .vc-main .iso-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime-500)}
  .vc-main h3{
    font-family:var(--font-display);font-weight:400;font-size:2rem;line-height:1.1;
    letter-spacing:-.02em;
  }
  .vc-main h3 em{color:var(--lime-400);font-style:italic}
  .vc-main .grid-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:1rem;
    border-top:1px solid rgba(255,255,255,.15);padding-top:1.5rem;position:relative;z-index:2}
  .vc-main .grid-meta div b{display:block;font-family:var(--font-display);font-size:1.6rem;color:var(--lime-400);font-weight:500}
  .vc-main .grid-meta div span{font-size:.7rem;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:.1em}

  .vc-float{
    bottom:0;left:20px;right:20px;height:110px;background:#fff;
    border:1px solid rgba(12,20,24,.06);
    padding:1.3rem 1.5rem;display:flex;align-items:center;gap:1rem;
    transform:translateY(0);
    animation:floaty 6s ease-in-out infinite;
  }
  @keyframes floaty{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-8px)}
  }
  .vc-float .check{
    width:42px;height:42px;border-radius:50%;background:var(--lime-500);
    display:grid;place-items:center;flex-shrink:0;
  }
  .vc-float .check svg{width:22px;height:22px;color:var(--teal-900)}
  .vc-float .txt b{display:block;font-size:.95rem;color:var(--ink-900)}
  .vc-float .txt span{font-size:.78rem;color:var(--ink-500)}

  .vc-side{
    top:30px;right:-30px;width:170px;height:170px;background:var(--paper-2);
    transform:rotate(8deg);padding:1.4rem;
  }
  @media (max-width:1024px){.vc-side{right:0}}
  .vc-side .ring{
    width:60px;height:60px;border-radius:50%;border:3px solid var(--lime-500);
    border-right-color:transparent;border-bottom-color:transparent;
    transform:rotate(-45deg);margin-bottom:.8rem;
  }
  .vc-side b{display:block;font-family:var(--font-display);font-size:1.4rem;font-weight:500;color:var(--teal-700)}
  .vc-side span{font-size:.7rem;color:var(--ink-500);letter-spacing:.08em;text-transform:uppercase}

  /* ============ MARQUEE STRIP ============ */
  .strip{
    background:var(--ink-900);color:var(--paper);padding:1.5rem 0;overflow:hidden;
    border-top:1px solid rgba(255,255,255,.05);
  }
  .marquee{display:flex;gap:4rem;animation:scroll 30s linear infinite;white-space:nowrap}
  .marquee span{
    font-family:var(--font-display);font-size:1.4rem;font-weight:400;font-style:italic;
    letter-spacing:-.01em;display:inline-flex;align-items:center;gap:4rem;
  }
  .marquee span::after{content:"✦";color:var(--lime-500);font-style:normal;font-size:1rem}
  @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  /* ============ SECTION COMMON ============ */
  section{padding:7rem 0;position:relative}
  @media (max-width:720px){section{padding:5rem 0}}
  .section-head{display:grid;grid-template-columns:.4fr .6fr;gap:3rem;align-items:end;margin-bottom:4rem}
  @media (max-width:900px){.section-head{grid-template-columns:1fr;gap:1.5rem}}
  .section-head h2{
    font-family:var(--font-display);font-weight:400;
    font-size:clamp(2rem, 4vw, 3.4rem);line-height:1.05;letter-spacing:-.02em;
    color:var(--ink-900);
  }
  .section-head h2 em{color:var(--teal-500);font-style:italic}
  .section-head p{color:var(--ink-500);font-size:1.05rem;line-height:1.7;max-width:520px}
  .section-label{
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.22em;
    text-transform:uppercase;color:var(--lime-600);margin-bottom:1rem;
    display:flex;align-items:center;gap:.7rem;
  }
  .section-label::before{content:"";width:24px;height:1px;background:var(--lime-600)}

  /* ============ PROOF / NUMBERS ============ */
  .proof{background:var(--paper-2);position:relative}
  .proof::before{
    content:"";position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,transparent,rgba(21,120,140,.3),transparent);
  }
  .stats{
    display:grid;grid-template-columns:repeat(4,1fr);gap:0;
    border-top:1px solid rgba(12,20,24,.1);border-bottom:1px solid rgba(12,20,24,.1);
  }
  @media (max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}}
  .stat{
    padding:3rem 2rem;border-right:1px solid rgba(12,20,24,.1);
    transition:background .3s ease;
  }
  .stat:last-child{border-right:none}
  @media (max-width:900px){
    .stat:nth-child(2n){border-right:none}
    .stat:nth-child(-n+2){border-bottom:1px solid rgba(12,20,24,.1)}
  }
  .stat:hover{background:var(--paper)}
  .stat .num{
    font-family:var(--font-display);font-size:clamp(3rem,5vw,4.5rem);font-weight:400;
    line-height:1;letter-spacing:-.03em;color:var(--teal-500);
    display:flex;align-items:baseline;gap:.2rem;
  }
  .stat .num small{font-size:.4em;color:var(--lime-600);font-weight:500}
  .stat .lbl{margin-top:1rem;font-size:.92rem;color:var(--ink-700);line-height:1.5;max-width:240px}

  /* ============ EXPERTISE — INTERACTIVE TABS ============ */
  .expertise-shell{
    display:grid;grid-template-columns:.42fr .58fr;gap:3rem;
    align-items:stretch;
  }
  @media (max-width:1024px){.expertise-shell{grid-template-columns:1fr;gap:2rem}}

  /* Left rail — vertical tabs */
  .exp-rail{
    display:flex;flex-direction:column;gap:.5rem;
    position:relative;
  }
  .exp-rail::before{
    content:"";position:absolute;top:0;bottom:0;left:0;width:1px;
    background:linear-gradient(180deg,transparent,rgba(12,20,24,.12),transparent);
  }

  .exp-tab{
    position:relative;display:grid;grid-template-columns:auto 1fr auto;
    gap:1.25rem;align-items:center;
    padding:1.4rem 1.8rem 1.4rem 2rem;
    cursor:pointer;border-radius:0 var(--radius) var(--radius) 0;
    transition:all .4s cubic-bezier(.2,.8,.2,1);
    border:none;background:transparent;text-align:left;width:100%;
    font-family:inherit;
  }
  .exp-tab::before{
    content:"";position:absolute;left:0;top:50%;width:2px;height:0;
    background:var(--lime-500);transform:translateY(-50%);
    transition:height .4s cubic-bezier(.2,.8,.2,1);
  }
  .exp-tab:hover{background:rgba(255,255,255,.5);padding-left:2.3rem}
  .exp-tab:hover::before{height:30%}
  .exp-tab.active{
    background:#fff;
    box-shadow:0 12px 36px -16px rgba(10,58,69,.18);
    padding-left:2.3rem;
  }
  .exp-tab.active::before{height:60%}

  .exp-tab .exp-num{
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.15em;
    color:var(--ink-300);text-transform:uppercase;font-weight:500;
    transition:color .3s;flex-shrink:0;
  }
  .exp-tab.active .exp-num,
  .exp-tab:hover .exp-num{color:var(--teal-500)}

  .exp-tab .exp-title{
    font-family:var(--font-display);font-weight:500;font-size:1.15rem;
    line-height:1.25;letter-spacing:-.005em;color:var(--ink-900);
    transition:color .3s;
  }
  .exp-tab.active .exp-title{color:var(--teal-700)}

  .exp-tab .exp-arrow{
    width:32px;height:32px;border-radius:50%;
    background:transparent;border:1px solid rgba(12,20,24,.12);
    display:grid;place-items:center;flex-shrink:0;
    transition:all .4s cubic-bezier(.2,.8,.2,1);
    opacity:.4;
  }
  .exp-tab:hover .exp-arrow{opacity:1}
  .exp-tab.active .exp-arrow{
    background:var(--lime-500);border-color:var(--lime-500);
    transform:rotate(-45deg);opacity:1;
  }
  .exp-tab .exp-arrow svg{width:13px;height:13px;color:var(--ink-900)}

  /* Right panel — content preview */
  .exp-panel{
    background:linear-gradient(155deg,var(--ink-900) 0%,var(--teal-900) 100%);
    border-radius:var(--radius-lg);padding:3rem;color:var(--paper);
    position:relative;overflow:hidden;min-height:520px;
    display:flex;flex-direction:column;
  }
  .exp-panel::before{
    content:"";position:absolute;top:-30%;right:-20%;width:60%;height:80%;
    background:radial-gradient(circle, rgba(180,200,42,.22), transparent 60%);
    pointer-events:none;animation:driftA 14s ease-in-out infinite;
  }
  .exp-panel::after{
    content:"";position:absolute;bottom:-30%;left:-20%;width:60%;height:80%;
    background:radial-gradient(circle, rgba(30,146,168,.25), transparent 60%);
    pointer-events:none;animation:driftB 16s ease-in-out infinite;
  }
  @keyframes driftA{
    0%,100%{transform:translate(0,0)}
    50%{transform:translate(-10%,8%)}
  }
  @keyframes driftB{
    0%,100%{transform:translate(0,0)}
    50%{transform:translate(8%,-10%)}
  }

  .exp-slide{display:none;position:relative;z-index:1;flex:1;flex-direction:column}
  .exp-slide.active{display:flex;animation:slideIn .6s cubic-bezier(.2,.8,.2,1) both}
  @keyframes slideIn{
    from{opacity:0;transform:translateY(12px)}
    to{opacity:1;transform:translateY(0)}
  }

  .exp-slide .badge{
    display:inline-flex;align-self:flex-start;align-items:center;gap:.55rem;
    padding:.5rem .9rem;background:rgba(180,200,42,.14);
    border:1px solid rgba(180,200,42,.3);border-radius:999px;
    font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;
    color:var(--lime-400);text-transform:uppercase;margin-bottom:1.5rem;
  }
  .exp-slide .badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime-500)}

  .exp-slide h3{
    font-family:var(--font-display);font-weight:400;
    font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.05;
    letter-spacing:-.02em;margin-bottom:1.2rem;
  }
  .exp-slide h3 em{color:var(--lime-400);font-style:italic}

  .exp-slide > p{
    font-size:1.05rem;line-height:1.65;color:rgba(247,245,239,.78);
    max-width:520px;margin-bottom:2rem;
  }

  .exp-features{
    list-style:none;display:grid;grid-template-columns:repeat(2,1fr);
    gap:.85rem 1.5rem;margin-bottom:2rem;
  }
  @media (max-width:600px){.exp-features{grid-template-columns:1fr}}
  .exp-features li{
    display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:flex-start;
    font-size:.92rem;color:rgba(247,245,239,.85);line-height:1.5;
  }
  .exp-features li::before{
    content:"";width:18px;height:18px;border-radius:50%;
    background:rgba(180,200,42,.15);border:1px solid rgba(180,200,42,.4);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B4C82A' stroke-width='3'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:center;background-size:11px;
  }

  .exp-footer{
    margin-top:auto;padding-top:1.8rem;
    border-top:1px solid rgba(255,255,255,.1);
    display:flex;justify-content:space-between;align-items:center;
    flex-wrap:wrap;gap:1rem;
  }
  .exp-refs{
    font-family:var(--font-mono);font-size:.7rem;letter-spacing:.15em;
    color:rgba(247,245,239,.5);text-transform:uppercase;
  }
  .exp-refs b{color:var(--lime-400);font-weight:500;margin-right:.4rem}

  .exp-cta{
    display:inline-flex;align-items:center;gap:.6rem;
    padding:.7rem 1.2rem;background:var(--lime-500);color:var(--ink-900);
    border-radius:999px;font-size:.88rem;font-weight:500;
    transition:all .25s ease;
  }
  .exp-cta:hover{background:#fff;transform:translateX(3px)}
  .exp-cta svg{width:14px;height:14px}

  /* ============ APPROACH / PROCESS ============ */
  .approach{background:var(--ink-900);color:var(--paper)}
  .approach .section-head h2{color:#fff}
  .approach .section-head h2 em{color:var(--lime-400)}
  .approach .section-head p{color:rgba(247,245,239,.65)}
  .approach .section-label{color:var(--lime-400)}
  .approach .section-label::before{background:var(--lime-400)}

  .steps{
    display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius-lg);overflow:hidden;
  }
  @media (max-width:900px){.steps{grid-template-columns:1fr}}
  .step{
    background:var(--ink-900);padding:2.5rem;
    transition:background .3s ease;position:relative;
  }
  .step:hover{background:#142025}
  .step .step-num{
    font-family:var(--font-display);font-size:3rem;font-weight:400;
    color:var(--teal-400);line-height:1;font-style:italic;
  }
  .step h4{
    font-family:var(--font-display);font-size:1.3rem;font-weight:500;
    margin:1.5rem 0 .7rem;color:#fff;
  }
  .step p{color:rgba(247,245,239,.6);font-size:.9rem;line-height:1.6}
  .step::after{
    content:"";position:absolute;top:50%;right:-1px;width:2px;height:0;
    background:var(--lime-500);transition:height .4s ease;transform:translateY(-50%);
  }
  .step:hover::after{height:60%}

  /* ============ DIRECTOR MESSAGE ============ */
  .director-msg{
    background:var(--paper);position:relative;overflow:hidden;
  }
  .director-msg::before{
    content:"";position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,transparent,rgba(21,120,140,.2),transparent);
  }
  /* Giant decorative quote glyph */
  .director-msg::after{
    content:"\201C"; /* curly opening quote */
    position:absolute;top:3rem;left:50%;transform:translateX(-50%);
    font-family:var(--font-display);font-style:italic;font-weight:400;
    font-size:clamp(20rem,40vw,32rem);line-height:.7;
    color:var(--teal-500);opacity:.05;pointer-events:none;
    user-select:none;letter-spacing:-.04em;z-index:0;
  }

  .dm-wrap{
    display:grid;grid-template-columns:.85fr 1.15fr;gap:5rem;
    align-items:center;position:relative;z-index:1;
  }
  @media (max-width:1024px){.dm-wrap{grid-template-columns:1fr;gap:3rem}}

  /* ---- Portrait composition ---- */
  .dm-portrait{position:relative}
  .dm-portrait .dm-frame{
    position:relative;border-radius:var(--radius-lg);overflow:hidden;
    aspect-ratio:4/5;background:var(--paper-2);
    box-shadow:0 40px 100px -40px rgba(10,58,69,.35);
    transform:rotate(-1.5deg);
    transition:transform .8s cubic-bezier(.2,.8,.2,1);
  }
  .dm-portrait:hover .dm-frame{transform:rotate(0deg)}
  .dm-portrait .dm-frame img{
    width:100%;height:100%;object-fit:cover;
    transition:transform 1s cubic-bezier(.2,.8,.2,1);
    filter:saturate(1.02) contrast(1.02);
  }
  .dm-portrait:hover .dm-frame img{transform:scale(1.04)}

  /* Decorative teal frame behind portrait */
  .dm-portrait::before{
    content:"";position:absolute;
    top:-1.2rem;left:-1.2rem;width:62%;height:62%;
    border:1.5px solid var(--teal-500);border-radius:var(--radius-lg);
    z-index:-1;transition:all .6s cubic-bezier(.2,.8,.2,1);
  }
  .dm-portrait:hover::before{top:-.6rem;left:-.6rem}

  /* Lime accent card on portrait */
  .dm-portrait .dm-stamp{
    position:absolute;bottom:-1.5rem;right:-1.5rem;
    background:var(--lime-500);padding:1.4rem 1.6rem;
    border-radius:var(--radius);
    box-shadow:0 20px 40px -16px rgba(180,200,42,.5);
    transform:rotate(3deg);
    transition:transform .5s cubic-bezier(.2,.8,.2,1);
    z-index:2;max-width:200px;
  }
  .dm-portrait:hover .dm-stamp{transform:rotate(0deg) translateY(-4px)}
  .dm-portrait .dm-stamp .dm-stamp-num{
    font-family:var(--font-display);font-size:2.4rem;font-weight:500;
    line-height:1;color:var(--teal-900);letter-spacing:-.02em;
    font-style:italic;
  }
  .dm-portrait .dm-stamp .dm-stamp-lbl{
    font-family:var(--font-mono);font-size:.65rem;letter-spacing:.18em;
    text-transform:uppercase;color:var(--teal-900);
    margin-top:.4rem;font-weight:600;
  }
  @media (max-width:600px){
    .dm-portrait .dm-stamp{bottom:-1rem;right:-.5rem;padding:1.1rem 1.3rem}
    .dm-portrait .dm-stamp .dm-stamp-num{font-size:1.9rem}
  }

  /* Small signature ribbon */
  .dm-portrait .dm-ribbon{
    position:absolute;top:1.5rem;left:-2rem;z-index:3;
    background:var(--ink-900);color:#fff;
    padding:.6rem 1.2rem;font-family:var(--font-mono);
    font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
    border-radius:0 999px 999px 0;
    box-shadow:0 12px 30px -10px rgba(0,0,0,.4);
  }
  .dm-portrait .dm-ribbon::before{
    content:"";display:inline-block;width:6px;height:6px;border-radius:50%;
    background:var(--lime-500);margin-right:.5rem;vertical-align:middle;
  }

  /* ---- Message content ---- */
  .dm-content{position:relative}

  .dm-content .dm-eyebrow{
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.22em;
    text-transform:uppercase;color:var(--lime-600);
    display:flex;align-items:center;gap:.7rem;margin-bottom:1.5rem;
  }
  .dm-content .dm-eyebrow::before{content:"";width:24px;height:1px;background:var(--lime-600)}

  .dm-content h2{
    font-family:var(--font-display);font-weight:400;
    font-size:clamp(2rem,4vw,3.2rem);line-height:1.05;letter-spacing:-.025em;
    color:var(--ink-900);margin-bottom:2rem;
  }
  .dm-content h2 em{color:var(--teal-500);font-style:italic}

  /* Lead paragraph — bigger, with first-letter drop cap */
  .dm-content .dm-lead{
    font-family:var(--font-display);font-weight:400;
    font-size:1.4rem;line-height:1.45;color:var(--ink-900);
    letter-spacing:-.005em;margin-bottom:1.5rem;
    font-style:italic;
  }
  .dm-content .dm-lead::first-letter{
    float:left;font-size:4.5rem;line-height:.85;
    font-weight:500;font-style:italic;color:var(--teal-500);
    margin:.3rem .8rem -.2rem 0;
    text-shadow:0 4px 12px rgba(21,120,140,.15);
  }

  .dm-content .dm-body{
    font-size:1.02rem;line-height:1.7;color:var(--ink-500);
    margin-bottom:1.2rem;max-width:560px;
  }

  .dm-content .dm-body strong{
    color:var(--ink-900);font-weight:500;
    background:linear-gradient(transparent 60%, rgba(180,200,42,.35) 60%);
    padding:0 .15em;
  }

  /* Signature block */
  .dm-signature{
    margin-top:2.5rem;padding-top:2rem;
    border-top:1px solid rgba(12,20,24,.1);
    display:grid;grid-template-columns:auto 1fr;gap:1.5rem;align-items:center;
  }
  .dm-sig-mark{
    font-family:var(--font-display);font-style:italic;font-weight:400;
    font-size:2.8rem;line-height:.9;letter-spacing:-.03em;
    color:var(--teal-500);
  }
  .dm-sig-info b{
    display:block;font-family:var(--font-display);font-size:1.2rem;
    font-weight:500;color:var(--ink-900);letter-spacing:-.01em;
  }
  .dm-sig-info span{
    display:block;font-size:.85rem;color:var(--ink-500);margin-top:.2rem;
    font-family:var(--font-mono);letter-spacing:.08em;
  }

  .dm-actions{
    margin-top:2rem;display:flex;gap:1rem;flex-wrap:wrap;align-items:center;
  }
  .dm-actions .dm-social{
    display:inline-flex;align-items:center;gap:.55rem;
    padding:.7rem 1.1rem;background:#fff;border:1px solid rgba(12,20,24,.12);
    border-radius:999px;font-size:.85rem;color:var(--ink-700);
    transition:all .25s ease;font-weight:500;
  }
  .dm-actions .dm-social:hover{
    background:var(--ink-900);color:#fff;border-color:var(--ink-900);
    transform:translateY(-2px);
    box-shadow:0 12px 26px -10px rgba(10,58,69,.35);
  }
  .dm-actions .dm-social svg{width:16px;height:16px}

  /* ============ SECTORS — MODERN GRID ON DARK BG ============ */
  .sectors{
    background:var(--ink-900);color:var(--paper);position:relative;overflow:hidden;
  }
  /* Atmospheric gradients */
  .sectors::before{
    content:"";position:absolute;top:-20%;right:-10%;width:60%;height:80%;
    background:radial-gradient(circle, rgba(21,120,140,.25) 0%, transparent 60%);
    pointer-events:none;
  }
  .sectors::after{
    content:"";position:absolute;bottom:-20%;left:-10%;width:60%;height:80%;
    background:radial-gradient(circle, rgba(180,200,42,.12) 0%, transparent 60%);
    pointer-events:none;
  }
  /* Subtle grid pattern overlay — engineering / industrial feel */
  .sectors .container{position:relative;z-index:1}

  .sectors .section-head h2{color:#fff}
  .sectors .section-head h2 em{color:var(--lime-400)}
  .sectors .section-head p{color:rgba(247,245,239,.65)}
  .sectors .section-label{color:var(--lime-400)}
  .sectors .section-label::before{background:var(--lime-400)}

  /* Sector cards grid — 4 + 3 layout, all equal size */
  .sectors-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1.25rem;
  }
  @media (max-width:1100px){.sectors-grid{grid-template-columns:repeat(3,1fr)}}
  @media (max-width:800px){.sectors-grid{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:520px){.sectors-grid{grid-template-columns:1fr}}

  /* The 7th card centers in its row on desktop (4+3 = bottom row has 3, offset) */
  /* No featured card — all equal size */

  .sector-card{
    position:relative;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.08);
    border-radius:var(--radius-lg);
    padding:1.8rem 1.6rem;
    display:flex;flex-direction:column;
    min-height:240px;
    overflow:hidden;
    transition:all .5s cubic-bezier(.2,.8,.2,1);
    cursor:pointer;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
  }
  /* Animated border gradient on hover */
  .sector-card::before{
    content:"";position:absolute;inset:0;border-radius:var(--radius-lg);
    padding:1px;
    background:linear-gradient(135deg,rgba(180,200,42,.6),rgba(21,120,140,.6));
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;mask-composite:exclude;
    opacity:0;transition:opacity .5s ease;
    pointer-events:none;
  }
  /* Lime corner accent */
  .sector-card::after{
    content:"";position:absolute;top:0;right:0;
    width:60px;height:60px;
    background:radial-gradient(circle at top right, rgba(180,200,42,.4), transparent 70%);
    opacity:0;transition:opacity .4s ease;
    pointer-events:none;
  }
  .sector-card:hover{
    transform:translateY(-6px);
    background:rgba(255,255,255,.04);
    box-shadow:0 30px 60px -20px rgba(0,0,0,.5),
               0 0 0 1px rgba(180,200,42,.12);
  }
  .sector-card:hover::before{opacity:1}
  .sector-card:hover::after{opacity:1}

  /* Card content */
  .sector-card .sc-top{
    display:flex;justify-content:space-between;align-items:flex-start;
    margin-bottom:1.3rem;
  }
  .sector-card .sc-icon{
    width:46px;height:46px;border-radius:12px;
    background:rgba(180,200,42,.1);
    border:1px solid rgba(180,200,42,.25);
    display:grid;place-items:center;
    color:var(--lime-400);
    transition:all .4s ease;
  }
  .sector-card:hover .sc-icon{
    background:var(--lime-500);border-color:var(--lime-500);
    color:var(--ink-900);
    transform:rotate(-5deg) scale(1.05);
  }
  .sector-card .sc-icon svg{width:22px;height:22px}

  .sector-card .sc-num{
    font-family:var(--font-mono);font-size:.7rem;
    letter-spacing:.18em;color:rgba(247,245,239,.4);
    text-transform:uppercase;font-weight:500;
  }

  .sector-card h4{
    font-family:var(--font-display);font-weight:500;
    font-size:1.2rem;line-height:1.2;letter-spacing:-.015em;
    color:#fff;margin-bottom:.7rem;
    transition:color .3s ease;
  }
  .sector-card:hover h4{color:var(--lime-400)}

  .sector-card p{
    font-size:.85rem;line-height:1.55;
    color:rgba(247,245,239,.6);
    margin-bottom:1.2rem;flex:1;
  }

  /* Reference tags */
  .sc-tags{
    display:flex;flex-wrap:wrap;gap:.35rem;
    margin-top:auto;padding-top:.9rem;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .sc-tags span{
    font-family:var(--font-mono);font-size:.6rem;
    letter-spacing:.12em;text-transform:uppercase;
    color:rgba(247,245,239,.55);
    padding:.28rem .55rem;background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:999px;font-weight:500;
    transition:all .3s ease;
  }
  .sector-card:hover .sc-tags span{
    border-color:rgba(180,200,42,.25);
    color:rgba(180,200,42,.85);
  }

  /* Sectors footer — stats strip */
  .sectors-stats{
    margin-top:3rem;
    display:grid;grid-template-columns:repeat(3,1fr);
    gap:0;
    padding:2rem 0;
    border-top:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  @media (max-width:720px){.sectors-stats{grid-template-columns:1fr;gap:1rem}}
  .ss-item{
    padding:0 2rem;
    border-right:1px solid rgba(255,255,255,.08);
  }
  .ss-item:last-child{border-right:none}
  @media (max-width:720px){.ss-item{border-right:none;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.08)}.ss-item:last-child{border-bottom:none}}

  .ss-item b{
    display:block;font-family:var(--font-display);
    font-size:2rem;font-weight:500;
    color:var(--lime-400);letter-spacing:-.02em;
    line-height:1;margin-bottom:.4rem;
    font-style:italic;
  }
  .ss-item span{
    font-size:.85rem;color:rgba(247,245,239,.6);
    line-height:1.4;display:block;
  }


  /* ============ LEADER ============ */
  .leader{background:var(--paper-2)}
  .leader-card{
    display:grid;grid-template-columns:.8fr 1.2fr;gap:0;
    background:#fff;border-radius:var(--radius-lg);overflow:hidden;
    box-shadow:0 30px 80px -40px rgba(10,58,69,.25);
  }
  @media (max-width:900px){.leader-card{grid-template-columns:1fr}}
  .leader-portrait{
    background:linear-gradient(165deg,var(--teal-500),var(--teal-900));
    padding:3rem;color:#fff;position:relative;min-height:420px;
    display:flex;flex-direction:column;justify-content:flex-end;
  }
  .leader-portrait::before{
    content:"L";position:absolute;top:-2rem;right:-1rem;
    font-family:var(--font-display);font-size:24rem;font-weight:400;
    color:rgba(255,255,255,.05);line-height:1;font-style:italic;
  }
  .leader-portrait .role-tag{
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;
    color:var(--lime-400);text-transform:uppercase;margin-bottom:1rem;position:relative;z-index:1;
  }
  .leader-portrait h3{
    font-family:var(--font-display);font-size:2.6rem;font-weight:400;
    letter-spacing:-.02em;line-height:1.05;position:relative;z-index:1;
  }
  .leader-portrait h3 em{color:var(--lime-400);font-style:italic;display:block}
  .leader-portrait .position{margin-top:.7rem;color:rgba(255,255,255,.75);font-size:.95rem;position:relative;z-index:1}

  .leader-bio{padding:3.5rem;display:flex;flex-direction:column;justify-content:space-between}
  .leader-bio .quote{
    font-family:var(--font-display);font-size:1.6rem;font-weight:400;
    line-height:1.3;letter-spacing:-.01em;color:var(--ink-900);
  }
  .leader-bio .quote::before{
    content:"";display:block;width:36px;height:3px;background:var(--lime-500);
    margin-bottom:1.5rem;
  }
  .leader-bio .credentials{
    display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;margin-top:2.5rem;
    padding-top:2rem;border-top:1px solid rgba(12,20,24,.1);
  }
  .leader-bio .credentials div b{display:block;font-family:var(--font-display);font-size:2rem;color:var(--teal-500);font-weight:500}
  .leader-bio .credentials div span{font-size:.85rem;color:var(--ink-500)}

  /* ============ CERTIFICATIONS RIBBON ============ */
  .certs{padding:5rem 0;background:#fff;border-top:1px solid rgba(12,20,24,.06);border-bottom:1px solid rgba(12,20,24,.06)}
  .certs-grid{
    display:grid;grid-template-columns:auto repeat(5,1fr);gap:3rem;align-items:center;
  }
  @media (max-width:900px){.certs-grid{grid-template-columns:1fr;gap:2rem}}
  .certs-title{
    font-family:var(--font-display);font-size:1.15rem;font-style:italic;
    color:var(--ink-500);line-height:1.4;max-width:200px;
  }
  .cert-item{
    font-family:var(--font-display);font-size:1.3rem;font-weight:500;
    color:var(--ink-900);letter-spacing:-.01em;text-align:center;
    padding:1rem;border-left:1px solid rgba(12,20,24,.08);
    transition:color .3s;cursor:default;
  }
  .cert-item:hover{color:var(--teal-500)}
  .cert-item small{display:block;font-family:var(--font-body);font-size:.7rem;font-weight:500;color:var(--ink-500);letter-spacing:.1em;margin-top:.3rem;text-transform:uppercase}
  @media (max-width:900px){.cert-item{border-left:none;border-bottom:1px solid rgba(12,20,24,.08);padding-bottom:1rem;text-align:left}}

  /* ============ CTA ============ */
  .cta-section{
    background:var(--ink-900);color:var(--paper);position:relative;overflow:hidden;
  }
  .cta-section::before{
    content:"";position:absolute;inset:0;
    background:
      radial-gradient(circle at 15% 30%, rgba(21,120,140,.35), transparent 50%),
      radial-gradient(circle at 85% 70%, rgba(180,200,42,.18), transparent 50%);
  }
  .cta-inner{
    position:relative;z-index:1;text-align:center;max-width:780px;margin:0 auto;
  }
  .cta-inner h2{
    font-family:var(--font-display);font-weight:400;
    font-size:clamp(2.4rem,5vw,4rem);line-height:1.05;letter-spacing:-.025em;
  }
  .cta-inner h2 em{color:var(--lime-400);font-style:italic}
  .cta-inner p{margin:1.5rem auto 2.5rem;color:rgba(247,245,239,.65);font-size:1.1rem;max-width:520px}
  .cta-inner .btn-primary{background:var(--lime-500);color:var(--ink-900)}
  .cta-inner .btn-primary:hover{background:var(--lime-400)}
  .cta-contact{
    margin-top:3rem;padding-top:2.5rem;border-top:1px solid rgba(255,255,255,.1);
    display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;
  }
  .cta-contact div b{display:block;font-size:.7rem;color:var(--lime-400);letter-spacing:.2em;text-transform:uppercase;font-family:var(--font-mono);margin-bottom:.4rem}
  .cta-contact div a{font-family:var(--font-display);font-size:1.15rem;color:#fff;font-weight:500}
  .cta-contact div a:hover{color:var(--lime-400)}

  /* ============ FOOTER ============ */
  footer{background:#050a0c;color:var(--paper);padding:5rem 0 2rem;position:relative;overflow:hidden}
  footer::before{
    content:"";position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,transparent 0%,rgba(180,200,42,.3) 50%,transparent 100%);
  }
  .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:3rem;margin-bottom:4rem}
  @media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr;gap:2.5rem}}
  @media (max-width:600px){.foot-grid{grid-template-columns:1fr}}
  .foot-grid h5{
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
    color:var(--lime-400);margin-bottom:1.2rem;
  }
  .foot-grid ul{list-style:none;display:flex;flex-direction:column;gap:.7rem}
  .foot-grid ul li a{color:rgba(247,245,239,.6);font-size:.92rem;transition:color .2s}
  .foot-grid ul li a:hover{color:var(--lime-400)}
  .foot-brand p{color:rgba(247,245,239,.5);font-size:.92rem;line-height:1.6;margin-top:1.2rem;max-width:340px}

  /* Footer contact items with icons */
  .foot-contact-list{list-style:none;display:flex;flex-direction:column;gap:1rem}
  .foot-contact-list li{
    display:grid;grid-template-columns:auto 1fr;gap:.85rem;align-items:flex-start;
  }
  .foot-contact-list li .fc-ico{
    width:34px;height:34px;border-radius:10px;
    background:rgba(180,200,42,.08);
    border:1px solid rgba(180,200,42,.18);
    display:grid;place-items:center;flex-shrink:0;
    transition:all .25s ease;
  }
  .foot-contact-list li:hover .fc-ico{
    background:var(--lime-500);border-color:var(--lime-500);
  }
  .foot-contact-list li .fc-ico svg{
    width:14px;height:14px;color:var(--lime-400);transition:color .25s;
  }
  .foot-contact-list li:hover .fc-ico svg{color:var(--ink-900)}
  .foot-contact-list li a,
  .foot-contact-list li span{
    color:rgba(247,245,239,.85);font-size:.92rem;line-height:1.4;
    transition:color .25s;
  }
  .foot-contact-list li a:hover{color:var(--lime-400)}
  .foot-contact-list li small{
    display:block;font-family:var(--font-mono);font-size:.62rem;
    letter-spacing:.18em;text-transform:uppercase;
    color:rgba(247,245,239,.4);margin-bottom:.2rem;
  }

  /* Social icons row */
  .foot-social{
    margin-top:1.8rem;
    padding-top:1.5rem;
    border-top:1px solid rgba(255,255,255,.08);
    display:flex;gap:.6rem;
  }
  .foot-social a{
    width:42px;height:42px;border-radius:50%;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.1);
    display:grid;place-items:center;
    color:rgba(247,245,239,.7);
    transition:all .35s cubic-bezier(.2,.8,.2,1);
    position:relative;overflow:hidden;
  }
  .foot-social a::before{
    content:"";position:absolute;inset:0;border-radius:50%;
    background:var(--brand-color, var(--lime-500));
    transform:scale(0);transition:transform .4s cubic-bezier(.2,.8,.2,1);
    z-index:0;
  }
  .foot-social a:hover{
    transform:translateY(-3px);
    border-color:var(--brand-color, var(--lime-500));
    color:#fff;
    box-shadow:0 10px 24px -8px var(--brand-shadow, rgba(180,200,42,.4));
  }
  .foot-social a:hover::before{transform:scale(1)}
  .foot-social a svg{width:18px;height:18px;position:relative;z-index:1;transition:color .25s}
  .foot-social a:hover svg{color:#fff}

  .foot-social a.s-linkedin{--brand-color:#0A66C2;--brand-shadow:rgba(10,102,194,.45)}
  .foot-social a.s-google{--brand-color:#fff;--brand-shadow:rgba(255,255,255,.25)}
  .foot-social a.s-google:hover svg{color:var(--ink-900)}
  .foot-social a.s-whatsapp{--brand-color:#25D366;--brand-shadow:rgba(37,211,102,.45)}
  .foot-social a.s-mail{--brand-color:var(--lime-500);--brand-shadow:rgba(180,200,42,.45)}
  .foot-social a.s-mail:hover svg{color:var(--ink-900)}

  .foot-social .s-label{
    margin-right:.8rem;font-family:var(--font-mono);font-size:.7rem;
    letter-spacing:.18em;color:rgba(247,245,239,.4);text-transform:uppercase;
    align-self:center;display:flex;align-items:center;
  }
  @media (max-width:600px){.foot-social{flex-wrap:wrap}.foot-social .s-label{width:100%;margin-bottom:.5rem}}

  .foot-bottom{
    padding-top:2rem;border-top:1px solid rgba(255,255,255,.08);
    display:flex;justify-content:space-between;align-items:center;
    font-size:.82rem;color:rgba(247,245,239,.4);flex-wrap:wrap;gap:1rem;
  }
  .foot-bottom .foot-legal{display:flex;gap:1.5rem}
  .foot-bottom .foot-legal a{color:rgba(247,245,239,.4);transition:color .2s}
  .foot-bottom .foot-legal a:hover{color:var(--lime-400)}

  /* ============ GALLERY — PREMIUM CAROUSEL ============ */
  .gallery{background:var(--paper);overflow:hidden}

  .carousel{
    position:relative;
  }

  /* Track (scrollable, snap) */
  .carousel-viewport{
    overflow:hidden;
    margin:0 -2rem;
    padding:1rem 2rem 2rem;
  }
  @media (max-width:720px){.carousel-viewport{margin:0 -1.25rem;padding:1rem 1.25rem 2rem}}

  .carousel-track{
    display:flex;
    gap:1.5rem;
    transition:transform .85s cubic-bezier(.2,.85,.2,1);
    will-change:transform;
  }

  .cslide{
    flex:0 0 calc((100% - 3rem) / 3);
    position:relative;border-radius:var(--radius-lg);overflow:hidden;
    aspect-ratio:4/5;background:var(--paper-2);
    cursor:grab;
    box-shadow:0 12px 30px -16px rgba(10,58,69,.2);
    transition:transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .6s ease;
  }
  .cslide:active{cursor:grabbing}
  @media (max-width:1024px){.cslide{flex:0 0 calc((100% - 1.5rem) / 2)}}
  @media (max-width:600px){.cslide{flex:0 0 100%;aspect-ratio:5/6}}

  .cslide img{
    width:100%;height:100%;object-fit:cover;
    transition:transform 1s cubic-bezier(.2,.8,.2,1), filter .6s ease;
    filter:saturate(.92) brightness(.97);
  }

  /* Active center slide is bigger */
  .cslide.active{
    transform:scale(1.04);
    box-shadow:0 30px 70px -24px rgba(10,58,69,.4);
    z-index:2;
  }
  .cslide.active img{filter:saturate(1.05) brightness(1)}

  .cslide::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,transparent 35%,rgba(10,20,24,.92) 100%);
    transition:opacity .5s ease;opacity:.92;
  }
  .cslide.active::after{
    background:linear-gradient(180deg,transparent 30%,rgba(10,58,69,.95) 100%);
  }

  /* Number stamp */
  .cslide .cnum{
    position:absolute;top:1.5rem;left:1.5rem;z-index:3;
    font-family:var(--font-mono);font-size:.7rem;letter-spacing:.18em;
    color:rgba(255,255,255,.7);text-transform:uppercase;
    padding:.45rem .85rem;background:rgba(0,0,0,.35);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border-radius:999px;border:1px solid rgba(255,255,255,.18);
    transition:all .4s ease;
  }
  .cslide.active .cnum{
    background:var(--lime-500);color:var(--ink-900);
    border-color:var(--lime-500);font-weight:600;
  }

  /* Featured marker for active */
  .cslide .cmark{
    position:absolute;top:1.5rem;right:1.5rem;z-index:3;
    width:44px;height:44px;border-radius:50%;
    background:rgba(255,255,255,.1);backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.2);
    display:grid;place-items:center;opacity:0;transform:scale(.5);
    transition:all .5s cubic-bezier(.2,1.5,.2,1);
  }
  .cslide.active .cmark{
    opacity:1;transform:scale(1);background:var(--lime-500);border-color:var(--lime-500);
  }
  .cslide .cmark svg{width:18px;height:18px;color:var(--ink-900)}

  /* Caption */
  .cslide .ccaption{
    position:absolute;bottom:1.8rem;left:1.8rem;right:1.8rem;z-index:3;
    color:#fff;
  }
  @media (max-width:600px){.cslide .ccaption{bottom:1.4rem;left:1.4rem;right:1.4rem}}

  .cslide .ctag{
    display:inline-flex;align-items:center;gap:.4rem;
    font-family:var(--font-mono);font-size:.65rem;letter-spacing:.16em;
    color:var(--lime-400);text-transform:uppercase;margin-bottom:.7rem;
    opacity:.85;
  }
  .cslide.active .ctag{opacity:1}
  .cslide .ctag::before{
    content:"";width:18px;height:1px;background:var(--lime-400);
  }

  .cslide h4{
    font-family:var(--font-display);font-size:1.35rem;font-weight:500;
    letter-spacing:-.01em;line-height:1.15;color:#fff;
    transform:translateY(0);transition:transform .5s ease;
  }
  .cslide.active h4{font-size:1.55rem}
  @media (max-width:600px){
    .cslide h4{font-size:1.15rem}
    .cslide.active h4{font-size:1.25rem}
  }

  .cslide .cdesc{
    font-size:.88rem;color:rgba(255,255,255,.75);line-height:1.5;
    margin-top:.6rem;max-height:0;overflow:hidden;opacity:0;
    transition:max-height .5s ease, opacity .4s ease .1s, margin-top .5s ease;
  }
  .cslide.active .cdesc{
    max-height:80px;opacity:1;margin-top:.7rem;
  }

  /* ===== Controls : prev / next / progress ===== */
  .carousel-controls{
    margin-top:2.5rem;
    display:grid;grid-template-columns:auto 1fr auto;gap:2.5rem;align-items:center;
  }
  @media (max-width:720px){.carousel-controls{grid-template-columns:1fr;gap:1.5rem;text-align:center}}

  .carousel-counter{
    font-family:var(--font-display);font-size:1.5rem;font-weight:400;
    color:var(--ink-900);letter-spacing:-.01em;
    display:flex;align-items:baseline;gap:.5rem;
  }
  .carousel-counter .current{
    color:var(--teal-500);font-style:italic;font-size:2.5rem;font-weight:500;
    min-width:2ch;display:inline-block;
  }
  .carousel-counter .divider{color:var(--ink-300);font-size:1.2rem}
  .carousel-counter .total{color:var(--ink-500);font-size:1.2rem}

  .carousel-progress{
    position:relative;height:2px;background:rgba(12,20,24,.08);
    border-radius:999px;overflow:hidden;
  }
  .carousel-progress-bar{
    position:absolute;top:0;left:0;height:100%;background:var(--lime-500);
    width:0;transition:width .8s cubic-bezier(.2,.85,.2,1);
    border-radius:999px;
  }
  .carousel-progress-bar::after{
    content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);
    width:10px;height:10px;border-radius:50%;background:var(--lime-500);
    box-shadow:0 0 0 4px rgba(180,200,42,.25);
  }

  .carousel-nav{display:flex;gap:.7rem;justify-content:center}
  .carousel-btn{
    width:54px;height:54px;border-radius:50%;border:1.5px solid rgba(12,20,24,.15);
    background:#fff;display:grid;place-items:center;cursor:pointer;
    transition:all .35s cubic-bezier(.2,.8,.2,1);color:var(--ink-900);
  }
  .carousel-btn:hover:not(:disabled){
    background:var(--ink-900);color:#fff;border-color:var(--ink-900);
    transform:translateY(-2px);
    box-shadow:0 12px 24px -12px rgba(10,58,69,.4);
  }
  .carousel-btn:disabled{opacity:.35;cursor:not-allowed}
  .carousel-btn svg{width:18px;height:18px;transition:transform .3s}
  .carousel-btn.prev:hover:not(:disabled) svg{transform:translateX(-3px)}
  .carousel-btn.next:hover:not(:disabled) svg{transform:translateX(3px)}

  /* Dot indicators (mobile-friendly) */
  .carousel-dots{
    display:flex;gap:.4rem;justify-content:center;margin-top:1.5rem;
  }
  .carousel-dot{
    width:24px;height:3px;border-radius:999px;background:rgba(12,20,24,.15);
    border:none;cursor:pointer;transition:all .3s ease;padding:0;
  }
  .carousel-dot.active{background:var(--teal-500);width:36px}
  .carousel-dot:hover:not(.active){background:rgba(12,20,24,.3)}

  /* ============ CONTACT FORM ============ */
  .contact-block{
    background:var(--paper-2);position:relative;overflow:hidden;
  }
  .contact-block::before{
    content:"";position:absolute;top:-100px;right:-100px;
    width:400px;height:400px;border-radius:50%;
    background:radial-gradient(circle,rgba(180,200,42,.18) 0%,transparent 70%);
    pointer-events:none;
  }
  .contact-block::after{
    content:"";position:absolute;bottom:-150px;left:-150px;
    width:500px;height:500px;border-radius:50%;
    background:radial-gradient(circle,rgba(21,120,140,.15) 0%,transparent 70%);
    pointer-events:none;
  }

  .contact-wrap{
    display:grid;grid-template-columns:.85fr 1.15fr;gap:0;
    background:#fff;border-radius:var(--radius-lg);overflow:hidden;
    box-shadow:0 40px 100px -40px rgba(10,58,69,.25);
    position:relative;z-index:1;
  }
  @media (max-width:900px){.contact-wrap{grid-template-columns:1fr}}

  .contact-info{
    background:linear-gradient(165deg,var(--ink-900) 0%,var(--teal-900) 100%);
    color:var(--paper);padding:3.5rem;position:relative;overflow:hidden;
  }
  .contact-info::before{
    content:"";position:absolute;top:-50%;right:-30%;width:80%;height:160%;
    background:radial-gradient(circle, rgba(180,200,42,.15) 0%, transparent 60%);
    pointer-events:none;
  }
  .contact-info .role-tag{
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;
    color:var(--lime-400);text-transform:uppercase;margin-bottom:1rem;
  }
  .contact-info h3{
    font-family:var(--font-display);font-size:2.4rem;font-weight:400;
    letter-spacing:-.02em;line-height:1.05;position:relative;z-index:1;
  }
  .contact-info h3 em{color:var(--lime-400);font-style:italic}
  .contact-info > p{
    margin-top:1.2rem;color:rgba(247,245,239,.7);
    font-size:1rem;line-height:1.6;position:relative;z-index:1;max-width:380px;
  }

  .ci-items{margin-top:3rem;display:flex;flex-direction:column;gap:1.5rem;position:relative;z-index:1}
  .ci-item{
    display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:flex-start;
    padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.08);
  }
  .ci-item:last-child{border-bottom:none}
  .ci-item .ci-icon{
    width:42px;height:42px;border-radius:12px;
    background:rgba(180,200,42,.12);
    display:grid;place-items:center;
    border:1px solid rgba(180,200,42,.25);
  }
  .ci-item .ci-icon svg{width:18px;height:18px;color:var(--lime-400)}
  .ci-item .ci-content b{
    display:block;font-family:var(--font-mono);font-size:.7rem;
    letter-spacing:.18em;color:var(--lime-400);text-transform:uppercase;margin-bottom:.3rem;
  }
  .ci-item .ci-content a, .ci-item .ci-content span{
    font-family:var(--font-display);font-size:1.05rem;color:#fff;
    transition:color .2s;
  }
  .ci-item .ci-content a:hover{color:var(--lime-400)}

  .ci-availability{
    margin-top:2.5rem;display:inline-flex;align-items:center;gap:.6rem;
    padding:.6rem 1rem;background:rgba(180,200,42,.12);
    border:1px solid rgba(180,200,42,.25);border-radius:999px;
    font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;
    color:var(--lime-400);position:relative;z-index:1;
  }
  .ci-availability .pulse{
    width:7px;height:7px;border-radius:50%;background:var(--lime-500);
    animation:pulse 2s infinite;
  }

  /* Form side */
  .contact-form{padding:3.5rem}
  @media (max-width:600px){.contact-form{padding:2.2rem}}

  .contact-form h4{
    font-family:var(--font-display);font-size:1.9rem;font-weight:500;
    letter-spacing:-.015em;color:var(--ink-900);margin-bottom:.5rem;
  }
  .contact-form > p{font-size:.95rem;color:var(--ink-500);margin-bottom:2.2rem}

  .form-row{
    display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-bottom:1.2rem;
  }
  @media (max-width:600px){.form-row{grid-template-columns:1fr}}

  .field{position:relative;display:flex;flex-direction:column;margin-bottom:1.2rem}
  .field-row{margin-bottom:0}
  .field label{
    font-family:var(--font-mono);font-size:.68rem;
    letter-spacing:.18em;text-transform:uppercase;
    color:var(--ink-500);margin-bottom:.55rem;font-weight:500;
  }
  .field label .req{color:var(--teal-500);margin-left:.2rem}

  .field input,
  .field select,
  .field textarea{
    width:100%;padding:.9rem 0;border:none;
    border-bottom:1.5px solid rgba(12,20,24,.15);
    background:transparent;font-family:var(--font-body);font-size:1rem;
    color:var(--ink-900);transition:border-color .25s ease;
    border-radius:0;
  }
  .field input:focus,
  .field select:focus,
  .field textarea:focus{
    outline:none;border-bottom-color:var(--teal-500);
  }
  .field textarea{resize:vertical;min-height:90px;padding-top:.9rem;line-height:1.55}
  .field select{
    appearance:none;-webkit-appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%2315788C' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right .5rem center;
    cursor:pointer;padding-right:2rem;
  }
  .field input::placeholder,
  .field textarea::placeholder{color:var(--ink-300)}

  /* Service tags / multi-select chips */
  .chips-group{
    display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.3rem;
  }
  .chip{
    padding:.55rem 1rem;border-radius:999px;
    border:1px solid rgba(12,20,24,.15);background:#fff;
    font-size:.82rem;color:var(--ink-700);cursor:pointer;
    transition:all .25s ease;font-weight:500;
    user-select:none;
  }
  .chip:hover{border-color:var(--teal-500);color:var(--teal-500)}
  .chip.active{
    background:var(--ink-900);color:#fff;border-color:var(--ink-900);
  }
  .chip.active::before{
    content:"✓ ";color:var(--lime-400);font-weight:700;
  }

  .form-consent{
    display:flex;gap:.7rem;align-items:flex-start;
    margin-top:.5rem;margin-bottom:1.8rem;
    font-size:.82rem;color:var(--ink-500);line-height:1.5;
  }
  .form-consent input{
    appearance:none;-webkit-appearance:none;
    width:18px;height:18px;border:1.5px solid rgba(12,20,24,.25);
    border-radius:4px;cursor:pointer;flex-shrink:0;margin-top:1px;
    position:relative;transition:all .2s;background:#fff;
  }
  .form-consent input:checked{
    background:var(--teal-500);border-color:var(--teal-500);
  }
  .form-consent input:checked::after{
    content:"";position:absolute;top:2px;left:6px;width:4px;height:9px;
    border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);
  }
  .form-consent label{cursor:pointer}
  .form-consent a{color:var(--teal-500);text-decoration:underline;text-underline-offset:2px}

  .form-submit{
    width:100%;background:var(--ink-900);color:var(--paper);
    padding:1.1rem 1.6rem;border:none;border-radius:999px;
    font-family:var(--font-body);font-weight:500;font-size:1rem;cursor:pointer;
    display:inline-flex;align-items:center;justify-content:center;gap:.8rem;
    transition:all .3s cubic-bezier(.2,.8,.2,1);
  }
  .form-submit:hover{
    background:var(--teal-700);transform:translateY(-2px);
    box-shadow:0 12px 30px -10px rgba(14,90,107,.5);
  }
  .form-submit svg{width:16px;height:16px;transition:transform .3s}
  .form-submit:hover svg{transform:translateX(3px)}

  .form-success{
    display:none;text-align:center;padding:2rem 0;
  }
  .form-success.show{display:block}
  .form-success.show ~ form{display:none}
  .form-success .check-big{
    width:64px;height:64px;border-radius:50%;background:var(--lime-500);
    margin:0 auto 1.5rem;display:grid;place-items:center;
    animation:pop .5s cubic-bezier(.2,1.5,.2,1);
  }
  @keyframes pop{
    from{transform:scale(0)}
    to{transform:scale(1)}
  }
  .form-success .check-big svg{width:32px;height:32px;color:var(--teal-900)}
  .form-success h4{font-family:var(--font-display);font-size:1.6rem;color:var(--ink-900);margin-bottom:.6rem}
  .form-success p{color:var(--ink-500);font-size:.95rem}

  /* Subtle entrance */
  .fade-up{opacity:0;transform:translateY(20px);transition:all .8s cubic-bezier(.2,.8,.2,1)}
  .fade-up.in{opacity:1;transform:none}

  /* Grain texture overlay */
  body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:100;
    opacity:.035;mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' /%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' /%3E%3C/svg%3E");
  }