/* ═══ RESET ═══ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

/* ═══ DESIGN TOKENS ═══ */
:root{
  --bg:#0f1a12;--bg2:#112211;
  --g:#00e676;--g-dim:rgba(0,230,118,.1);
  --display:'Barlow Condensed','Noto Sans TC',sans-serif;
  --body:'Plus Jakarta Sans','Noto Sans TC',sans-serif;
  /* z-index scale */
  --z-texture:0;
  --z-content:1;
  --z-sticky:10;
  --z-nav:100;
  --z-menu:200;
  --z-modal-backdrop:300;
  --z-modal:400;
  --z-toast:500;
  --z-btt:999;
  --z-tooltip:1000;
}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--body);background:#0f1a12;color:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}

/* ═══ BODY TEXTURE + GRADIENT ═══ */
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:var(--z-texture);background-image:radial-gradient(circle,rgba(0,230,118,.018) 1px,transparent 1px);background-size:36px 36px}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:var(--z-texture);background:radial-gradient(ellipse 70% 50% at 15% 10%,rgba(0,230,118,.07),transparent 50%),radial-gradient(ellipse 60% 40% at 85% 90%,rgba(0,230,118,.05),transparent 45%)}

/* ═══ NAV ═══ */
nav{position:fixed;top:0;left:0;right:0;z-index:var(--z-nav);padding:24px 0;transition:all .4s;background:transparent}
nav.on{background:rgba(0,230,118,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:14px 0}
nav.on .n-links a{color:rgba(0,0,0,.55)}
nav.on .n-links a:hover{color:#000}
nav.on .n-logo{color:#000}
nav.on .n-logo img{opacity:1}
nav.on .n-cta{background:#00a84d;color:#fff!important}
nav.on .ham span{background:#000}
.n-in{max-width:1280px;margin:0 auto;padding:0 80px;display:flex;align-items:center;justify-content:space-between}
.n-logo{display:flex;align-items:center;text-decoration:none}
.n-logo img{height:44px;opacity:0;transition:opacity .4s}
.n-links{display:flex;gap:48px;list-style:none;align-items:center}
.n-links a{color:rgba(255,255,255,.55);text-decoration:none;font-size:14px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;transition:color .25s;position:relative}
.n-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:1.5px;background:var(--g);transition:width .3s cubic-bezier(.32,.72,0,1)}
.n-links a:hover::after,.n-links a.on::after{width:100%}
.n-links a.on{color:var(--g)}
.n-cta{background:var(--g);color:#000!important;padding:10px 24px;border-radius:100px;font-weight:600!important;letter-spacing:.5px!important}
.n-cta:hover{box-shadow:0 0 24px rgba(0,230,118,.3)}
.ham{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;width:44px;height:44px;align-items:center;justify-content:center}
.ham span{width:22px;height:2px;background:#fff;transition:all .3s}
.ham.go span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.ham.go span:nth-child(2){opacity:0}
.ham.go span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ═══ REVEAL ANIMATION ═══ */
.rv{opacity:0;transform:translateY(20px);filter:blur(2px);transition:opacity .7s cubic-bezier(.32,.72,0,1),transform .7s cubic-bezier(.32,.72,0,1),filter .7s cubic-bezier(.32,.72,0,1)}
.rv.in{opacity:1;transform:translateY(0);filter:blur(0)}

/* ═══ BUTTONS ═══ */
.btn{display:inline-flex;align-items:center;gap:10px;padding:18px 40px;font-size:14px;font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:2px;transition:all .3s;font-family:var(--display)}
.btn-fill{background:var(--g);color:#000;border:2px solid var(--g)}
.btn-fill:hover{background:#00ff88;transform:translate(4px,-4px);box-shadow:-8px 8px 0 rgba(0,230,118,.15)}
.btn-line{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.1)}
.btn-line:hover{border-color:var(--g);transform:translate(4px,-4px)}
.btn-f{background:var(--g);color:#000;padding:14px 32px;border-radius:100px;font-size:14px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex;align-items:center;gap:10px;border:none;cursor:pointer}
.btn-f:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(0,230,118,.25)}
.btn-o{background:transparent;padding:14px 32px;border-radius:100px;font-size:14px;font-weight:500;text-decoration:none;transition:all .3s;display:inline-flex;align-items:center;gap:8px;border:1px solid}
.btn-s{width:100%;padding:18px;border-radius:100px;background:var(--g);color:#000;font-size:15px;font-weight:600;border:none;cursor:pointer;transition:all .3s;margin-top:4px}
.btn-s:hover{box-shadow:0 8px 30px rgba(0,230,118,.25)}

/* ═══ HERO ═══ */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:0 80px;position:relative;overflow:hidden}
.hero-watermark{position:absolute;right:80px;top:50%;transform:translateY(-60%);font-family:var(--display);font-size:clamp(160px,20vw,320px);font-weight:900;color:rgba(0,230,118,.025);pointer-events:none;user-select:none;line-height:1}
.hero-waves{position:absolute;right:0;top:0;width:70%;height:100%;pointer-events:none;z-index:1;opacity:.9}
.hero-eyebrow{font-size:14px;font-weight:700;letter-spacing:10px;color:var(--g);text-transform:uppercase;margin-bottom:40px;animation:eyeIn .8s .2s cubic-bezier(.32,.72,0,1) both;text-shadow:0 0 24px rgba(0,230,118,.2)}
@keyframes eyeIn{from{opacity:0;letter-spacing:24px}to{opacity:1;letter-spacing:10px}}
.hero-title{font-family:var(--display);font-weight:900;line-height:.8;letter-spacing:-1px;margin-bottom:32px;text-wrap:balance}
.hero-title .clip{display:block;overflow:hidden}
.hero-title .word{display:block;font-size:clamp(72px,13vw,190px);transform:translateY(110%);animation:wordUp .9s cubic-bezier(.32,.72,0,1) forwards}
.hero-title .clip:nth-child(2) .word{animation-delay:.12s}
.hero-title .word.white{color:#fff}
.hero-title .word.green{color:var(--g);animation:wordUp .9s cubic-bezier(.32,.72,0,1) forwards}
@keyframes wordUp{to{transform:translateY(0)}}
.hero-sub{font-size:clamp(18px,2.5vw,30px);font-weight:400;color:rgba(255,255,255,.65);letter-spacing:6px;margin-bottom:48px;animation:fadeIn .8s .5s cubic-bezier(.32,.72,0,1) both;text-shadow:0 2px 12px rgba(0,0,0,.3)}
@keyframes fadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.hero-actions{display:flex;gap:20px;animation:fadeIn .8s .6s cubic-bezier(.32,.72,0,1) both}
.hero-stats{display:flex;gap:64px;margin-top:100px;animation:fadeIn .8s .7s cubic-bezier(.32,.72,0,1) both;position:relative;z-index:2}
.hero-stat .n{font-family:var(--display);font-size:48px;font-weight:900;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.7);line-height:1;display:block;font-variant-numeric:tabular-nums}
.hero-stat .l{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:rgba(255,255,255,.2);margin-top:8px;font-family:var(--display)}

/* ═══ PAGE HERO (sub-pages) ═══ */
.page-hero{padding:200px 80px 80px;background:var(--bg);z-index:1;text-align:center}
.page-hero .ph-tag{font-size:13px;font-weight:700;letter-spacing:6px;color:var(--g);font-family:var(--display);text-transform:uppercase;margin-bottom:28px}
.page-hero .ph-title{font-family:var(--display);font-weight:900;font-size:clamp(48px,7vw,96px);line-height:.92;letter-spacing:-2.5px;max-width:900px;margin:0 auto;text-wrap:balance}
.page-hero .ph-title .hl{color:var(--g)}
.page-hero .ph-sub{font-size:17px;color:rgba(255,255,255,.6);max-width:480px;line-height:1.8;margin-top:28px;margin-left:auto;margin-right:auto}

/* ═══ SECTIONS ═══ */
section{padding:160px 80px;position:relative;z-index:1}
section.sec-dark{border-top:none}
section.sec-dark::before{content:'';position:absolute;top:-2px;left:0;right:0;height:4px;background:linear-gradient(90deg,transparent 10%,rgba(0,230,118,.12) 30%,rgba(0,230,118,.18) 50%,rgba(0,230,118,.12) 70%,transparent 90%)}
section.light{background:#eef3ee;border-top:none}
section.light::before{content:'';position:absolute;top:-2px;left:0;right:0;height:4px;background:linear-gradient(90deg,transparent 10%,rgba(0,230,118,.15) 30%,rgba(0,230,118,.2) 50%,rgba(0,230,118,.15) 70%,transparent 90%)}
section.light .sec-sub{color:rgba(0,0,0,.7)}
section.light .card{background:#f4f8f4;border:1px solid rgba(0,0,0,.1);border-radius:4px}
section.light .card:hover{border-color:rgba(0,230,118,.25);box-shadow:inset 0 0 0 1px rgba(0,230,118,.04),0 20px 50px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.03)}
section.light .card h3{color:#222}
section.light .card p{color:rgba(0,0,0,.7)}
section.light .card-icon{color:var(--g)}
section.light .btn-o{color:#111;border-color:rgba(0,0,0,.08)}
section.light .btn-o:hover{border-color:var(--g)}
.sec-label{font-family:var(--display);font-size:13px;font-weight:700;letter-spacing:6px;color:var(--g);text-transform:uppercase;margin-bottom:20px;text-shadow:0 0 20px rgba(0,230,118,.15)}
.sec-title{font-family:var(--display);font-weight:900;font-size:clamp(44px,6vw,72px);line-height:.95;letter-spacing:-1px;margin-bottom:24px;text-wrap:balance}
.sec-title .hl{color:var(--g);text-shadow:0 0 30px rgba(0,230,118,.12)}
.sec-sub{font-size:15px;line-height:2;color:rgba(255,255,255,.6);max-width:65ch;margin-bottom:72px;text-wrap:pretty}
section.light .sec-sub{color:rgba(0,0,0,.7)}
section.light .sec-label{color:rgba(0,0,0,.35);text-shadow:none}
section.light .sec-title{color:#222}
section.light .sec-title .hl{color:var(--g);text-shadow:none}
.sec-w{max-width:1120px;margin:0 auto}

/* ═══ SECTION DECORATION ═══ */
.sec-accent{display:flex;align-items:center;gap:16px;margin-bottom:48px}
.sec-accent .sa-line{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--g),transparent)}
.sec-accent .sa-dot{width:4px;height:4px;border-radius:50%;background:var(--g);flex-shrink:0}

/* ═══ CARDS ═══ */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{position:relative;padding:56px 40px;background:var(--bg2);border:1px solid rgba(255,255,255,.08);text-decoration:none;color:inherit;display:block;transition:all .4s;overflow:hidden;border-radius:4px}
.card::before{content:'';position:absolute;bottom:0;left:0;right:0;height:0;background:var(--g);transition:height .4s;z-index:var(--z-texture)}
.card:hover::before{height:3px}
.card::after{content:'';position:absolute;inset:0;background:radial-gradient(circle 250px at var(--mx,50%) var(--my,50%),rgba(0,230,118,.06),transparent 70%);opacity:0;transition:opacity .4s;pointer-events:none;z-index:0}
.card:hover::after{opacity:1}
.card:hover{transform:translateY(-8px);border-color:rgba(0,230,118,.12);box-shadow:inset 0 0 0 1px rgba(0,230,118,.06),0 30px 80px rgba(0,0,0,.6),0 8px 24px rgba(0,0,0,.4)}
.card-inner{position:relative;z-index:1;transition:transform .4s}
.card:hover .card-inner{transform:translateY(-4px)}
.card-icon{font-family:var(--display);font-size:56px;font-weight:900;color:var(--g);line-height:1;margin-bottom:20px;transition:all .4s;text-shadow:0 0 24px rgba(0,230,118,.1)}
.card:hover .card-icon{transform:scale(1.05);text-shadow:0 0 40px rgba(0,230,118,.25)}
.card h3{font-family:var(--display);font-size:24px;font-weight:700;letter-spacing:1px;margin-bottom:12px;text-transform:uppercase}
.card p{font-size:14px;line-height:2;color:rgba(255,255,255,.7);text-wrap:pretty}
.card-link{display:inline-flex;align-items:center;gap:8px;margin-top:24px;font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:2px;color:var(--g);text-transform:uppercase;transition:gap .3s}
.card:hover .card-link{gap:16px}

/* ═══ SUB-CARDS (section grid cards) ═══ */
.sub-card{padding:48px 36px;text-align:center;transition:all .35s;border:1px solid rgba(255,255,255,.12);text-decoration:none;color:inherit;display:block}
.sub-card:hover{border-color:rgba(0,230,118,.2)}
section.light .sub-card{background:#f4f8f4;border:1px solid rgba(0,0,0,.1)}
section.light .sub-card:hover{border-color:rgba(0,230,118,.2)}
.sub-card h4{font-size:18px;font-weight:600;margin-bottom:8px}
section.light .sub-card h4{color:#222}
.sub-card p,.sub-card .dim{font-size:15px;line-height:1.8;color:rgba(255,255,255,.75);text-wrap:pretty}
section.light .sub-card p,section.light .sub-card .dim{color:rgba(0,0,0,.65)}
.sub-card .sc-num{font-family:var(--display);font-size:48px;font-weight:700;color:rgba(0,230,118,.1);line-height:1;margin-bottom:16px}
.sub-card .sc-icon{font-family:var(--display);font-size:36px;font-weight:700;color:var(--g);margin-bottom:12px}
.sub-card-sm{padding:40px 32px}

/* ═══ SUB-CARD GRIDS ═══ */
.sub-grid{display:grid;gap:1px}
.sub-grid-3{grid-template-columns:repeat(3,1fr)}
.sub-grid-4{grid-template-columns:repeat(4,1fr)}
.sub-grid-2{grid-template-columns:1fr 1fr}

/* ═══ QUOTE ═══ */
.quote{text-align:center;padding:160px 80px;position:relative;overflow:hidden}
.quote::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,230,118,.04),rgba(0,230,118,.01) 50%,rgba(0,230,118,.04));z-index:0}
.quote .rv{position:relative;z-index:1}
.quote-mark{font-family:var(--display);font-size:200px;font-weight:900;color:rgba(0,230,118,.04);line-height:1;margin-bottom:-80px;user-select:none}
.quote-text{font-family:var(--display);font-size:clamp(28px,4vw,52px);font-weight:500;line-height:1.3;max-width:700px;margin:0 auto;letter-spacing:.5px}
.quote-text .hl{color:var(--g);font-weight:700}
.quote-line{width:60px;height:2px;background:var(--g);margin:32px auto 16px}
.quote-author{font-size:13px;letter-spacing:4px;color:rgba(255,255,255,.75);text-transform:uppercase;font-family:var(--display)}

/* ═══ BANNER ═══ */
.banner{position:relative;text-align:center;padding:120px 80px;color:#fff;overflow:hidden}
.banner::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#00a84d 0%,rgba(0,230,118,.5) 50%,#006b2e 100%);z-index:0}
.banner::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 30% 20%,rgba(255,255,255,.08),transparent 60%),radial-gradient(ellipse 40% 30% at 80% 80%,rgba(0,0,0,.1),transparent 50%);z-index:1;pointer-events:none}
.banner .rv{position:relative;z-index:2}
.banner h2{font-family:var(--display);font-weight:900;font-size:clamp(36px,5vw,64px);line-height:.95;margin-bottom:16px;text-shadow:0 2px 20px rgba(0,0,0,.15)}
.banner p{font-size:16px;opacity:.9;max-width:420px;margin:0 auto 40px;line-height:2}
.banner a{display:inline-flex;align-items:center;gap:10px;padding:18px 40px;background:rgba(0,0,0,.15);color:#fff;font-family:var(--display);font-size:14px;font-weight:700;text-decoration:none;text-transform:uppercase;letter-spacing:2px;transition:all .3s;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.banner a:hover{background:rgba(0,0,0,.25);transform:translate(4px,-4px);box-shadow:0 8px 30px rgba(0,0,0,.2)}

/* ═══ FORMS ═══ */
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.f-grp{margin-bottom:28px}
.f-grp label{display:block;font-size:10px;font-weight:600;margin-bottom:10px;text-transform:uppercase;letter-spacing:2px;color:rgba(255,255,255,.45)}
.f-grp input,.f-grp select,.f-grp textarea{width:100%;padding:15px 18px;border-radius:10px;font-size:14px;font-family:var(--body);transition:all .3s;outline:none;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);color:#FFF}
.f-grp input:focus,.f-grp select:focus,.f-grp textarea:focus{border-color:var(--g);background:rgba(0,230,118,.03);box-shadow:0 0 0 3px rgba(0,230,118,.08)}
.f-grp select{cursor:pointer}
.f-grp select option{background:#1E1E1E;color:#FFF}
section.light .f-grp label{color:rgba(0,0,0,.55)}
section.light .f-grp input,section.light .f-grp select,section.light .f-grp textarea{background:rgba(0,0,0,.01);border-color:rgba(0,0,0,.12);color:#000}
section.light .f-grp input:focus,section.light .f-grp select:focus,section.light .f-grp textarea:focus{border-color:var(--g)}
section.light .f-grp select option{background:#F0F0F0;color:#111}

/* ═══ FOOTER (simple) ═══ */
footer{padding:80px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.06);font-family:var(--display);position:relative}
footer::before{content:'';position:absolute;top:-2px;left:10%;right:10%;height:2px;background:linear-gradient(90deg,transparent,rgba(0,230,118,.15),transparent)}
footer p{font-size:12px;color:var(--g);letter-spacing:2px;text-transform:uppercase}
footer a{color:var(--g);text-decoration:none;font-size:12px;letter-spacing:2px;transition:color .3s}
footer a:hover{color:var(--g)}

/* ═══ FOOTER (rich, for sub-pages) ═══ */
.ft-in{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:64px}
.ft-br .ft-lg{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.ft-br .ft-lg img{height:32px}
.ft-br p{color:rgba(255,255,255,.5);font-size:13px;line-height:2;letter-spacing:0;text-transform:none}
.ft-social{margin-top:24px;display:flex;gap:16px}
.ft-social a{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.5);text-decoration:none;font-size:12px;font-weight:600;transition:all .25s;text-transform:uppercase;letter-spacing:.5px}
.ft-social a:hover{border-color:var(--g);color:var(--g);background:rgba(0,230,118,.06)}
.ft-col h4{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:2px;color:rgba(255,255,255,.95);margin-bottom:24px}
.ft-col ul{list-style:none}
.ft-col ul li{margin-bottom:14px}
.ft-col ul li a{color:rgba(255,255,255,.95);text-decoration:none;font-size:13px;transition:color .2s}
.ft-col ul li a:hover{color:var(--g)}
.ft-bot{max-width:1120px;margin:64px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center;color:rgba(255,255,255,.5);font-size:12px}

/* ═══ BACK TO TOP ═══ */
.btt{position:fixed;bottom:36px;right:36px;z-index:var(--z-btt);width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg);border:2px solid var(--g);color:var(--g);text-decoration:none;font-family:var(--display);font-size:20px;font-weight:900;transition:all .3s;opacity:0;pointer-events:none}
.btt.show{opacity:1;pointer-events:auto}
.btt:hover{background:var(--g);color:#000;transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,230,118,.2)}

/* ═══ FAQ (shared) ═══ */
.faq-item{border-bottom:1px solid rgba(255,255,255,.06);padding:32px 0;cursor:pointer}
section.light .faq-item{border-color:rgba(0,0,0,.1)}
.faq-q{font-family:var(--display);font-size:20px;font-weight:600;display:flex;justify-content:space-between;align-items:center;color:#000}
.faq-a{font-size:15px;line-height:2;max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.32,.72,0,1),padding .4s ease,opacity .4s ease;padding-top:0;opacity:0}
.faq-item.open .faq-a{max-height:400px;padding-top:16px;opacity:1}
section.light .faq-a{color:rgba(0,0,0,.35)}
.faq-toggle{transition:transform .4s cubic-bezier(.32,.72,0,1);display:inline-block}
.faq-item.open .faq-toggle{transform:rotate(45deg)}

/* ═══ IMAGE LOADING SHIMMER ═══ */
.img-shimmer{position:relative;overflow:hidden;background:rgba(0,230,118,.03)}
.img-shimmer::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(0,230,118,.04),transparent);animation:shimmer 1.8s infinite}
@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

/* ═══ SECTION DIVIDER ═══ */
.section-divider{width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,230,118,.08),transparent)}

/* ═══ PAGE-SPECIFIC HELPERS ═══ */
.dim{color:rgba(255,255,255,.6);text-shadow:0 1px 8px rgba(0,0,0,.15)}
section.light .dim{color:rgba(0,0,0,.65);text-shadow:0 1px 8px rgba(255,255,255,.15)}

/* ═══ REDUCED MOTION ═══ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none;filter:none;transition:none}
  .rv.in{opacity:1;transform:none;filter:none}
  .hero-title .word{transform:none;animation:none}
  .hero-eyebrow,.hero-sub,.hero-actions,.hero-stats{animation:none}
  .card:hover{transform:none}
  .card:hover .card-inner{transform:none}
  .card::after{display:none}
  .btt:hover{transform:none}
  .btn-fill:hover{transform:none;box-shadow:none}
  .btn-line:hover{transform:none}
  .btn-f:hover{transform:none}
  .banner a:hover{transform:none}
  .faq-a{transition:none}
  .wordUp{transform:none;animation:none}
  nav,nav.on{transition:none}
  .n-links.show{animation:none}
  .ham span,.ham.go span{transition:none}
}

/* ═══ MEDIA QUERIES ═══ */
@media(max-width:1024px){
  section{padding:120px 40px}
  .hero{padding:0 40px}
  .cards{grid-template-columns:1fr 1fr}
  .hero-watermark{display:none}
  .page-hero{padding:160px 40px 60px}
  .sub-grid-4{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .n-in{padding:0 40px}
  .n-logo{margin-left:-20px}
  .n-logo img{height:36px}
  .n-links{display:none}
  .n-links.show{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(13,26,13,.97);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:32px;gap:20px;border-bottom:1px solid rgba(0,230,118,.08);animation:navSlide .35s cubic-bezier(.32,.72,0,1)}
@keyframes navSlide{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
.n-links.show a{font-size:16px;padding:12px 0;display:block}
  .ham{display:flex}
  section{padding:80px 24px}
  .hero{padding:0 24px}
  .hero-title .word{font-size:48px}
  .hero-stats{gap:32px;flex-wrap:wrap;margin-top:60px}
  .cards{grid-template-columns:1fr}
  .sub-grid-2,.sub-grid-3,.sub-grid-4{grid-template-columns:1fr}
  .quote{padding:100px 24px}
  .banner{padding:80px 24px}
  .f-row{grid-template-columns:1fr}
  .page-hero{padding:140px 24px 60px}
  .btt{bottom:24px;right:24px}
  .ft-in{grid-template-columns:1fr 1fr;gap:40px}
  .ft-br{grid-column:1/-1}
  footer:not(.ft-in){flex-direction:column;gap:24px;text-align:center;padding:60px 24px}
  .hero-actions{flex-wrap:wrap}
  .ft-social a{width:44px;height:44px;font-size:14px}
  .ft-bot{flex-direction:column;gap:8px;text-align:center}
}
