html,body{margin:0!important;padding:0!important;}
*{margin:0;padding:0;box-sizing:border-box;}

:root{
  --navy:#0E6B54;
  --navy-deep:#084A3B;
  --paper:#FBFAF6;
  --card:#FFFFFF;
  --gold:#F3B400;
  --gold-deep:#C98A00;
  --gold-soft:#FFE08A;
  --plum:#1E2235;
  --mint:#14B8A6;
  --blue:#6B7280;
  --purple:#4B5563;
  --pink:#0D9488;
  --ink:#123A2E;
  --ink-dim:#5B6E68;
  --line:#E7E4DB;
  --radius-lg:24px;
  --content-max:88rem;
  --side-gutter:42px;
}
body{background:var(--paper); color:var(--ink); font-family:'Inter',sans-serif; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
h1,h2,h3,h4{font-family:'Inter',sans-serif; font-weight:400; letter-spacing:-0.03em; color:var(--ink);}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block; width:100%; height:100%; object-fit:cover;}
.wrap{max-width:var(--content-max); margin:0 auto; padding:0 var(--side-gutter);}
@media(max-width:640px){.wrap{padding:0 22px;} :root{--side-gutter:22px;}}
.fw{width:100vw; position:relative; left:50%; margin-left:-50vw!important; z-index:0;}

.pill-btn{display:inline-flex!important; align-items:center!important; gap:12px!important; background:var(--navy); color:#fff!important; font-size:1rem; font-weight:500; padding-left:28px!important; padding-right:8px!important; padding-top:8px!important; padding-bottom:8px!important; border-radius:100px!important; transition:background .3s cubic-bezier(.4,0,.2,1), transform .3s cubic-bezier(.4,0,.2,1), box-shadow .3s ease; line-height:1.2!important;}
.pill-btn:hover{background:var(--navy-deep); transform:translateY(-2px); box-shadow:0 12px 28px -10px rgba(0,0,0,.45);}
.pill-btn .arrow-c{background:#fff; border-radius:100px; padding:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:transform .3s cubic-bezier(.4,0,.2,1);}
.pill-btn:hover .arrow-c{transform:rotate(45deg);}
.pill-btn .arrow-c i{color:var(--navy); font-size:1.05rem;}

.section-tag{display:inline-flex; align-items:center; gap:8px; font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-deep); margin-bottom:14px;}
.section-tag::before{content:''; width:16px; height:1px; background:var(--gold-deep); display:inline-block;}

/* ===== MINIMAL HEADER ===== */
.top-strip{position:absolute; top:0; left:0; right:0; z-index:20; padding:22px 42px;}
@media(max-width:640px){.top-strip{padding:18px 22px;}}
.top-strip-inner{max-width:var(--content-max); margin:0 auto; display:flex; align-items:center; justify-content:flex-end; gap:16px;}

/* ===== HERO ===== */
@keyframes fade-up{from{opacity:0; transform:translateY(24px);} to{opacity:1; transform:translateY(0);}}
.animate-fade-up{animation:fade-up .8s cubic-bezier(0.16,1,0.3,1) forwards;}

.hero-sec{position:relative; width:100vw; max-width:100vw; left:50%; margin-left:-50vw; min-height:100vh; min-height:100svh; overflow:hidden; color:#fff; background:#0b1512; display:flex; flex-direction:column; justify-content:flex-end;}
.hero-bg{position:absolute; inset:0; z-index:0;}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:center; animation:none; transform:none;}
.hero-bg::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,10,9,.25) 0%, rgba(5,10,9,.15) 35%, rgba(5,10,9,.55) 70%, rgba(5,10,9,.8) 100%);}
@keyframes hero-zoom{from{transform:scale(1);} to{transform:scale(1.14);}}
@media(prefers-reduced-motion:reduce){.hero-bg img{animation:none;}}

