:root{
    --bg:#FAF3E2;
    --bg-nav:#1B2A4A;
    --card:#FFFDF6;
    --ink:#2A2317;
    --muted:#7A6F52;
    --line:#E9DAB0;

    --navy:#1B2A4A;
    --navy-deep:#12203A;
    --x-red:#C8102E;

    --teal:#0E9C8E;
    --teal-deep:#0B7A70;
    --teal-light:#5FE0D0;

    --purple:#6A63D6;
    --purple-deep:#4E46B8;
    --blue:#0090FF;
    --blue-deep:#0072CC;
    --green:#1FB894;
    --green-deep:#0F9276;
    --magenta:#A424DA;
    --magenta-deep:#8317B3;
    --orange:#F7A518;
    --orange-deep:#DB8A0A;
    --burgundy:#7B1E26;
    --burgundy-deep:#59151B;
    --gold:#C9A227;
    --gold-light:#E8C766;
    --yellow:#FFD23F;
    --yellow-deep:#F2A81C;
    --rose:#F43F7E;
    --rose-deep:#CE1E5E;
    --cyan:#12AEDA;
    --cyan-deep:#0C86A8;
    --coral:#FF5A5F;
    --coral-deep:#E23B45;

    --white:#FFFFFF;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter', sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4{ font-family:'Plus Jakarta Sans', sans-serif; font-weight:800; color:var(--ink); letter-spacing:-0.02em; line-height:1.12;}
  a{color:inherit; text-decoration:none;}
  .wrap{max-width:1200px; margin:0 auto; padding:0 36px;}
  section{position:relative;}
  ::selection{background:var(--teal); color:var(--white);}

  .pill{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'Plus Jakarta Sans', sans-serif; font-weight:700; font-size:0.72rem; letter-spacing:0.05em; text-transform:uppercase;
    background:rgba(14,156,142,0.12); color:var(--teal-deep); padding:8px 16px; border-radius:100px; margin-bottom:1.2rem;
  }
  .pill .dot{width:6px; height:6px; border-radius:50%; background:var(--teal);}

  /* ---------- NAV ---------- */
  header{ position:fixed; top:0; left:0; right:0; z-index:200; background:rgba(27,42,74,0.96); backdrop-filter:blur(10px); border-top:2px solid var(--x-red); border-bottom:2px solid var(--x-red); box-shadow: inset 0 2px 0 0 var(--white), inset 0 -2px 0 0 var(--white); }
  nav{ max-width:1200px; margin:0 auto; padding:16px 36px; display:flex; align-items:center; justify-content:space-between;}
  .logo{ font-family:'Plus Jakarta Sans', sans-serif; font-weight:800; font-size:1.3rem; color:#FFFFFF; display:flex; align-items:center; gap:8px;}
  .logo .dot{width:9px; height:9px; border-radius:50%; background:var(--teal-light);}
  .logo .x{color:var(--x-red);}
  .navlinks{display:flex; gap:1.9rem; font-size:0.87rem; font-weight:600; color:#D9DEE8;}
  .navlinks a{position:relative; padding:4px 0; transition:color .2s;}
  .navlinks a:hover{color:var(--teal-light);}
  .nav-cta{ font-size:0.82rem; font-weight:700; color:var(--white); background:var(--teal); padding:11px 22px; border-radius:100px; transition:background .2s, transform .2s; box-shadow:0 6px 16px rgba(14,156,142,0.3);}
  .nav-cta:hover{background:var(--teal-deep); transform:translateY(-1px);}
  @media (max-width:860px){ .navlinks{display:none;} }

  /* ---------- HERO ---------- */
  .hero{ padding:150px 0 90px; }
  .hero-grid{ display:grid; grid-template-columns:1fr 0.85fr; gap:50px; align-items:center;}
  .hero h1{ font-size:clamp(2.4rem, 4.2vw, 3.5rem); margin-bottom:22px;}
  .hero h1 .accent{ color:var(--teal-deep);}
  .hero p.lede{ font-size:1.05rem; line-height:1.75; color:var(--muted); max-width:520px; margin-bottom:36px;}
  .hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
  .btn-primary{ background:var(--teal); color:var(--white); padding:15px 28px; border-radius:100px; font-weight:700; font-size:0.9rem; transition:background .2s, transform .2s; display:inline-block; box-shadow:0 10px 24px rgba(14,156,142,0.32);}
  .btn-primary:hover{background:var(--teal-deep); transform:translateY(-2px);}
  .btn-ghost{ border:1.5px solid var(--ink); color:var(--ink); padding:13.5px 28px; border-radius:100px; font-weight:700; font-size:0.9rem; transition:all .2s; display:inline-block;}
  .btn-ghost:hover{background:var(--ink); color:var(--bg);}

  /* trust card (signature) — click / tap to flip front & back
     matches card_files: NO float, flip-only. 3 layers keep transforms clean:
     .tcard-wrap = sizing · .tcard = perspective · .tcard-inner = flip */
  .tcard-wrap{ width:400px; max-width:100%; margin:0 auto; }
  .tcard{ position:relative; width:100%; aspect-ratio:1.585/1; cursor:pointer; perspective:1200px; }
  .tcard-inner{ position:absolute; inset:0; transform-style:preserve-3d; transition:transform .5s; }
  .tcard.flipped .tcard-inner{ transform:rotateY(180deg); }
  .tcard:focus-visible{ outline:none; }
  .tcard:focus-visible .tcard-face{ box-shadow:0 0 0 3px var(--teal-light), 0 30px 60px -12px rgba(14,156,142,0.45); }
  @keyframes floatCard{ 0%,100%{transform:translateY(0) rotate(-0.4deg);} 50%{transform:translateY(-10px) rotate(0.4deg);} }

  .tcard-face{
    position:absolute; inset:0; border-radius:16px; padding:20px; overflow:hidden;
    color:var(--white); display:flex; flex-direction:column; justify-content:space-between;
    backface-visibility:hidden; -webkit-backface-visibility:hidden;
    box-shadow:0 20px 45px -12px rgba(14,156,142,0.45), 0 8px 20px rgba(0,0,0,0.10);
  }
  .tcard-front{ background:linear-gradient(155deg, var(--teal) 0%, var(--teal-light) 100%); }
  .tcard-back{ background:linear-gradient(155deg, var(--teal-deep) 0%, var(--teal) 100%); transform:rotateY(180deg); }

  .tcard-top{display:flex; justify-content:space-between; align-items:flex-start;}
  .tcard-brand{font-family:'Plus Jakarta Sans', sans-serif; font-weight:800; font-size:1.2rem;}
  .tcard-brand .x{color:#FFD9DC;}
  .tcard-badge{ background:rgba(255,255,255,0.24); padding:6px 14px; border-radius:100px; font-size:0.74rem; font-weight:700; display:flex; align-items:center; gap:6px; white-space:nowrap;}
  .tcard-name{font-family:'Plus Jakarta Sans', sans-serif; font-size:1.5rem; font-weight:700; margin-bottom:12px;}
  .tcard-score-row{display:flex; justify-content:space-between; font-size:0.8rem; margin-bottom:8px; opacity:0.95;}
  .tcard-bar{height:8px; border-radius:100px; background:rgba(255,255,255,0.28); overflow:hidden;}
  .tcard-bar-fill{height:100%; width:78%; background:var(--white); border-radius:100px;}
  .tcard-bottom{display:flex; justify-content:space-between; font-size:0.78rem; opacity:0.92;}
  .tflip-hint{display:inline-flex; align-items:center; gap:5px;}

  /* back face */
  .tcard-back-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px 18px; font-size:0.78rem; }
  .tcard-back-grid span{ display:flex; align-items:center; gap:6px; opacity:0.95; }
  .tcard-back-grid b{ margin-left:auto; font-weight:800; }
  .tcard-back-foot{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
  .tcard-seal-title{ font-weight:800; font-size:0.82rem; display:flex; align-items:center; gap:5px; }
  .tcard-seal-sub{ font-size:0.68rem; opacity:0.85; margin-top:3px; }
  .tcard-qr{ width:54px; height:54px; border-radius:9px; background:var(--white); padding:5px; flex-shrink:0; }
  .tcard-qr svg{ width:100%; height:100%; display:block; }

  .tier-dots{display:flex; justify-content:center; gap:10px; margin-top:22px;}
  .tier-dots span{width:10px; height:10px; border-radius:50%; display:inline-block;}

  /* ---------- STATS ---------- */
  .stats{ background:linear-gradient(155deg, #8A2530 0%, var(--burgundy-deep) 100%); color:var(--gold-light); padding:38px 0;}
  .stats .wrap{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px;}
  .stat{flex:1; min-width:140px;}
  .stat .num{ font-family:'Plus Jakarta Sans', sans-serif; font-size:2rem; font-weight:800; color:var(--gold-light);}
  .stat .label{ font-size:0.7rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold); margin-top:6px; font-weight:600;}

  /* ---------- MANIFESTO ---------- */
  .manifesto{padding:120px 0; background:var(--bg);}
  .manifesto-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:start;}
  .manifesto h2{font-size:clamp(1.9rem,3vw,2.5rem);}
  .manifesto-body p{font-size:1.03rem; line-height:1.82; color:var(--muted); margin-bottom:20px;}
  .manifesto-body strong{color:var(--ink); font-weight:700;}
  @media (max-width:800px){ .manifesto-grid{grid-template-columns:1fr;} }

  /* ---------- VISION ---------- */
  .vision{padding:120px 0; background:var(--bg);}
  .vision-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center;}
  .vision h2{font-size:clamp(1.9rem,3vw,2.5rem); margin-bottom:22px;}
  .vision h2 .accent{color:var(--teal-deep);}
  .vision-body p{font-size:1.02rem; line-height:1.8; color:var(--muted); margin-bottom:18px;}
  .vision-body p:last-child{margin-bottom:0;}
  .vision-body strong{color:var(--ink); font-weight:700;}
  .vision-art{ position:relative; border-radius:24px; padding:20px 20px 16px; background:linear-gradient(155deg, var(--navy) 0%, var(--navy-deep) 100%); box-shadow:0 30px 60px -22px rgba(18,32,58,0.55); overflow:hidden;}
  .vision-art svg{ width:100%; height:auto; display:block; animation:floatCard 6s ease-in-out infinite;}
  .vision-art .va-cap{ text-align:center; margin-top:8px; font-family:'Plus Jakarta Sans', sans-serif; font-size:0.72rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--gold-light);}
  @media (max-width:820px){ .vision-grid{grid-template-columns:1fr;} .vision-art{order:-1; max-width:460px; margin:0 auto;} }
  .page-top{ padding-top:150px; }
  .vision-lead{ max-width:760px; margin-bottom:48px;}
  .vision-lead h1{ font-size:clamp(2.2rem,4vw,3.1rem); margin-bottom:18px;}
  .vision-lead h1 .accent{ color:var(--teal-deep);}
  .vision-lead p{ font-size:1.08rem; line-height:1.75; color:var(--muted);}

  /* ---------- CATEGORY GRID (tier-card echo) ---------- */
  .categories{padding:40px 0 120px; background:var(--bg);}
  .cat-head{max-width:680px; margin-bottom:50px;}
  .cat-head h2{font-size:clamp(1.9rem,3vw,2.5rem); margin-bottom:14px;}
  .cat-head p{color:var(--muted); font-size:1.02rem; line-height:1.7;}
  .cat-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;}
  .cat-card{ background:var(--card); border-radius:20px; overflow:hidden; box-shadow:0 10px 30px -14px rgba(42,35,23,0.18); transition:transform .25s ease, box-shadow .25s ease;}
  .cat-card:hover{transform:translateY(-6px); box-shadow:0 22px 40px -16px rgba(42,35,23,0.26);}
  .cat-head-block{ padding:26px 24px 40px; color:var(--white); position:relative;}
  .cat-head-block .cat-icon{ font-size:1.7rem; margin-bottom:34px; display:block;}
  .cat-head-block h3{color:var(--white); font-size:1.15rem;}
  .cat-body{padding:20px 24px 26px;}
  .cat-body p{font-size:0.92rem; color:var(--muted); line-height:1.68; margin-bottom:16px;}
  .cat-tag{ display:inline-block; font-size:0.7rem; font-weight:700; padding:6px 12px; border-radius:100px; background:var(--bg); color:var(--ink);}
  @media (max-width:900px){ .cat-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:560px){ .cat-grid{grid-template-columns:1fr;} }

  .bg-green{background:linear-gradient(155deg, var(--green) 0%, var(--green-deep) 100%);}
  .bg-blue{background:linear-gradient(155deg, var(--blue) 0%, var(--blue-deep) 100%);}
  .bg-magenta{background:linear-gradient(155deg, var(--magenta) 0%, var(--magenta-deep) 100%);}
  .bg-orange{background:linear-gradient(155deg, var(--orange) 0%, var(--orange-deep) 100%);}
  .bg-purple{background:linear-gradient(155deg, var(--purple) 0%, var(--purple-deep) 100%);}
  .bg-burgundy{background:linear-gradient(155deg, #93262F 0%, var(--burgundy-deep) 100%);}
  .bg-yellow{background:linear-gradient(155deg, var(--yellow) 0%, var(--yellow-deep) 100%);}
  .cat-head-block.bg-yellow, .cat-head-block.bg-yellow h3{color:var(--ink);}
  .bg-rose{background:linear-gradient(155deg, var(--rose) 0%, var(--rose-deep) 100%);}
  .bg-cyan{background:linear-gradient(155deg, var(--cyan) 0%, var(--cyan-deep) 100%);}
  .bg-coral{background:linear-gradient(155deg, var(--coral) 0%, var(--coral-deep) 100%);}
  .bg-silver{background:linear-gradient(155deg, #F8FAFF 0%, #DCE3EE 45%, #C3CCDA 100%);}
  .cat-head-block.bg-silver, .cat-head-block.bg-silver h3{color:var(--ink);}
  .bg-mono{background:linear-gradient(155deg, #3A3A3A 0%, #0B0B0B 100%);}
  .cat-head-block.bg-mono, .cat-head-block.bg-mono h3{color:var(--white);}
  .tag-green{color:var(--green-deep);} .tag-blue{color:var(--blue-deep);} .tag-magenta{color:var(--magenta-deep);}
  .tag-orange{color:var(--orange-deep);} .tag-purple{color:var(--purple-deep);} .tag-burgundy{color:var(--burgundy-deep);}
  .tag-yellow{color:#9C6A08;} .tag-rose{color:var(--rose-deep);} .tag-cyan{color:var(--cyan-deep);} .tag-coral{color:var(--coral-deep);} .tag-silver{color:#3D4658;} .tag-mono{color:#1A1A1A;}

  /* ---------- FLAGSHIP INNOVATIONS ---------- */
  .flagship{padding:120px 0; background:var(--navy); color:var(--gold-light);}
  .flagship-head{max-width:700px; margin-bottom:50px;}
  .flagship .pill{background:rgba(201,162,39,0.14); color:var(--gold-light);}
  .flagship .pill .dot{background:var(--gold-light);}
  .flagship h2{color:var(--gold-light); font-size:clamp(1.9rem,3vw,2.5rem); margin-bottom:14px;}
  .flagship-head p{color:var(--gold); font-size:1.02rem; line-height:1.75;}
  .innov-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
  .innov-card{ background:rgba(201,162,39,0.07); border-radius:16px; padding:26px 24px; border-top:4px solid var(--teal);}
  .innov-card h4{color:var(--gold-light); font-size:1.02rem; margin-bottom:10px; font-weight:700; line-height:1.4;}
  .innov-card p{color:#D6BE7D; font-size:0.85rem; line-height:1.62; margin-bottom:14px;}
  .innov-card .ic-tag{font-size:0.68rem; font-weight:700; padding:5px 11px; border-radius:100px; display:inline-block; color:var(--ink);}
  @media (max-width:900px){ .innov-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:560px){ .innov-grid{grid-template-columns:1fr;} }

  /* ---------- FOUNDER ---------- */
  .founder{padding:120px 0; background:var(--bg);}
  .founder-inner{display:grid; grid-template-columns:0.55fr 1.45fr; gap:56px; align-items:center; background:var(--card); border-radius:24px; padding:52px; box-shadow:0 20px 50px -20px rgba(42,35,23,0.22);}
  .founder-avatar{ width:100%; aspect-ratio:1/1; border-radius:20px; background:linear-gradient(155deg, #93262F 0%, var(--burgundy-deep) 100%); display:flex; align-items:center; justify-content:center;}
  .founder-avatar span{font-family:'Plus Jakarta Sans', sans-serif; font-size:2.6rem; font-weight:800; color:var(--white);}
  .founder-avatar img{width:100%; height:100%; object-fit:cover; border-radius:20px; display:block;}
  .founder h3{font-size:1.5rem; margin-bottom:6px;}
  .founder .role{color:var(--burgundy); font-size:0.78rem; letter-spacing:0.06em; text-transform:uppercase; font-weight:700; margin-bottom:20px; display:block;}
  .founder p{color:var(--muted); font-size:1rem; line-height:1.8; margin-bottom:14px;}
  @media (max-width:760px){ .founder-inner{grid-template-columns:1fr; padding:34px;} .founder-avatar{max-width:160px; margin:0 auto;} }

  /* ---------- CONTACT ---------- */
  .contact{padding:120px 0 70px; background:var(--bg); text-align:center;}
  .contact h2{font-size:clamp(2rem,3.6vw,2.8rem); max-width:720px; margin:0 auto 20px;}
  .contact p{color:var(--muted); max-width:520px; margin:0 auto 36px; font-size:1.02rem; line-height:1.7;}
  .contact-ctas{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}

  footer{ border-top:2px solid var(--x-red); border-bottom:2px solid var(--x-red); box-shadow: inset 0 2px 0 0 var(--white), inset 0 -2px 0 0 var(--white); padding:34px 0; background:var(--navy);}
  footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
  footer .flogo{font-family:'Plus Jakarta Sans', sans-serif; font-weight:800; font-size:1.05rem; display:flex; align-items:center; gap:8px; color:#FFFFFF;}
  footer .flogo .dot{width:8px; height:8px; border-radius:50%; background:var(--teal-light);}
  footer .flogo .x{color:var(--x-red);}
  footer .fmeta{font-size:0.78rem; color:#AEB6C6;}

  .reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
  .reveal.in{opacity:1; transform:translateY(0);}