.hero-inner{position:relative; z-index:1; width:100%; padding:140px clamp(20px, 2.2vw, 44px) 0;}
.hero-title{font-family:'Inter',sans-serif; font-weight:400; color:#fff; font-size:clamp(2.6rem, 6.4vw, 8.4rem); line-height:.98; letter-spacing:-0.045em; margin:0 0 clamp(36px, 4vw, 60px); opacity:0; text-shadow:0 10px 40px rgba(0,0,0,.25);}
.hero-title span{display:block;}

.hero-bottom{display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(255,255,255,.22); opacity:0;}
.hero-bottom-left{display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:36px 32px 44px 0; border-right:1px solid rgba(255,255,255,.22);}
.hero-bottom-right{display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:36px 0 44px 36px;}

.hero-card{display:flex; gap:20px; align-items:stretch; padding:14px; max-width:560px; border-radius:20px; background:rgba(8,14,12,.55); border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:0 30px 60px -30px rgba(0,0,0,.6);}
.hero-card-thumb{width:160px; flex-shrink:0; border-radius:14px; overflow:hidden; background:rgba(255,255,255,.08);}
.hero-card-thumb img{width:100%; height:100%; object-fit:cover;}
.hero-card-body{display:flex; flex-direction:column; justify-content:space-between; gap:20px; padding:4px 6px 2px 0;}
.hero-card-body p{font-size:clamp(1.05rem, 1.4vw, 1.4rem); line-height:1.35; font-weight:400; letter-spacing:-0.01em; color:#fff; margin:0;}
.hero-card-btn{align-self:flex-start; display:inline-flex; align-items:center; gap:12px; padding:6px 6px 6px 20px; border-radius:100px; background:#fff; color:#171a2e!important; font-weight:500; font-size:1rem; transition:transform .25s ease;}
.hero-card-btn span{width:34px; height:34px; border-radius:50%; background:#171a2e; color:#fff; display:grid; place-items:center; font-size:.9rem; transition:transform .3s ease, background .3s ease;}
.hero-card-btn:hover{transform:translateY(-2px);}
.hero-card-btn:hover span{transform:rotate(45deg); background:var(--gold); color:#171a2e;}

.hero-rating{display:flex; align-items:center; gap:8px; white-space:nowrap; font-size:.95rem; color:#fff; padding-top:4px;}
.hero-rating .g-badge{width:22px; height:22px; border-radius:50%; background:#4285F4; color:#fff; font-weight:800; font-size:.7rem; display:inline-flex; align-items:center; justify-content:center;}
.hero-rating b{font-weight:600;}
.hero-rating .stars{display:flex; gap:1px; color:var(--gold); font-size:.85rem;}
.hero-rating .reviews{color:rgba(255,255,255,.8);}

.hero-bottom-right p{font-size:clamp(1.05rem, 1.5vw, 1.5rem); line-height:1.35; font-weight:400; letter-spacing:-0.01em; color:#fff; margin:0; max-width:560px;}
.hero-scroll{width:44px; height:44px; flex-shrink:0; border-radius:50%; display:grid; place-items:center; color:#fff!important; font-size:1.2rem; border:1px solid rgba(255,255,255,.3); transition:background .3s ease, color .3s ease; animation:hero-bob 2.4s ease-in-out infinite;}
.hero-scroll:hover{background:#fff; color:#171a2e!important;}
@keyframes hero-bob{0%,100%{transform:translateY(0);} 50%{transform:translateY(6px);}}

@media (prefers-reduced-motion: reduce){ .hero-bg img, .hero-scroll{animation:none;} }

@media(max-width:1100px){
  .hero-bottom-left{flex-direction:column;}
}
@media(max-width:900px){
  .hero-bottom{grid-template-columns:1fr;}
  .hero-bottom-left{border-right:0; padding:28px 0 24px; border-bottom:1px solid rgba(255,255,255,.22);}
  .hero-bottom-right{padding:24px 0 36px;}
  .hero-title span{display:inline;}
}
@media(max-width:560px){
  .hero-inner{padding-top:110px;}
  .hero-card{flex-direction:column;}
  .hero-card-thumb{width:100%; height:150px;}
}

/* ===== ABOUT US ===== */
.about-sec{background:var(--card); padding:110px 0;}
.about-wrap{padding:0 clamp(20px, 2.2vw, 44px);}
.about-statement{font-family:'Inter',sans-serif; font-weight:400; color:#171a2e; font-size:clamp(1.7rem, 3.1vw, 3.4rem); line-height:1.2; letter-spacing:-0.035em; max-width:1600px; margin:0 0 clamp(48px, 5vw, 80px);}
.about-statement span{color:#9A9A9A;}

.about-tag{display:inline-flex; align-items:center; gap:8px; background:var(--card); border:1px solid var(--line); color:var(--ink); font-size:.8rem; font-weight:700; padding:8px 18px 8px 14px; border-radius:100px; margin-bottom:22px;}
.about-tag i{color:var(--gold-deep);}
.about-row{display:grid; grid-template-columns:1fr 0.9fr 1.1fr; gap:clamp(28px, 4vw, 72px); align-items:start;}

.about-label{display:block; font-size:1.05rem; color:#171a2e; margin-bottom:40px;}
.about-stats{display:flex; gap:40px; margin-bottom:28px;}
.about-stat b{display:block; font-family:'Inter',sans-serif; font-size:clamp(2.2rem, 3.2vw, 3.2rem); font-weight:400; letter-spacing:-0.04em; line-height:1; color:#171a2e;}
.about-stat span{display:block; margin-top:10px; font-size:.86rem; font-weight:500; color:#6B6B6B; max-width:150px;}
.about-thumb{width:200px; height:128px; border-radius:14px; overflow:hidden;}
.about-thumb img{width:100%; height:100%; object-fit:cover;}

.about-col-text p{font-size:1.12rem; line-height:1.6; color:#171a2e; margin:0 0 22px; max-width:440px;}
.about-link{display:inline-flex; align-items:center; gap:8px; margin-top:8px; padding-bottom:3px; font-size:1.02rem; color:#171a2e!important; border-bottom:1px solid #171a2e; transition:color .25s ease, border-color .25s ease, gap .25s ease;}
.about-link i{font-size:.9rem; transition:transform .3s ease;}
.about-link:hover{color:var(--navy)!important; border-color:var(--navy); gap:12px;}
.about-link:hover i{transform:rotate(45deg);}

.about-col-media{position:relative; min-height:460px;}
.about-img-main{position:absolute; top:0; right:0; width:74%; height:84%; border-radius:18px; overflow:hidden;}
.about-img-sub{position:absolute; left:0; bottom:0; width:50%; height:48%; border-radius:18px; overflow:hidden; border:6px solid var(--card); z-index:2;}
.about-img-main img, .about-img-sub img{width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1);}
.about-img-main:hover img, .about-img-sub:hover img{transform:scale(1.05);}
.about-badge{position:absolute; left:42%; bottom:2%; width:110px; height:110px; z-index:3; background:var(--card); border-radius:50%;}
.about-badge svg{width:100%; height:100%; animation:aboutspin 14s linear infinite;}
@keyframes aboutspin{to{transform:rotate(360deg);}}
.about-badge-center{position:absolute; inset:0; display:grid; place-items:center;}
.about-badge-center span{width:48px; height:48px; border-radius:50%; background:var(--navy); display:grid; place-items:center;}
.about-badge-center i{color:#fff; font-size:1.15rem;}

@media(max-width:1100px){
  .about-row{grid-template-columns:1fr 1fr;}
  .about-col-media{grid-column:1 / -1; max-width:620px; width:100%; min-height:420px;}
}
@media(max-width:700px){
  .about-sec{padding:80px 0;}
  .about-row{grid-template-columns:1fr; gap:36px;}
  .about-label{margin-bottom:24px;}
  .about-col-media{min-height:340px;}
  .about-badge{width:90px; height:90px;}
  .about-badge-center span{width:40px; height:40px;}
}

/* ===== WHAT WE DO ===== */
.wwd-sec{position:relative; overflow:hidden; padding:110px 0;
  background:radial-gradient(40% 55% at 85% 50%, rgba(243,180,0,.10) 0%, rgba(243,180,0,0) 70%), radial-gradient(35% 45% at 5% 10%, rgba(14,107,84,.07) 0%, rgba(14,107,84,0) 70%), var(--paper);}
.wwd-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:64px; align-items:center;}
.wwd-tag{display:inline-flex; align-items:center; gap:8px; font-size:.74rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--navy); padding:7px 14px; border-radius:100px; background:rgba(14,107,84,.07); border:1px solid rgba(14,107,84,.14); margin-bottom:20px;}
.wwd-tag i{color:var(--gold-deep); font-size:.85rem;}
.wwd-text h2{font-size:clamp(2.1rem,3.8vw,3rem); font-weight:400; line-height:1.1; letter-spacing:-0.025em; margin-bottom:18px;}
.wwd-text p.lead{color:var(--ink-dim); font-size:1.02rem; line-height:1.7; font-weight:500; margin-bottom:30px; max-width:480px;}

.wwd-feat-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:28px; max-width:520px;}
.wwd-feat{display:flex; align-items:flex-start; gap:14px; padding:18px; border-radius:18px; background:var(--card); border:1px solid var(--line); transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease, border-color .35s ease;}
.wwd-feat:hover{transform:translateY(-3px); border-color:rgba(243,180,0,.6); box-shadow:0 20px 40px -24px rgba(14,107,84,.35);}
.wwd-feat-ico{width:44px; height:44px; border-radius:13px; background:var(--navy); display:grid; place-items:center; flex-shrink:0; transition:transform .4s cubic-bezier(.34,1.56,.64,1), background .35s ease;}
.wwd-feat:hover .wwd-feat-ico{transform:scale(1.08) rotate(-4deg); background:var(--gold);}
.wwd-feat-ico i{color:#fff; font-size:1.15rem; transition:color .35s ease;}
.wwd-feat:hover .wwd-feat-ico i{color:#171a2e;}
.wwd-feat h4{font-size:1rem; font-weight:500; color:var(--ink); margin-bottom:4px;}
.wwd-feat p{color:var(--ink-dim); font-size:.82rem; line-height:1.5; font-weight:500;}

.wwd-progress-row{margin-bottom:32px; max-width:520px; padding:16px 18px; border-radius:16px; background:var(--card); border:1px solid var(--line);}
.wwd-progress-label{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.wwd-progress-label b{font-size:.92rem; font-weight:600; color:var(--ink);}
.wwd-progress-label span{font-family:'Inter',sans-serif; font-size:1.2rem; font-weight:500; color:var(--navy);}
.wwd-progress-track{height:8px; background:rgba(14,107,84,.1); border-radius:100px; overflow:hidden;}
.wwd-progress-fill{height:100%; background:linear-gradient(90deg, var(--navy), #14B8A6 60%, var(--gold)); border-radius:100px; box-shadow:0 0 12px rgba(243,180,0,.45);}

/* Round image composition */
.wwd-media{position:relative; height:580px; max-width:580px; width:100%; margin-left:auto;}
.wwd-orbit{position:absolute; left:50%; top:50%; width:540px; height:540px; margin:-270px 0 0 -270px; border-radius:50%; border:1.5px dashed rgba(14,107,84,.28); animation:wwd-spin 40s linear infinite; pointer-events:none;}
.wwd-orbit i{position:absolute; top:-7px; left:50%; width:14px; height:14px; margin-left:-7px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 6px rgba(243,180,0,.2);}
.wwd-orbit-2{width:400px; height:400px; margin:-200px 0 0 -200px; border:1px solid rgba(243,180,0,.35); animation:none;}
@keyframes wwd-spin{to{transform:rotate(360deg);}}
@keyframes wwd-float{0%,100%{transform:translateY(0);} 50%{transform:translateY(-10px);}}

.wwd-circle{position:absolute; border-radius:50%; overflow:hidden; background:var(--card);}
.wwd-circle img{width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1);}
.wwd-circle:hover img{transform:scale(1.07);}
.wwd-circle-top{width:320px; height:320px; top:40px; left:calc(50% - 160px); z-index:1;
  box-shadow:0 0 0 8px var(--card), 0 0 0 10px rgba(243,180,0,.7), 0 40px 70px -30px rgba(8,74,59,.45);}
.wwd-circle-left, .wwd-circle-right{width:210px; height:210px; bottom:30px; z-index:2;
  box-shadow:0 0 0 6px var(--card), 0 0 0 8px rgba(14,107,84,.35), 0 30px 50px -24px rgba(0,0,0,.35);
  animation:wwd-float 6s ease-in-out infinite;}
.wwd-circle-left{left:4%;}
.wwd-circle-right{right:4%; animation-delay:-3s;}

.wwd-badge{position:absolute; z-index:3; display:flex; align-items:center; gap:10px; padding:10px 16px 10px 10px; border-radius:100px; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border:1px solid var(--line); box-shadow:0 20px 40px -20px rgba(0,0,0,.3); animation:wwd-float 7s ease-in-out infinite;}
.wwd-badge > span{width:36px; height:36px; border-radius:50%; display:grid; place-items:center; font-size:1.05rem; background:var(--navy); color:var(--gold); flex-shrink:0;}
.wwd-badge b{display:block; font-size:.88rem; font-weight:700; color:var(--ink); line-height:1.2;}
.wwd-badge small{display:block; font-size:.72rem; font-weight:500; color:var(--ink-dim);}
.wwd-badge-a{top:70px; left:0;}
.wwd-badge-b{top:250px; right:0; animation-delay:-3.5s;}
.wwd-badge-b > span{background:var(--gold); color:#171a2e;}

@media (prefers-reduced-motion: reduce){ .wwd-orbit, .wwd-circle-left, .wwd-circle-right, .wwd-badge{animation:none;} }

@media(max-width:1100px){
  .wwd-media{height:480px; max-width:480px;}
  .wwd-orbit{width:440px; height:440px; margin:-220px 0 0 -220px;}
  .wwd-orbit-2{width:330px; height:330px; margin:-165px 0 0 -165px;}
  .wwd-circle-top{width:260px; height:260px; left:calc(50% - 130px); top:30px;}
  .wwd-circle-left, .wwd-circle-right{width:170px; height:170px; bottom:24px;}
  .wwd-badge-a{top:40px;}
  .wwd-badge-b{top:200px;}
}
@media(max-width:900px){
  .wwd-sec{padding:80px 0;}
  .wwd-grid{grid-template-columns:1fr; gap:48px;}
  .wwd-media{height:480px; max-width:480px; margin:0 auto;}
  .wwd-orbit{width:440px; height:440px; margin:-220px 0 0 -220px;}
  .wwd-orbit-2{width:330px; height:330px; margin:-165px 0 0 -165px;}
  .wwd-circle-top{width:260px; height:260px; left:calc(50% - 130px); top:30px;}
  .wwd-circle-left, .wwd-circle-right{width:170px; height:170px; bottom:24px;}
  .wwd-badge-a{top:40px;}
  .wwd-badge-b{top:200px;}
}
@media(max-width:480px){
  .wwd-media{height:370px;}
  .wwd-orbit{width:330px; height:330px; margin:-165px 0 0 -165px;}
  .wwd-orbit-2{display:none;}
  .wwd-circle-top{width:200px; height:200px; left:calc(50% - 100px); top:20px;}
  .wwd-circle-left, .wwd-circle-right{width:130px; height:130px; bottom:16px;}
  .wwd-badge{padding:7px 12px 7px 7px;}
  .wwd-badge > span{width:30px; height:30px; font-size:.9rem;}
  .wwd-badge small{display:none;}
  .wwd-badge-a{top:14px;}
  .wwd-badge-b{top:150px;}
  .wwd-feat-row{grid-template-columns:1fr;}
}

/* ===== SERVICES ACCORDION ===== */
.svcacc-sec{position:relative; overflow:hidden; color:#fff; padding:110px 0;
  background:
    radial-gradient(50% 60% at 100% 0%, rgba(243,180,0,.14) 0%, rgba(243,180,0,0) 60%),
    radial-gradient(45% 55% at 0% 100%, rgba(20,184,166,.14) 0%, rgba(20,184,166,0) 60%),
    linear-gradient(160deg, #0B5A47 0%, var(--navy-deep) 45%, #05302A 100%);}
.svcacc-sec::before{content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:linear-gradient(180deg, #000 0%, transparent 70%); mask-image:linear-gradient(180deg, #000 0%, transparent 70%);}
.svcx-wrap{position:relative; z-index:1; padding:0 clamp(20px, 4vw, 64px);}
.svcacc-tag{display:inline-flex; align-items:center; background:var(--gold); color:var(--navy); font-size:.76rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:9px 20px; border-radius:100px; margin-bottom:22px;}

.svcx-head{display:grid; grid-template-columns:1.2fr 1fr; gap:64px; align-items:end; margin-bottom:36px;}
.svcx-head h2{color:#fff; font-size:clamp(2.2rem, 4.2vw, 4rem); font-weight:400; line-height:1.05; letter-spacing:-0.03em; margin:0;}
.svcx-head h2 em{font-style:normal; color:var(--gold-soft);}
.svcx-head-right p{color:rgba(255,255,255,.72); font-size:1.02rem; line-height:1.7; font-weight:500; margin:0 0 24px; max-width:520px;}

.svcx-chips{display:flex; flex-wrap:wrap; gap:10px; padding-bottom:36px; margin-bottom:36px; border-bottom:1px solid rgba(255,255,255,.12);}
.svcx-chips span{display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:100px; font-size:.86rem; font-weight:600; color:rgba(255,255,255,.88); background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);}
.svcx-chips i{color:var(--gold); font-size:.95rem;}

/* Expanding panels */
.svcx-panels{display:flex; gap:14px; height:440px;}
.svcacc-item{position:relative; flex:1 1 0; min-width:0; overflow:hidden; cursor:pointer; border-radius:24px; padding:26px;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1);
  transition:flex-grow .6s cubic-bezier(.16,1,.3,1), background .4s ease, border-color .4s ease, color .4s ease;}
/* Photo layer + tint */
.svcacc-item::before{content:""; position:absolute; inset:0; z-index:0; background:var(--img) center/cover no-repeat; filter:grayscale(.35); transform:scale(1.04); transition:transform 1s cubic-bezier(.16,1,.3,1), filter .6s ease;}
.svcacc-item::after{content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(180deg, rgba(6,55,44,.72) 0%, rgba(5,40,33,.88) 100%); transition:background .6s ease;}
.svcacc-item:hover::after{background:linear-gradient(180deg, rgba(6,55,44,.6) 0%, rgba(5,40,33,.85) 100%);}
.svcacc-item.active{flex-grow:3.4; border-color:rgba(243,180,0,.55); box-shadow:0 30px 60px -30px rgba(0,0,0,.6);}
.svcacc-item.active::before{filter:none; transform:scale(1);}
.svcacc-item.active::after{background:linear-gradient(180deg, rgba(8,20,18,.05) 0%, rgba(8,20,18,.25) 40%, rgba(8,20,18,.88) 100%);}
.svcx-num, .svcx-ico, .svcx-vtitle, .svcx-body{z-index:1;}
.svcx-num{position:absolute; top:24px; right:26px; font-family:'Inter',sans-serif; font-size:1rem; font-weight:500; color:rgba(255,255,255,.55); transition:color .4s ease, font-size .4s ease;}
.svcacc-item.active .svcx-num{color:#fff; font-size:1.4rem; text-shadow:0 2px 12px rgba(0,0,0,.4);}
.svcx-ico{position:relative; width:52px; height:52px; border-radius:16px; display:grid; place-items:center; font-size:1.6rem; color:var(--gold); background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); backdrop-filter:blur(6px); transition:all .4s ease;}
.svcacc-item.active .svcx-ico{background:var(--gold); color:#171a2e; border-color:var(--gold);}
.svcx-vtitle{position:absolute; left:26px; bottom:26px; margin:0; writing-mode:vertical-rl; transform:rotate(180deg); white-space:nowrap;
  font-family:'Inter',sans-serif; font-size:1.4rem; font-weight:500; color:#fff; letter-spacing:-0.01em; transition:opacity .3s ease;}
.svcacc-item.active .svcx-vtitle{opacity:0;}
.svcx-body{position:absolute; left:30px; right:30px; bottom:30px; max-width:520px; opacity:0; transform:translateY(16px); pointer-events:none; transition:opacity .3s ease, transform .3s ease;}
.svcacc-item.active .svcx-body{opacity:1; transform:none; pointer-events:auto; transition:opacity .5s ease .25s, transform .5s cubic-bezier(.16,1,.3,1) .25s;}
.svcx-body h4{font-family:'Inter',sans-serif; font-size:clamp(1.8rem, 2.6vw, 2.5rem); font-weight:500; line-height:1.1; letter-spacing:-0.02em; color:#fff; margin:0 0 12px;}
.svcx-body p{font-size:.98rem; line-height:1.65; font-weight:500; color:rgba(255,255,255,.85); margin:0 0 20px;}
.svcx-link{display:inline-flex; align-items:center; gap:10px; padding:10px 12px 10px 20px; border-radius:100px; background:var(--gold); color:#171a2e!important; font-size:.88rem; font-weight:600; transition:transform .25s ease;}
.svcx-link i{width:26px; height:26px; border-radius:50%; background:#171a2e; color:#fff; display:grid; place-items:center; font-size:.85rem; transition:transform .3s ease;}
.svcx-link:hover{transform:translateY(-2px);}
.svcx-link:hover i{transform:rotate(45deg);}

@media(max-width:1024px){
  .svcx-head{grid-template-columns:1fr; gap:24px;}
}
@media(max-width:900px){
  .svcacc-sec{padding:80px 0;}
  /* Panels become a vertical accordion */
  .svcx-panels{flex-direction:column; height:auto; gap:10px;}
  .svcacc-item{flex:none; padding:18px 20px; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:0 16px;}
  .svcx-ico{width:44px; height:44px; font-size:1.35rem; border-radius:12px;}
  .svcx-vtitle{position:relative; left:auto; bottom:auto; writing-mode:horizontal-tb; transform:none; font-size:1.15rem; white-space:normal; padding-right:32px;}
  .svcx-num{top:50%; transform:translateY(-50%); right:20px;}
  .svcacc-item.active .svcx-vtitle{opacity:1;}
  .svcacc-item.active::after{background:linear-gradient(180deg, rgba(8,20,18,.55) 0%, rgba(8,20,18,.85) 100%);}
  .svcx-body{position:relative; left:auto; right:auto; bottom:auto; grid-column:1 / -1; max-width:none; display:none; transform:none; margin-top:14px;}
  .svcacc-item.active .svcx-body{display:block;}
  .svcx-body h4{display:none;}
}

/* ===== LOAN CALCULATOR ===== */
.loancalc-sec{background:var(--paper);}
.loancalc-outer{max-width:var(--content-max); margin:0 auto;}
.loancalc-content{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; padding:100px var(--side-gutter);}
.loancalc-tag{display:inline-flex; align-items:center; gap:8px; background:var(--card); border:1px solid var(--line); color:var(--ink); font-size:.78rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:8px 18px 8px 14px; border-radius:100px; margin-bottom:24px;}
.loancalc-tag i{color:var(--gold-deep);}
.loancalc-text h2{font-size:clamp(2rem,3.4vw,2.6rem); line-height:1.2; margin-bottom:18px;}
.loancalc-text p.lead{color:var(--ink-dim); font-size:1rem; line-height:1.7; font-weight:500; margin-bottom:30px; max-width:520px;}
.loancalc-checklist{display:grid; grid-template-columns:1fr 1fr; gap:16px 28px; margin-bottom:34px;}
.loancalc-checklist span{display:flex; align-items:center; gap:10px; font-size:.9rem; font-weight:600; color:var(--ink);}
.loancalc-checklist i{color:var(--gold-deep); font-size:.85rem; flex-shrink:0;}

.loancalc-card-wrap{position:relative;}
.loancalc-card-wrap::before{content:""; position:absolute; inset:-18px -18px auto auto; width:180px; height:180px; border-radius:50%; background:radial-gradient(circle, rgba(243,180,0,.35), rgba(243,180,0,0) 70%); filter:blur(10px); z-index:0; pointer-events:none;}

/* Premium EMI card */
.lc-card{position:relative; z-index:1; color:#fff; border-radius:24px; padding:22px 24px; overflow:hidden;
  background:
    radial-gradient(120% 60% at 100% 0%, rgba(243,180,0,.16) 0%, rgba(243,180,0,0) 55%),
    linear-gradient(160deg, #0F7259 0%, var(--navy-deep) 60%, #06372C 100%);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 40px 80px -36px rgba(8,74,59,.65), inset 0 1px 0 rgba(255,255,255,.12);}
.lc-card-top{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px;}
.lc-eyebrow{display:block; font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:4px;}
.lc-card-top h3{color:#fff; font-size:1.25rem; font-weight:400; line-height:1.2; margin:0;}
.lc-live{display:inline-flex; align-items:center; gap:7px; font-size:.72rem; font-weight:600; color:rgba(255,255,255,.75); padding:6px 12px; border-radius:100px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); white-space:nowrap;}
.lc-live i{width:7px; height:7px; border-radius:50%; background:#4ADE80; box-shadow:0 0 0 0 rgba(74,222,128,.6); animation:lc-pulse 2s infinite;}
@keyframes lc-pulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.55);} 70%{box-shadow:0 0 0 8px rgba(74,222,128,0);} 100%{box-shadow:0 0 0 0 rgba(74,222,128,0);}}

.lc-tabs{display:grid; grid-template-columns:repeat(4,1fr); gap:4px; padding:4px; border-radius:14px; background:rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.08); margin-bottom:16px;}
.lc-tab{appearance:none; border:0; cursor:pointer; font:600 .8rem 'Inter',sans-serif; color:rgba(255,255,255,.7); background:transparent; padding:7px 6px; border-radius:10px; transition:background .25s ease, color .25s ease;}
.lc-tab:hover{color:#fff;}
.lc-tab.active{background:#fff; color:var(--navy-deep); box-shadow:0 6px 16px -8px rgba(0,0,0,.5);}
.lc-tab:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}

.lc-field{margin-bottom:14px;}
.lc-field-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px;}
.lc-field-head label{font-size:.86rem; font-weight:600; color:rgba(255,255,255,.78);}
.lc-input{display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:9px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); transition:border-color .2s ease, background .2s ease;}
.lc-input:focus-within{border-color:var(--gold); background:rgba(255,255,255,.12);}
.lc-input span{font-size:.85rem; font-weight:600; color:rgba(255,255,255,.6);}
.lc-input input{width:96px; border:0; outline:0; background:transparent; color:#fff; text-align:right; font:600 1rem 'Inter',sans-serif; font-variant-numeric:tabular-nums;}
#lcTenureIn, #lcRateIn{width:44px;}
.lc-range{-webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:100px; outline:none; cursor:pointer; background:rgba(255,255,255,.16);}
.lc-range::-webkit-slider-thumb{-webkit-appearance:none; width:22px; height:22px; border-radius:50%; background:#fff; border:5px solid var(--gold); box-shadow:0 4px 14px -2px rgba(0,0,0,.5); transition:transform .15s ease;}
.lc-range::-webkit-slider-thumb:hover{transform:scale(1.12);}
.lc-range::-moz-range-thumb{width:12px; height:12px; border-radius:50%; background:#fff; border:5px solid var(--gold); box-shadow:0 4px 14px -2px rgba(0,0,0,.5);}
.lc-range:focus-visible{outline:2px solid var(--gold); outline-offset:6px;}

.lc-result{display:flex; align-items:center; gap:18px; padding:14px 16px; margin:6px 0 14px; border-radius:18px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);}
.lc-donut{position:relative; width:92px; height:92px; flex-shrink:0;}
.lc-donut svg{width:100%; height:100%; transform:rotate(-90deg);}
.lc-donut circle{fill:none; stroke-width:14;}
.lc-donut-bg{stroke:var(--gold);}
.lc-donut-int{stroke:#fff; stroke-linecap:round; stroke-dasharray:0 314.16; transition:stroke-dasharray .5s cubic-bezier(.16,1,.3,1);}
.lc-donut-center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1.1;}
.lc-donut-center small{font-size:.58rem; font-weight:600; color:rgba(255,255,255,.6); text-transform:uppercase; letter-spacing:.08em;}
.lc-donut-center b{font-family:'Inter',sans-serif; font-size:1.05rem; font-weight:500;}
.lc-result-info{flex:1; min-width:0;}
.lc-result-label{font-size:.78rem; font-weight:600; color:rgba(255,255,255,.65);}
.lc-emi{font-family:'Inter',sans-serif; font-size:clamp(1.5rem, 2.2vw, 1.9rem); font-weight:500; line-height:1.1; color:#fff; margin:0 0 8px; font-variant-numeric:tabular-nums;}
.lc-legend{display:grid; gap:3px;}
.lc-legend div{display:flex; align-items:center; gap:8px; font-size:.8rem; font-weight:500; color:rgba(255,255,255,.7);}
.lc-legend b{margin-left:auto; color:#fff; font-weight:600; font-variant-numeric:tabular-nums;}
.lc-legend .dot{width:9px; height:9px; border-radius:3px;}
.lc-legend .dot.p{background:var(--gold);}
.lc-legend .dot.i{background:#fff;}
.lc-legend .total{padding-top:5px; margin-top:3px; border-top:1px dashed rgba(255,255,255,.18);}
.lc-legend .total b{color:var(--gold-soft);}

.lc-apply{display:flex; align-items:center; justify-content:center; gap:12px; width:100%; padding:7px 7px 7px 22px; border-radius:100px; background:var(--gold); color:#171a2e!important; font-weight:700; font-size:.94rem; transition:transform .25s ease, box-shadow .25s ease;}
.lc-apply span{margin-left:auto; width:34px; height:34px; border-radius:50%; background:#171a2e; color:#fff; display:flex; align-items:center; justify-content:center; transition:transform .3s ease;}
.lc-apply:hover{transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(243,180,0,.6);}
.lc-apply:hover span{transform:rotate(45deg);}
.lc-note{font-size:.68rem; color:rgba(255,255,255,.5); text-align:center; margin:8px 0 0;}
@media(max-width:480px){
  .lc-card{padding:22px 18px;}
  .lc-result{flex-direction:column; text-align:center;}
  .lc-result-info{width:100%;}
  .lc-tab{font-size:.74rem;}
}

@media(max-width:1024px){
  .loancalc-content{grid-template-columns:1fr; gap:44px;}
  .loancalc-card-wrap{max-width:540px;}
}
@media(max-width:560px){
  .loancalc-content{padding:60px 22px;}
  .loancalc-checklist{grid-template-columns:1fr;}
}

/* ===== HORIZONTAL SERVICES (credit score / banking / tax) ===== */
/* .fw sits on an outer wrapper (.hs-outer), not on the pinned section itself: left:50%/margin-left:-50vw on the pinned element breaks the pinned width.
   The wrapper still breaks out of a CMS content container, so the section stays full width there too. */
.hs-sec{position:relative; width:100%; height:80vh; height:80svh; background:var(--paper); padding:10px 0; overflow:hidden; display:flex; align-items:stretch;}
.hs-track{display:flex; gap:10px; padding:0 10px; width:max-content; will-change:transform;}
.hs-panel{position:relative; overflow:hidden; flex:0 0 auto; width:calc(var(--hs-w, 100vw) * 0.85); height:100%; min-height:0;
  display:grid; grid-template-columns:1fr 0.82fr; gap:clamp(32px, 5vw, 96px); padding:clamp(28px, 3.2vw, 56px);
  border-radius:20px; background:var(--bg); color:#fff;}
.hs-left{display:flex; flex-direction:column; justify-content:space-between; min-width:0;}
.hs-num{display:block; font-family:'Inter',sans-serif; font-weight:400; font-size:min(19vh, 17vw); line-height:.8; letter-spacing:-0.06em; color:#fff; margin-left:-0.04em;}
.hs-kicker{display:inline-block; font-size:.8rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px; opacity:.85;}
.hs-title h2{font-weight:400; color:#fff; font-size:clamp(2rem, 3.4vw, 3.6rem); line-height:1.1; letter-spacing:-0.035em; margin:0; max-width:620px;}
.hs-bottom p{font-size:clamp(1rem, 1.15vw, 1.18rem); line-height:1.6; color:rgba(255,255,255,.92); max-width:620px; margin:0 0 18px;}
.hs-chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px;}
.hs-chips span{padding:7px 14px; border-radius:100px; font-size:.82rem; font-weight:500; color:#fff; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35);}
.hs-link{display:inline-flex; align-items:center; gap:8px; padding-bottom:3px; font-size:1.02rem; font-weight:500; color:#fff!important; border-bottom:1.5px solid #fff; transition:gap .25s ease;}
.hs-link i{transition:transform .3s ease;}
.hs-link:hover{gap:12px;}
.hs-link:hover i{transform:rotate(45deg);}
.hs-media{border-radius:16px; min-height:100%; background:rgba(0,0,0,.08) var(--img, none) center/cover no-repeat;}
.hs-media.hs-cutout{background:var(--img) center bottom / contain no-repeat; border-radius:0;}
.hs-media.hs-ground{margin-bottom:calc(-1 * clamp(28px, 3.2vw, 56px)); background-position:right bottom;}

@media(max-width:900px){
  .hs-sec{height:auto; padding:12px 0; display:block;}
  .hs-track{flex-direction:column; width:auto; padding:0 12px; gap:12px; transform:none!important;}
  .hs-panel{width:100%; height:auto; min-height:0; max-height:none; grid-template-columns:1fr; gap:28px; padding:26px 22px;}
  .hs-num{font-size:6.5rem; margin-bottom:28px;}
  .hs-title{margin-bottom:22px;}
  .hs-media{min-height:280px; order:2;}
  .hs-media.hs-ground{margin-bottom:-26px;}
}

/* ===== USE CASES ===== */
.feat-sec{background:var(--paper); padding:110px 0; position:relative;}
.feat-dot{position:absolute; top:36px; left:42px; width:10px; height:10px; border-radius:50%; background:var(--gold);}
.feat-row{display:grid; grid-template-columns:repeat(4,1fr); gap:22px; padding-bottom:40px; border-bottom:1px solid var(--line); margin-bottom:40px;}
.feat-col{text-align:center;}
.feat-ico-circle{width:64px; height:64px; border-radius:50%; background:var(--navy); display:grid; place-items:center; margin:0 auto 18px; transition:transform .4s cubic-bezier(.34,1.56,.64,1);}
.feat-col:hover .feat-ico-circle{transform:scale(1.08) rotate(-4deg);}
.feat-ico-circle i{color:#fff; font-size:1.5rem;}
.feat-col h4{font-size:1.02rem; font-weight:500; margin-bottom:10px; color:var(--ink);}
.feat-col p{color:var(--ink-dim); font-size:.86rem; line-height:1.65; font-weight:500; max-width:260px; margin:0 auto;}
.feat-stats-row{display:grid; grid-template-columns:repeat(5,1fr); gap:20px; text-align:center;}
.feat-stat b{display:block; font-family:'Inter',sans-serif; font-size:1.9rem; font-weight:500; color:var(--gold-deep); line-height:1;}
.feat-stat span{display:block; color:var(--ink-dim); font-size:.85rem; font-weight:600; margin-top:8px;}
@media(max-width:900px){
  .feat-sec{padding:80px 0;}
  .feat-row{grid-template-columns:1fr 1fr; gap:36px 22px;}
  .feat-stats-row{grid-template-columns:repeat(3,1fr); gap:26px;}
}
@media(max-width:600px){
  .feat-row{grid-template-columns:1fr;}
  .feat-stats-row{grid-template-columns:1fr 1fr;}
  .feat-stats-row .feat-stat:last-child{grid-column:1/-1;}
}

/* ===== HOW IT WORKS ===== */
.how-sec{background:var(--card); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:110px 0;}
.how-tag{display:inline-flex; align-items:center; gap:8px; color:var(--gold-deep); font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px;}
.how-tag::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--gold-deep); flex-shrink:0;}
.how-head2{text-align:center; max-width:760px; margin:0 auto 64px;}
.how-head2 h2{font-size:clamp(2rem,3.8vw,2.9rem); line-height:1.2; margin-bottom:16px;}
.how-head2 h2 b{font-weight:400;}
.how-head2 p{color:var(--ink-dim); font-size:1rem; line-height:1.7; font-weight:500; max-width:560px; margin:0 auto;}
.how-row2{position:relative; display:grid; grid-template-columns:repeat(4,1fr); column-gap:26px; padding:20px 0 40px;}
.how-card{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:32px 26px 40px; position:relative; box-shadow:0 24px 48px -34px rgba(0,0,0,.14);}
.how-card.down{margin-top:96px;}
.how-ico3{color:var(--gold-deep); font-size:1.9rem; margin-bottom:18px; display:block;}
.how-card h4{font-size:1.06rem; font-weight:500; margin-bottom:10px; color:var(--ink);}
.how-card p{color:var(--ink-dim); font-size:.86rem; line-height:1.65; font-weight:500;}
.how-badge{position:absolute; left:50%; transform:translateX(-50%); width:38px; height:38px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-weight:700; font-size:.82rem; border:4px solid var(--card); z-index:2;}
.how-card:not(.down) .how-badge{bottom:-19px;}
.how-card.down .how-badge{top:-19px;}
.how-arrow{position:absolute; width:64px; height:46px; pointer-events:none; z-index:1;}
.how-arrow svg{width:100%; height:100%; overflow:visible;}
.how-arrow.a1{left:22.5%; top:44px;}
.how-arrow.a2{left:47.5%; top:112px;}
.how-arrow.a3{left:72.5%; top:44px;}
@media(max-width:900px){.how-row2{grid-template-columns:1fr 1fr; row-gap:60px;} .how-card.down{margin-top:0;} .how-arrow{display:none;} .how-sec{padding:80px 0;}}
@media(max-width:600px){.how-row2{grid-template-columns:1fr; row-gap:52px;}}

/* ===== TESTIMONIALS ===== */
.test-sec{background:var(--paper); padding:110px 0; position:relative; overflow:hidden;}
.test-deco-ring{position:absolute; top:26px; left:26px; width:34px; height:34px; border:1.5px solid var(--navy); border-radius:50%; opacity:.35;}
.test-head{text-align:center; max-width:640px; margin:0 auto 50px;}
.test-tag{display:inline-flex; align-items:center; gap:10px; background:rgba(14,107,84,.07); color:var(--gold-deep); font-size:.78rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:10px 30px 10px 18px; margin-bottom:18px; clip-path:polygon(0 0, 82% 0, 100% 50%, 82% 100%, 0 100%);}
.test-tag i{color:var(--navy);}
.test-head h2{font-size:clamp(1.8rem,3.2vw,2.4rem); line-height:1.28; font-weight:400; margin:0;}

.test-card2{position:relative; background:#EAF4EF; border-radius:var(--radius-lg); padding:50px; display:grid; grid-template-columns:auto 1fr; gap:56px; align-items:center; overflow:hidden;}
.test-card2-media{position:relative; width:260px; height:260px; flex-shrink:0;}
.test-card2-shape{position:absolute; left:-46px; top:-30px; width:230px; height:230px; background:var(--navy); border-radius:50%; z-index:0;}
.test-card2-circles{position:absolute; left:-60px; top:-10px; width:220px; height:220px; opacity:.18; z-index:0;}
.test-card2-photo{position:relative; z-index:1; width:100%; height:100%; border-radius:50%; overflow:hidden; border:8px solid #fff; box-shadow:0 20px 44px -20px rgba(0,0,0,.25); background:var(--navy); display:grid; place-items:center;}
.test-card2-photo i{color:#fff; font-size:4.4rem;}
.test-card2-rating{position:absolute; left:50%; bottom:-14px; transform:translateX(-50%); z-index:2; background:#fff; border-radius:100px; padding:9px 18px; display:flex; gap:3px; box-shadow:0 14px 30px -14px rgba(0,0,0,.3); white-space:nowrap;}
.test-card2-rating i{color:var(--gold); font-size:.85rem;}

.test-card2-body{position:relative; z-index:1; display:flex; gap:24px; align-items:stretch;}
.test-card2-qico{color:var(--gold); font-size:2.4rem; flex-shrink:0; line-height:1;}
.test-card2-div{width:3px; background:var(--gold); border-radius:100px; flex-shrink:0;}
.test-card2-text{flex:1; display:flex; flex-direction:column; justify-content:center;}
.test-card2-text p{font-style:normal; font-size:1.02rem; line-height:1.75; color:var(--ink); font-weight:500; margin-bottom:22px;}
.test-card2-text p a{color:var(--gold-deep); font-weight:700; text-decoration:underline; text-underline-offset:3px;}
.test-card2-hr{height:1px; background:rgba(14,107,84,.15); margin-bottom:20px;}
.test-card2-footer{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;}
.test-card2-person b{display:block; font-size:1.05rem; font-weight:800; color:var(--ink);}
.test-card2-person span{display:block; font-size:.85rem; color:var(--ink-dim); font-weight:500;}
.test-card2-nav{display:flex; align-items:center; gap:14px;}
.test-card2-nav .tnav-arrow{width:38px; height:38px; border-radius:50%; border:1.5px solid var(--navy); display:grid; place-items:center; cursor:pointer; transition:background .2s ease;}
.test-card2-nav .tnav-arrow:hover{background:var(--navy);}
.test-card2-nav .tnav-arrow:hover i{color:#fff;}
.test-card2-nav .tnav-arrow i{color:var(--navy); font-size:.88rem;}
.test-card2-nav .tnav-count{font-size:.95rem; font-weight:700; color:var(--ink);}
.test-card2-nav .tnav-count b{color:var(--gold-deep);}

@media(max-width:900px){
  .test-sec{padding:80px 0;}
  .test-card2{grid-template-columns:1fr; padding:40px 28px; gap:40px; justify-items:center;}
  .test-card2-body{flex-direction:column;}
  .test-card2-div{width:100%; height:3px;}
}
@media(max-width:560px){
  .test-card2-media{width:200px; height:200px;}
  .test-card2-shape,.test-card2-circles{width:180px; height:180px; left:-30px;}
  .test-card2-footer{flex-direction:column; align-items:flex-start;}
}

/* ===== WHY CHOOSE US ===== */
.why-sec{background:var(--paper); padding:110px 0; position:relative;}
.why-inner-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:64px; align-items:center;}

.why-media2{position:relative; min-height:560px;}
.why-media2-dot{position:absolute; top:-4%; left:-2%; width:11px; height:11px; border-radius:50%; background:var(--gold);}
.why-img-top{position:relative; width:74%; height:62%; border-radius:var(--radius-lg); overflow:hidden; box-shadow:0 30px 60px -28px rgba(0,0,0,.22);}
.why-img-top img{width:100%; height:100%; object-fit:cover;}
.why-img-bottom{position:absolute; right:0; bottom:6%; width:58%; height:58%; border-radius:var(--radius-lg); overflow:hidden; box-shadow:0 30px 60px -26px rgba(0,0,0,.28); z-index:2;}
.why-img-bottom img{width:100%; height:100%; object-fit:cover;}
.why-img-bottom-dot{position:absolute; top:16px; left:16px; width:9px; height:9px; border-radius:50%; background:var(--gold-soft); z-index:3;}
.why-stat-badge{position:absolute; left:0; bottom:0; z-index:3; background:var(--navy); border-radius:var(--radius-lg); padding:24px 26px;}
.why-stat-badge b{display:block; color:#fff; font-family:'Inter',sans-serif; font-size:2.3rem; font-weight:500; line-height:1;}
.why-stat-badge span{display:block; color:rgba(255,255,255,.72); font-size:.84rem; font-weight:600; margin-top:8px; max-width:150px; line-height:1.4;}

.why-text2 .about-tag{margin-bottom:20px;}
.why-text2 h2{font-size:clamp(2rem,3.6vw,2.7rem); line-height:1.2; margin-bottom:16px;}
.why-text2 p.lead{color:var(--ink-dim); font-size:1rem; line-height:1.7; font-weight:500; margin-bottom:30px; max-width:480px;}

.why-feature-row{display:flex; align-items:center; gap:20px; margin-bottom:30px;}
.why-feature-ico{width:52px; height:52px; border-radius:14px; background:var(--gold); display:grid; place-items:center; flex-shrink:0;}
.why-feature-ico i{color:#fff; font-size:1.3rem;}
.why-feature-txt{flex:1;}
.why-feature-txt h4{font-size:1.05rem; font-weight:500; color:var(--ink); margin-bottom:6px;}
.why-feature-txt p{color:var(--ink-dim); font-size:.86rem; line-height:1.6; font-weight:500;}
.why-feature-div{width:1px; align-self:stretch; background:var(--line); flex-shrink:0;}
.why-feature-badge{width:80px; height:80px; flex-shrink:0;}

.why-progress-row{margin-bottom:28px;}
.why-progress-label{display:flex; align-items:center; justify-content:space-between; margin-bottom:12px;}
.why-progress-label b{font-size:1rem; font-weight:700; color:var(--ink);}
.why-progress-label span{font-weight:700; color:var(--ink);}
.why-progress-track{height:8px; background:var(--line); border-radius:100px; overflow:hidden;}
.why-progress-fill{height:100%; width:0%; background:linear-gradient(90deg,var(--gold-soft),var(--gold)); border-radius:100px; transition:width 1.2s cubic-bezier(.16,1,.3,1);}

.why-bottom-cards{display:grid; grid-template-columns:1fr 1fr; gap:20px; padding-top:26px; border-top:1px solid var(--line);}
.why-card-rate{background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px;}
.why-card-rate .rate-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px;}
.why-card-rate .rate-row .stars{color:var(--gold); display:flex; gap:2px; font-size:.85rem;}
.why-card-rate .rate-row b{font-size:.9rem; font-weight:700; color:var(--ink);}
.why-card-rate p{color:var(--ink); font-size:.9rem; font-weight:600; line-height:1.5; margin-bottom:16px;}
.why-rate-div{height:1px; background:var(--line); margin-bottom:14px;}
.why-avatar-stack{display:flex; align-items:center;}
.why-avatar-stack img{width:32px; height:32px; border-radius:50%; border:2px solid var(--card); object-fit:cover; margin-left:-8px;}
.why-avatar-stack img:first-child{margin-left:0;}
.why-avatar-stack .why-avatar-more{width:32px; height:32px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-size:.6rem; font-weight:700; margin-left:-8px;}

.why-card-chart{background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px; display:flex; flex-direction:column;}
.why-card-chart .amt{font-family:'Inter',sans-serif; font-size:1.5rem; font-weight:500; color:var(--ink); margin-bottom:10px;}
.why-chart-legend{display:flex; gap:14px; margin-bottom:16px;}
.why-chart-legend span{display:flex; align-items:center; gap:6px; font-size:.72rem; font-weight:600; color:var(--ink-dim);}
.why-chart-legend span::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--gold); flex-shrink:0;}
.why-chart-legend span.dec::before{background:var(--navy);}
.why-bars-row{display:flex; align-items:flex-end; gap:8px; flex:1; height:70px;}
.why-bars-row .bar{flex:1; background:var(--gold); border-radius:4px 4px 0 0; transform-origin:bottom;}
.why-bars-row .bar.active{background:var(--navy);}
.why-bars-labels{display:flex; gap:8px; margin-top:8px;}
.why-bars-labels span{flex:1; text-align:center; font-size:.66rem; color:var(--ink-dim); font-weight:600;}

@media(max-width:900px){
  .why-sec{padding:80px 0;}
  .why-inner-grid{grid-template-columns:1fr; gap:70px;}
  .why-media2{max-width:480px; margin:0 auto;}
}
@media(max-width:560px){
  .why-feature-row{flex-wrap:wrap;}
  .why-feature-badge{display:none;}
  .why-bottom-cards{grid-template-columns:1fr;}
}

/* ===== BACKED BY ===== */
.backed-sec{background:var(--paper); padding:0 0 90px;}
.backed-row{display:grid; grid-template-columns:1fr 3fr; gap:32px; align-items:center;}
.backed-lead{color:rgba(17,17,17,.62); font-size:1rem; line-height:1.65; font-weight:500;}
.backers-track-wrap{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.backers-track{display:flex; width:max-content; animation:backersmq 30s linear infinite;}
@keyframes backersmq{from{transform:translateX(0);} to{transform:translateX(-50%);}}
.bk-item{margin:0 38px; flex-shrink:0; color:rgba(17,17,17,.4); white-space:nowrap; font-weight:700;}
@media(max-width:760px){.backed-row{grid-template-columns:1fr; gap:18px;} .backed-sec{padding-bottom:60px;}}

/* ===== CONTACT DETAILS ===== */
.contact-sec{position:relative; background:radial-gradient(40% 60% at 92% 8%, rgba(243,180,0,.09) 0%, rgba(243,180,0,0) 70%), radial-gradient(35% 50% at 4% 96%, rgba(14,107,84,.08) 0%, rgba(14,107,84,0) 70%), var(--card); border-top:1px solid var(--line); padding:100px 0; overflow:hidden;}
.contact-grid{position:relative; z-index:1;}
.contact-grid-solo{max-width:820px; margin:0 auto; text-align:center;}
.contact-grid-solo .contact-info p.lead{max-width:560px; margin-left:auto; margin-right:auto;}
.contact-info h2{font-size:clamp(2rem,3.4vw,2.6rem); line-height:1.18; margin-bottom:16px;}
.contact-info p.lead{color:var(--ink-dim); font-size:1rem; line-height:1.75; font-weight:500; margin-bottom:32px; max-width:440px;}
.contact-rows{display:flex; flex-direction:column; gap:14px;}
.contact-rows-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; text-align:left;}
.contact-row{display:flex; align-items:center; gap:16px; background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:18px 22px; transition:border-color .3s ease, transform .3s cubic-bezier(.4,0,.2,1), box-shadow .3s ease;}
.contact-row:hover{border-color:var(--navy); transform:translateY(-3px); box-shadow:0 16px 32px -20px rgba(14,107,84,.4);}
.contact-row .cr-ico{width:44px; height:44px; border-radius:50%; background:var(--navy); display:grid; place-items:center; flex-shrink:0;}
.contact-row .cr-ico i{color:#fff; font-size:1.05rem;}
.contact-row h4{font-size:.78rem; font-weight:500; text-transform:uppercase; letter-spacing:.04em; color:var(--gold-deep); margin-bottom:6px;}
.contact-row p, .contact-row a{display:block; font-size:.95rem; font-weight:600; color:var(--ink); line-height:1.6;}
.contact-row a:hover{color:var(--gold-deep);}
@media(max-width:900px){.contact-sec{padding:70px 0;}}
@media(max-width:640px){.contact-rows-grid{grid-template-columns:1fr;}}

/* ===== FINAL CTA ===== */
.cta-sec{background:var(--paper); padding:120px 0 100px; text-align:center;}
.cta-sec h2{font-size:clamp(2rem,3.6vw,2.8rem); letter-spacing:-0.03em; margin-bottom:20px; max-width:640px; margin-left:auto; margin-right:auto;}
.cta-sec p{color:var(--ink-dim); font-size:1.02rem; max-width:520px; margin:0 auto 36px; line-height:1.75; font-weight:500;}
.cta-actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.dark-pill{display:inline-flex; align-items:center; gap:10px; background:var(--navy); color:#fff; padding:16px 30px; border-radius:100px; font-weight:700; font-size:.9rem; transition:background .3s ease, transform .3s cubic-bezier(.4,0,.2,1), box-shadow .3s ease;}
.dark-pill:hover{background:var(--navy-deep); transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(0,0,0,.4);}
.ghost-pill{display:inline-flex; align-items:center; gap:10px; border:1.5px solid var(--line); color:var(--ink); padding:16px 30px; border-radius:100px; font-weight:700; font-size:.9rem; transition:all .3s ease;}
.ghost-pill:hover{border-color:var(--navy); background:var(--navy); color:#fff; transform:translateY(-2px);}
@media(max-width:560px){
  .cta-sec{padding:80px 0 60px;}
  .cta-actions{flex-direction:column; align-items:stretch;}
  .dark-pill,.ghost-pill{justify-content:center;}
}

.gs-reveal{opacity:0; transform:translateY(36px); will-change:transform,opacity;}
.gs-fade{opacity:0; will-change:opacity;}
.gs-scale{opacity:0; transform:translateY(24px) scale(.96); will-change:transform,opacity;}
.gs-left{opacity:0; transform:translateX(-32px); will-change:transform,opacity;}
.gs-right{opacity:0; transform:translateX(32px); will-change:transform,opacity;}
.gs-stagger > *{opacity:0; transform:translateY(24px); will-change:transform,opacity;}
@media (prefers-reduced-motion: reduce){
  .gs-reveal,.gs-fade,.gs-scale,.gs-left,.gs-right{opacity:1!important; transform:none!important;}
  .gs-stagger > *{opacity:1!important; transform:none!important;}
  *{animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important;}
}

/* image vars: declared in the same stylesheet that uses them */
.img-05{--img:url('../images/home/img-05.webp')}
.img-06{--img:url('../images/home/img-06.jpg')}
.img-07{--img:url('../images/home/img-07.webp')}
.img-08{--img:url('../images/home/img-08.webp')}
.img-09{--img:url('../images/home/img-09.webp')}
.img-10{--img:url('../images/home/img-10.webp')}
.img-11{--img:url('../images/home/img-11.webp')}
.img-12{--img:url('../images/home/img-12.webp')}

/* ===== AEPS section ===== */
.ae-sec{padding:clamp(60px,7vw,100px) 0; background:linear-gradient(180deg,#fbfaf6,#eef7f3);}
.ae-head{max-width:760px; margin:0 auto 46px; text-align:center;}
.ae-tag, .ap-tag{display:inline-flex; align-items:center; gap:8px; padding:7px 16px; border-radius:100px; font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; background:#e5f3ed; color:#0E6B54; margin-bottom:16px;}
.ae-head h2{font-size:clamp(1.9rem,3.6vw,3rem); line-height:1.1; letter-spacing:-.03em; margin:0 0 14px; color:#0b1512;}
.ae-head p{color:#4a5a54; font-size:1.05rem; line-height:1.75; margin:0;}
.ae-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,5vw,70px); align-items:center;}
.ae-cards{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:24px;}
.ae-card{padding:20px; border-radius:20px; background:#fff; border:1px solid rgba(14,107,84,.14); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
.ae-card:hover{transform:translateY(-4px); border-color:#F3B400; box-shadow:0 18px 36px -16px rgba(8,74,59,.25);}
.ae-card span{width:44px; height:44px; border-radius:13px; background:#0E6B54; color:#F3B400; display:grid; place-items:center; font-size:1.3rem; margin-bottom:12px;}
.ae-card h4{margin:0 0 4px; font-size:1rem; color:#0b1512;} .ae-card p{margin:0; font-size:.86rem; line-height:1.55; color:#5b6b66;}
.ae-points{list-style:none; margin:0 0 26px; padding:0; display:grid; gap:10px;}
.ae-points li{display:flex; gap:10px; color:#33423d; font-size:.95rem;} .ae-points i{color:#0E6B54; font-size:1.2rem; flex-shrink:0;}
.ae-cta, .ap-cta{display:flex; flex-wrap:wrap; gap:12px;}
.ae-btn, .ap-btn{display:inline-flex; align-items:center; gap:10px; padding:13px 24px; border-radius:100px; background:#F3B400; color:#0b1512; font-weight:700; font-size:.92rem; text-decoration:none; transition:transform .25s ease;}
.ae-btn:hover, .ap-btn:hover{transform:translateY(-2px);}
.ae-btn.ghost{background:none; border:1.5px solid rgba(14,107,84,.4); color:#0E6B54;}
/* ===== AEPS: iPhone 16 style mockup ===== */
.ae-right{display:grid; grid-template-columns:320px 1fr; gap:24px; align-items:center;}
.ae-stage{position:relative; display:grid; place-items:center; padding:34px 0 40px;}
.ae-stage::before{content:""; position:absolute; width:330px; height:330px; border-radius:50%; background:radial-gradient(circle,rgba(243,180,0,.30),rgba(14,107,84,.16) 52%,transparent 70%); filter:blur(4px);}
.ae-stage::after{content:""; position:absolute; bottom:18px; width:230px; height:28px; border-radius:50%; background:radial-gradient(ellipse,rgba(5,40,31,.5),transparent 70%); filter:blur(7px);}
.ae-phone{position:relative; z-index:1; width:290px; height:598px;}
.ae-phone > b{position:absolute; z-index:0; width:5px; border-radius:3px; background:linear-gradient(90deg,#3b3e44,#8b8f97 45%,#2a2d32);}
.ae-phone .l{left:-3px;} .ae-phone .r{right:-3px; background:linear-gradient(270deg,#3b3e44,#8b8f97 45%,#2a2d32);}
.ae-phone .act{top:112px; height:30px;} .ae-phone .vu{top:166px; height:54px;} .ae-phone .vd{top:230px; height:54px;}
.ae-phone .pwr{top:190px; height:88px;} .ae-phone .cam{top:392px; height:58px; width:4px; right:-2px; background:linear-gradient(270deg,#1b1d20,#5d6168 50%,#1b1d20);}
.ae-device{position:relative; z-index:1; width:100%; height:100%; border-radius:54px; padding:4px; background:linear-gradient(145deg,#8a8e96 0%,#3a3d43 14%,#17191c 46%,#2c2f35 78%,#8d9199 100%); box-shadow:0 0 0 1px rgba(255,255,255,.22) inset, 0 2px 3px rgba(255,255,255,.38) inset, 0 0 0 1px rgba(0,0,0,.55), 0 50px 80px -28px rgba(5,40,31,.6), 0 22px 34px -18px rgba(0,0,0,.5);}
.ae-display{position:relative; display:flex; flex-direction:column; height:100%; border-radius:50px; border:7px solid #050506; box-sizing:border-box; overflow:hidden; background:#f3f8f5; font-family:-apple-system,'SF Pro Text','Inter',sans-serif;}
.ae-island{position:absolute; z-index:6; top:9px; left:50%; width:90px; height:26px; margin-left:-45px; border-radius:20px; background:#000;}
.ae-island i{position:absolute; right:10px; top:8px; width:10px; height:10px; border-radius:50%; background:radial-gradient(circle at 35% 35%,#2f4e86 0%,#0d1730 45%,#000 75%); box-shadow:0 0 0 2px #07090d;}
.ae-top{position:relative; flex:none; padding:14px 22px 16px; color:#fff; background:linear-gradient(160deg,#10785e,#07382d); border-radius:0 0 28px 28px;}
.ae-status{display:flex; justify-content:space-between; align-items:center; height:22px; padding:0 8px 0 10px; font-size:.82rem; font-weight:600; letter-spacing:.01em;}
.ae-status span{display:flex; gap:5px; align-items:center; font-size:.95rem;}
.ae-app{display:flex; align-items:center; gap:10px; margin-top:20px;}
.ae-app em{width:36px; height:36px; border-radius:12px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22); display:grid; place-items:center; color:#F3B400; font-size:1.3rem; font-style:normal; flex-shrink:0;}
.ae-app div{flex:1; line-height:1.2;} .ae-app strong{display:block; font-size:.9rem;} .ae-app small{font-size:.68rem; color:rgba(255,255,255,.7);}
.ae-app > i{font-size:1.15rem; color:rgba(255,255,255,.85);}
.ae-screen{flex:1; min-height:0; overflow:hidden; padding:16px 16px 0;}
.ae-dots{position:absolute; z-index:3; bottom:26px; left:0; right:0; display:flex; justify-content:center; gap:6px;} .ae-dots i{width:6px; height:6px; border-radius:50%; background:#cfdad6; transition:all .3s ease;} .ae-dots i.on{width:18px; border-radius:6px; background:#F3B400;}
.ae-home{position:absolute; z-index:3; bottom:8px; left:50%; width:104px; height:4px; margin-left:-52px; border-radius:4px; background:#0b1512; opacity:.85;}
.ae-glare{position:absolute; inset:0; z-index:7; pointer-events:none; background:linear-gradient(118deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.07) 24%,transparent 38%,transparent 78%,rgba(255,255,255,.08) 100%);}
.ae-s{animation:aeIn .5s ease both;} @keyframes aeIn{from{opacity:0; transform:translateY(10px);}}
.ae-prog{display:flex; align-items:center; gap:10px; margin-bottom:6px;} .ae-prog small{font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:#C98A00; font-weight:700; white-space:nowrap;}
.ae-prog u{flex:1; height:4px; border-radius:4px; background:#dbe6e1; overflow:hidden; text-decoration:none;} .ae-prog u i{display:block; height:100%; border-radius:4px; background:linear-gradient(90deg,#0E6B54,#F3B400);}
.ae-s h5{margin:2px 0 12px; font-size:1.08rem; letter-spacing:-.01em; color:#0b1512;}
.ae-lbl{display:block; margin-bottom:6px; font-size:.72rem; font-weight:600; color:#6b7a75;}
.ae-in{display:flex; gap:6px;} .ae-in span{flex:1; text-align:center; padding:11px 0; border-radius:12px; background:#fff; border:1.5px solid #cfdad6; font-weight:700; letter-spacing:.06em; font-size:.84rem; color:#0b1512;} .ae-in span.f{border-color:#0E6B54; box-shadow:0 0 0 3px rgba(14,107,84,.12);} .ae-in span.f::after{content:""; display:inline-block; width:1.5px; height:.95em; margin-left:2px; vertical-align:-2px; background:#0E6B54; animation:aeBlink 1s steps(1) infinite;} @keyframes aeBlink{50%{opacity:0;}}
.ae-pad{display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:14px;} .ae-pad span{height:35px; border-radius:11px; background:#fff; border:1px solid #e1e9e5; display:grid; place-items:center; font-size:.98rem; font-weight:600; color:#0b1512; box-shadow:0 1px 0 rgba(8,74,59,.06);} .ae-pad span i{font-size:1.1rem; color:#5b6b66;}
.ae-key{margin-top:12px; padding:12px; text-align:center; border-radius:14px; background:linear-gradient(135deg,#0E6B54,#0a5442); color:#fff; font-weight:700; font-size:.86rem; box-shadow:0 10px 18px -10px rgba(14,107,84,.8);}
.ae-find{display:flex; align-items:center; gap:8px; padding:10px 12px; margin-bottom:10px; border-radius:12px; background:#e8efec; color:#7a8a85; font-size:.78rem;}
.ae-bank, .ae-chip{display:flex; align-items:center; gap:11px; padding:11px 12px; margin-bottom:8px; border-radius:14px; background:#fff; border:1.5px solid #e1e9e5; font-size:.82rem; font-weight:600; color:#33423d; transition:all .3s ease;}
.ae-bank > span{width:32px; height:32px; border-radius:10px; background:#e5f3ed; color:#0E6B54; display:grid; place-items:center; font-size:1.1rem; flex-shrink:0;}
.ae-bank small{display:block; font-weight:500; font-size:.68rem; color:#8a99a5;} .ae-bank > i{margin-left:auto; font-size:1.15rem; color:#cfdad6;}
.ae-bank.on, .ae-chip.on{border-color:#F3B400; background:#fff8e1;} .ae-bank.on > i{color:#0E6B54;}
.ae-c{text-align:center;} .ae-c p{font-size:.78rem; color:#5b6b66; margin:12px 0 0; line-height:1.5;}
.ae-fp{position:relative; width:128px; height:128px; margin:14px auto 0; border-radius:50%; background:#e5f3ed; display:grid; place-items:center; font-size:4rem; color:#0E6B54; overflow:hidden;}
.ae-fp b{position:absolute; left:0; right:0; height:3px; background:#F3B400; box-shadow:0 0 12px #F3B400; animation:aeScan 1.4s ease-in-out infinite;} @keyframes aeScan{0%{top:6%;}50%{top:92%;}100%{top:6%;}}
.ae-fpw{position:relative; width:150px; margin:0 auto;} .ae-fpw::before, .ae-fpw::after{content:""; position:absolute; inset:-9px; border-radius:50%; border:1.5px solid rgba(14,107,84,.35); animation:aeRing 2s ease-out infinite;} .ae-fpw::after{animation-delay:1s;} @keyframes aeRing{from{transform:scale(.82); opacity:1;} to{transform:scale(1.18); opacity:0;}}
.ae-fpw .ae-fp{margin:11px auto;}
.ae-dev{display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:6px 12px; border-radius:100px; background:#e5f3ed; color:#0E6B54; font-size:.7rem; font-weight:700;} .ae-dev i{font-size:.95rem;}
.ae-tiles{display:grid; grid-template-columns:1fr 1fr; gap:9px;} .ae-tile{padding:14px 12px; border-radius:16px; background:#fff; border:1.5px solid #e1e9e5; font-size:.76rem; font-weight:700; color:#33423d; line-height:1.3;} .ae-tile i{display:grid; place-items:center; width:34px; height:34px; margin-bottom:10px; border-radius:11px; background:#e5f3ed; color:#0E6B54; font-size:1.2rem;} .ae-tile.on{border-color:#F3B400; background:#fff8e1;} .ae-tile.on i{background:#0E6B54; color:#F3B400;}
.ae-tick{width:78px; height:78px; margin:6px auto 12px; border-radius:50%; background:#0E6B54; color:#F3B400; display:grid; place-items:center; font-size:2.3rem; box-shadow:0 0 0 8px rgba(14,107,84,.12); animation:aePop .6s cubic-bezier(.2,1.5,.4,1) both;} @keyframes aePop{from{transform:scale(0);}}
.ae-rec{margin-top:14px; padding:4px 14px; border-radius:16px; background:#fff; border:1px solid #e1e9e5; text-align:left;} .ae-rec div{display:flex; justify-content:space-between; padding:9px 0; font-size:.76rem; color:#6b7a75; border-bottom:1px dashed #e1e9e5;} .ae-rec div:last-child{border:0;} .ae-rec b{color:#0b1512; font-weight:700;} .ae-rec b.g{color:#0E6B54;}
.ae-steps{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
.ae-steps li{display:flex; gap:12px; align-items:center; padding:11px 13px; border-radius:14px; background:#fff; border:1px solid rgba(14,107,84,.12); cursor:pointer; transition:all .25s ease;}
.ae-steps li b{width:30px; height:30px; border-radius:50%; background:#e5f3ed; color:#0E6B54; display:grid; place-items:center; font-size:.82rem; flex-shrink:0; transition:all .25s ease;}
.ae-steps strong{display:block; font-size:.88rem; color:#0b1512;} .ae-steps span{display:block; font-size:.74rem; color:#6b7a75; line-height:1.35;}
.ae-steps li.is-on{background:#0E6B54; border-color:#0E6B54; transform:translateX(6px);} .ae-steps li.is-on strong{color:#fff;} .ae-steps li.is-on span{color:rgba(255,255,255,.72);} .ae-steps li.is-on b{background:#F3B400; color:#0b1512;}

/* ===== API section ===== */
.ap-sec{padding:clamp(60px,7vw,100px) 0; color:#fff; background:radial-gradient(800px 380px at 90% 0%, rgba(243,180,0,.14), transparent 60%), radial-gradient(700px 400px at 0% 100%, rgba(47,167,125,.16), transparent 60%), linear-gradient(160deg,#0a1f1a,#05140f);}
.ap-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(28px,5vw,70px); align-items:center;}
.ap-tag{background:rgba(243,180,0,.14); color:#F3B400; border:1px solid rgba(243,180,0,.35);}
.ap-left h2{font-size:clamp(1.9rem,3.4vw,2.8rem); line-height:1.1; letter-spacing:-.03em; margin:0 0 14px;}
.ap-left > p{color:rgba(255,255,255,.72); font-size:1.02rem; line-height:1.75; margin:0 0 24px;}
.ap-points{list-style:none; margin:0 0 28px; padding:0; display:grid; gap:14px;}
.ap-points li{display:flex; gap:14px; align-items:flex-start;}
.ap-points li > i{width:42px; height:42px; border-radius:12px; background:rgba(243,180,0,.14); border:1px solid rgba(243,180,0,.4); color:#F3B400; display:grid; place-items:center; font-size:1.2rem; flex-shrink:0;}
.ap-points b{display:block; font-size:.98rem;} .ap-points span{display:block; font-size:.84rem; color:rgba(255,255,255,.6); margin-top:2px;}
.ap-btn.ghost{background:none; border:1.5px solid rgba(255,255,255,.4); color:#fff;}
.ap-eps{display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap;}
.ap-eps button{padding:9px 16px; border-radius:100px; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); color:rgba(255,255,255,.8); font-family:inherit; font-size:.82rem; font-weight:600; cursor:pointer; transition:all .2s ease;}
.ap-eps button.is-on{background:#F3B400; color:#0b1512; border-color:#F3B400;}
.ap-win{border-radius:20px; overflow:hidden; background:#0b1512; border:1px solid rgba(255,255,255,.12); box-shadow:0 40px 80px -30px rgba(0,0,0,.7);}
.ap-bar{display:flex; align-items:center; gap:7px; padding:12px 16px; background:#111f1a; border-bottom:1px solid rgba(255,255,255,.08);}
.ap-d{width:11px; height:11px; border-radius:50%;} .ap-d.r{background:#ff5f56;} .ap-d.y{background:#ffbd2e;} .ap-d.g{background:#27c93f;}
.ap-langs{display:flex; gap:4px; margin-left:14px;} .ap-langs button{padding:5px 12px; border-radius:8px; border:0; background:none; color:rgba(255,255,255,.55); font-family:inherit; font-size:.76rem; font-weight:600; cursor:pointer;} .ap-langs button.is-on{background:rgba(243,180,0,.16); color:#F3B400;}
.ap-live{margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:.7rem; font-weight:700; color:#27c93f; letter-spacing:.06em; text-transform:uppercase;} .ap-live i{width:7px; height:7px; border-radius:50%; background:#27c93f; animation:apBlink 1.2s infinite;} @keyframes apBlink{50%{opacity:.25;}}
.ap-code, .ap-resp pre{margin:0; padding:18px 20px; font-family:ui-monospace,SFMono-Regular,Consolas,'Courier New',monospace; font-size:.8rem; line-height:1.7; color:#cdd9d4; overflow-x:auto; white-space:pre;}
.ap-code{min-height:268px;}
.ap-code .c{color:#6b8078; font-style:italic;} .ap-code .s, .ap-resp .s{color:#a5e8c3;} .ap-code .k, .ap-resp .k{color:#F3B400;} .ap-code .n, .ap-resp .n{color:#7fb8ff;}
.cur{display:inline-block; width:8px; height:15px; margin-left:1px; vertical-align:-2px; background:#F3B400; animation:apBlink .9s steps(1) infinite;}
.ap-run{display:flex; align-items:center; justify-content:space-between; padding:10px 16px; background:#111f1a; border-top:1px solid rgba(255,255,255,.08);}
.ap-run button{display:inline-flex; align-items:center; gap:8px; padding:9px 18px; border-radius:100px; border:0; background:#27c93f; color:#04210d; font-family:inherit; font-weight:800; font-size:.8rem; cursor:pointer; transition:transform .2s ease;} .ap-run button:hover{transform:translateY(-2px);}
.ap-run span{font-size:.76rem; color:rgba(255,255,255,.55);}
.ap-resp{display:none; border-top:1px solid rgba(255,255,255,.08); background:#07110d;} .ap-resp.on{display:block; animation:aeIn .4s ease both;}
.ap-resp-h{display:flex; justify-content:space-between; align-items:center; padding:10px 20px 0; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.5); font-weight:700;} .ap-resp-h em{font-style:normal; color:#27c93f; background:rgba(39,201,63,.12); padding:3px 9px; border-radius:6px;}
.ap-resp pre{min-height:150px; padding-top:8px;}

@media(max-width:1000px){.ae-grid, .ap-grid{grid-template-columns:1fr;} .ae-right{grid-template-columns:1fr; justify-items:center;} .ae-steps{width:100%;}}
@media(max-width:560px){.ae-cards{grid-template-columns:1fr;} .ap-code{font-size:.72rem;}}
@media(prefers-reduced-motion:reduce){.ae-fp b, .ap-live i, .cur{animation:none;}}

.ap-sec h2, .ap-sec h3{color:#fff;}
.ap-sec .ap-points b{color:#fff;}

/* ===== responsive fixes (mobile) ===== */
.ae-grid > *, .ae-right > *, .ap-grid > *{min-width:0;}
.ap-win{max-width:100%;}
.ap-code, .ap-resp pre{max-width:100%;}
@media(max-width:1000px){
  .ae-device{margin:0 auto;}
  .ae-steps li.is-on{transform:none;}
}
@media(max-width:640px){
  .sb-sec{padding:20px 0;}
  .svcacc-item .svcx-body{padding-right:44px;}
  .svcacc-item.active .svcx-num{position:absolute; top:16px; right:18px;}
  .ap-left h2, .ae-head h2{overflow-wrap:anywhere;}
  .ap-cta, .ae-cta{flex-direction:column; align-items:stretch;} .ap-btn, .ae-btn{justify-content:center;}
  .ap-eps{gap:6px;} .ap-eps button{padding:8px 12px; font-size:.76rem;}
  .ap-langs{margin-left:6px;} .ap-bar{padding:10px 12px;}
  .ap-run{flex-wrap:wrap; gap:8px;}
  .ap-code{min-height:230px; font-size:.7rem; padding:14px;}
}

/* hero photo: keep the speaker in frame */
.hero-bg img{object-position:68% center;}
@media(max-width:700px){.hero-bg img{object-position:72% center;}}

.ae-ok h5{margin:0;} .ae-ok em{display:block; margin-top:10px; font-style:normal; font-size:.74rem; color:#8a99a5; letter-spacing:.04em;}
@media(max-width:1000px){.ae-right{grid-template-columns:1fr;} .ae-stage{width:100%;}}
@media(prefers-reduced-motion:reduce){.ae-phone, .ae-fpw::before, .ae-fpw::after{animation:none;}}

@media(min-width:1001px){.ae-head{max-width:none;} .ae-head h2{white-space:nowrap;} .ae-head p{max-width:760px; margin:0 auto;}}

/* performance: sections at the very end of the page are laid out and painted only when they get close to the screen */
.test-sec, .backed-sec, .contact-sec{content-visibility:auto; contain-intrinsic-size:auto 720px;}