/* ============ SecAug — premium dark-brown + gold ============ */
:root{
  --ink:#120D06; --ink2:#1A1208; --espresso:#3A2414; --cocoa:#6F4527; --caramel:#B8793A;
  --gold:#E6B450; --gold-deep:#C98A1F; --gold-soft:#F4D18A;
  --cream:#F8F6F0; --cream-dim:#C9BEAE; --muted:#A89B8C;
  --card:#211710; --card2:#2A1D13; --line:rgba(230,180,80,.16); --line2:rgba(255,255,255,.07);
  --serif:'Playfair Display',Georgia,serif; --sans:'Plus Jakarta Sans',system-ui,sans-serif;
  --wrap:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--cream);font-family:var(--sans);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
em{font-style:italic;color:var(--gold)}
section{position:relative}
.kicker{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:2px;color:var(--muted);text-transform:uppercase}
.kicker--gold{color:var(--gold)}
.kicker .dot,.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold);display:inline-block}
.kicker--gold .dot{animation:pulse 1.8s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}

/* ---------- NAV ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;
  padding:16px clamp(16px,4vw,44px);transition:.35s;backdrop-filter:blur(0px)}
.nav.scrolled{background:rgba(18,13,6,.82);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding-top:12px;padding-bottom:12px}
.nav__brand{display:flex;align-items:center;gap:11px}
.nav__logo{width:38px;height:38px;border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.5)}
.nav__word{font-family:var(--serif);font-weight:900;font-size:23px;font-style:italic;letter-spacing:-.5px;color:var(--cream);position:relative}
.nav__word i{position:absolute;left:2px;right:6px;bottom:-3px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--gold),var(--gold-deep),transparent)}
.nav__links{display:flex;gap:30px;font-size:14.5px;font-weight:500}
.nav__links a{color:var(--cream-dim);transition:.2s;position:relative}
.nav__links a:hover{color:var(--gold)}
.nav__links a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:2px;background:var(--gold);transition:.25s;opacity:.8}
.nav__links a:hover::after{right:0}
.nav__cta{display:flex;align-items:center;gap:10px}
.pill{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;padding:8px 14px;border-radius:100px;white-space:nowrap}
.pill--android{background:rgba(255,255,255,.06);color:var(--cream);border:1px solid var(--line2)}
.pill--android svg{color:#8bc34a}
.pill--soon{background:linear-gradient(135deg,rgba(230,180,80,.16),rgba(201,138,31,.1));color:var(--gold);border:1px solid var(--line)}

/* ---------- HERO ---------- */
.hero{position:relative;padding:150px clamp(16px,4vw,44px) 0;overflow:hidden}
.hero__glow{position:absolute;top:-260px;right:-160px;width:760px;height:760px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,138,31,.28),rgba(184,121,58,.10) 40%,transparent 66%);filter:blur(20px);pointer-events:none}
.hero__inner{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;position:relative}
.hero__title{font-family:var(--serif);font-weight:800;font-size:clamp(38px,5.4vw,66px);line-height:1.03;letter-spacing:-1px;margin:20px 0 20px}
.hero__title em{font-style:italic}
.hero__sub{font-size:clamp(15px,1.5vw,17.5px);color:var(--cream-dim);max-width:540px;margin-bottom:32px}
.hero__sub b{color:var(--cream);font-weight:700}
.hero__actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:15px;padding:15px 26px;border-radius:100px;transition:.25s;cursor:pointer;border:none}
.btn--gold{background:linear-gradient(135deg,var(--gold-soft),var(--gold),var(--gold-deep));color:#2a1a06;box-shadow:0 12px 34px rgba(201,138,31,.4)}
.btn--gold:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(201,138,31,.55)}
.storebtn{display:inline-flex;align-items:center;gap:12px;padding:11px 22px;border-radius:14px;border:1px solid var(--line2);
  background:rgba(255,255,255,.04);transition:.25s}
.storebtn svg{color:var(--cream)}
.storebtn__t small{display:block;font-size:9.5px;letter-spacing:1.5px;color:var(--muted);font-weight:700}
.storebtn__t strong{display:block;font-size:16px;color:var(--cream);font-weight:700;margin-top:1px}
.storebtn--soon{position:relative;cursor:default}
.storebtn--soon::after{content:"SOON";position:absolute;top:-9px;right:-9px;background:var(--gold);color:#2a1a06;font-size:9px;font-weight:800;padding:3px 7px;border-radius:6px;letter-spacing:.5px;box-shadow:0 4px 12px rgba(201,138,31,.5)}
.storebtn--lg{padding:14px 30px}
.hero__trust{display:flex;align-items:center;gap:14px;margin-top:34px;font-size:13.5px;color:var(--cream-dim);max-width:460px}
.hero__trust b{color:var(--gold)}
.avatars{display:flex}
.avatars img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid var(--ink);margin-left:-11px;box-shadow:0 3px 8px rgba(0,0,0,.4)}
.avatars img:first-child{margin-left:0}

/* ---------- PHONE MOCKUP ---------- */
.hero__phone{position:relative;display:flex;justify-content:center;perspective:1600px}
.phone{position:relative;width:300px;height:610px;border-radius:44px;padding:11px;
  background:linear-gradient(160deg,#2c2016,#160f08);
  box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 0 2px rgba(230,180,80,.18),inset 0 0 0 6px #0c0803;
  transform:rotateY(-16deg) rotateX(4deg) rotateZ(1deg);transition:.6s cubic-bezier(.2,.8,.2,1);animation:floaty 6s ease-in-out infinite}
.hero__phone:hover .phone{transform:rotateY(-6deg) rotateX(2deg)}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -16px}}
.phone__notch{position:absolute;top:16px;left:50%;translate:-50% 0;width:120px;height:26px;background:#0c0803;border-radius:0 0 16px 16px;z-index:5}
.phone__screen{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#FAF8F4;color:#1A1208}
.phone--sm{width:270px;height:560px;transform:rotateY(12deg) rotateX(3deg)}
.phone__badge{position:absolute;bottom:60px;left:-6px;background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#2a1a06;
  font-weight:800;font-size:13px;padding:10px 16px;border-radius:12px;box-shadow:0 12px 30px rgba(201,138,31,.5);animation:floaty 6s ease-in-out infinite .8s}

/* app UI inside phone */
.app{padding:20px 15px 0;height:100%;position:relative}
.app__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.app__word{font-family:var(--serif);font-style:italic;font-weight:900;font-size:20px;color:#1A1208;position:relative}
.app__word i{position:absolute;left:1px;right:5px;bottom:-2px;height:2px;background:linear-gradient(90deg,var(--gold),var(--gold-deep))}
.app__bell{font-size:15px}
.app__chips{display:flex;gap:7px;overflow:hidden;margin-bottom:14px}
.chip{font-size:11px;font-weight:600;padding:6px 11px;border-radius:100px;background:#F0EBE1;color:#6B5F52;white-space:nowrap}
.chip--on{background:#1A1208;color:#F4D18A}
.acard{background:#fff;border:1px solid #EDE8DF;border-radius:16px;padding:13px 14px;margin-bottom:11px;box-shadow:0 6px 16px rgba(60,40,20,.05)}
.acard__cat{font-size:10.5px;font-weight:700;color:var(--gold-deep);margin-bottom:5px}
.acard h4{font-size:14.5px;font-weight:700;color:#1A1208;margin-bottom:3px}
.acard p{font-size:11.5px;color:#8A7E6E}
.acard__foot{display:flex;align-items:center;justify-content:space-between;margin-top:11px}
.acard .who{display:flex;align-items:center;gap:6px;font-size:11px;color:#6B5F52;font-weight:600}
.acard .who img{width:22px;height:22px;border-radius:50%;object-fit:cover}
.acard .join{background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#2a1a06;font-size:11.5px;font-weight:800;padding:6px 16px;border-radius:100px}
.acard--ghost{opacity:.5;filter:blur(.4px)}
.app__nav{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-around;padding:9px 6px 12px;background:#fff;border-top:1px solid #EDE8DF;font-size:15px;text-align:center}
.app__nav span{color:#B4A89A;line-height:1.1}
.app__nav small{font-size:8px;font-weight:600}
.app__nav .on{color:#6F4527}
.app__fab{position:absolute;bottom:64px;right:16px;width:48px;height:48px;border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#2a1a06;font-size:26px;font-weight:600;
  display:grid;place-items:center;box-shadow:0 10px 24px rgba(201,138,31,.5)}
/* people screen */
.app--people .people{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.pcard{position:relative;background:#fff;border:1px solid #EDE8DF;border-radius:16px;padding:11px;text-align:center;box-shadow:0 6px 16px rgba(60,40,20,.05)}
.pcard img{width:100%;height:88px;object-fit:cover;border-radius:12px}
.pcard .ver{position:absolute;top:18px;right:18px;background:var(--gold);color:#2a1a06;width:20px;height:20px;border-radius:50%;font-size:11px;font-weight:800;display:grid;place-items:center;border:2px solid #fff}
.pcard b{display:block;font-size:13px;color:#1A1208;margin-top:8px}
.pcard small{font-size:10px;color:#8A7E6E}

/* ---------- MARQUEE ---------- */
.hero__marquee{margin-top:80px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;background:linear-gradient(90deg,rgba(58,36,20,.3),transparent,rgba(58,36,20,.3));-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marq{display:flex;align-items:center;gap:26px;white-space:nowrap;width:max-content;animation:scroll 34s linear infinite}
.marq span{font-family:var(--serif);font-style:italic;font-size:26px;font-weight:700;color:var(--cream);opacity:.85}
.marq i{color:var(--gold);font-size:11px}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ---------- SECTIONS ---------- */
.section{max-width:var(--wrap);margin:0 auto;padding:clamp(70px,10vw,120px) clamp(16px,4vw,44px)}
.section--dark{max-width:none;background:linear-gradient(180deg,#160f08,#1c130a);border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.section--dark>*{max-width:var(--wrap);margin-left:auto;margin-right:auto}
.section__head{text-align:center;max-width:640px;margin:0 auto 56px}
.section__head h2{font-family:var(--serif);font-weight:800;font-size:clamp(30px,4.4vw,50px);line-height:1.08;letter-spacing:-.5px;margin:16px 0 14px}
.section__head p{color:var(--cream-dim);font-size:16px}

/* categories grid */
.grid{display:grid;gap:18px}
.grid--cats{grid-template-columns:repeat(4,1fr)}
.cat{background:linear-gradient(160deg,var(--card),var(--card2));border:1px solid var(--line2);border-radius:20px;padding:26px 22px;transition:.3s}
.cat:hover{transform:translateY(-6px);border-color:var(--line);box-shadow:0 22px 44px rgba(0,0,0,.4)}
.cat__ic{font-size:30px;display:block;margin-bottom:14px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.4))}
.cat h3{font-size:16.5px;font-weight:700;margin-bottom:6px;color:var(--cream)}
.cat p{font-size:13px;color:var(--muted)}

/* steps */
.steps{display:flex;flex-direction:column;gap:20px;max-width:820px;margin:0 auto}
.step{display:flex;align-items:center;gap:26px;background:linear-gradient(120deg,var(--card),transparent);
  border:1px solid var(--line2);border-left:3px solid var(--gold);border-radius:18px;padding:26px 30px;transition:.3s}
.step:hover{background:linear-gradient(120deg,var(--card2),rgba(58,36,20,.2));transform:translateX(8px)}
.step__n{font-family:var(--serif);font-size:44px;font-weight:800;color:var(--gold);opacity:.5;min-width:66px}
.step__body{flex:1}
.step__body h3{font-family:var(--serif);font-size:23px;font-weight:700;margin-bottom:6px}
.step__body p{color:var(--cream-dim);font-size:14.5px}
.step__body b{color:var(--gold)}
.step__ic{font-size:34px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.4))}

/* showcase */
.showcase{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.feat{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--line2)}
.feat:last-child{border-bottom:none}
.feat__ic{font-size:26px;flex-shrink:0;width:52px;height:52px;display:grid;place-items:center;border-radius:14px;
  background:linear-gradient(160deg,var(--card),var(--card2));border:1px solid var(--line)}
.feat h3{font-size:18px;font-weight:700;margin-bottom:5px}
.feat p{font-size:14px;color:var(--cream-dim)}
.showcase__phone{display:flex;justify-content:center;perspective:1500px}

/* SecAug X */
.section--x{max-width:none;background:radial-gradient(ellipse at 30% 0%,#241812,#130d07 70%);border-top:1px solid var(--line);overflow:hidden}
.x-glow{position:absolute;top:-100px;left:20%;width:600px;height:400px;background:radial-gradient(circle,rgba(230,180,80,.18),transparent 65%);filter:blur(30px)}
.x-wrap{position:relative;max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.x-copy h2{font-family:var(--serif);font-weight:800;font-size:clamp(40px,6vw,72px);line-height:1;margin:16px 0 10px}
.x-mark{background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic}
.x-lead{color:var(--cream-dim);font-size:17px;margin-bottom:26px}
.x-list{list-style:none;display:flex;flex-direction:column;gap:14px}
.x-list li{display:flex;align-items:flex-start;gap:12px;font-size:15px;color:var(--cream)}
.x-list li span{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#2a1a06;font-size:12px;font-weight:800;display:grid;place-items:center;margin-top:2px}
.x-list b{color:var(--gold)}
.x-card{position:relative;background:linear-gradient(165deg,#2b1e13,#181009);border:1px solid var(--line);border-radius:26px;padding:38px 34px;text-align:center;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.5)}
.x-card__glow{position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(230,180,80,.2),transparent 60%)}
.x-card__badge{position:relative;display:inline-block;font-weight:800;font-size:13px;letter-spacing:1px;color:var(--gold);border:1px solid var(--line);padding:7px 16px;border-radius:100px;margin-bottom:22px}
.x-card__price{position:relative;font-family:var(--serif);font-weight:800;font-size:74px;line-height:1;color:var(--cream)}
.x-card__price .cur{font-size:34px;vertical-align:super;color:var(--gold)}
.x-card__price small{font-size:17px;font-weight:600;color:var(--muted);margin-left:4px;font-family:var(--sans)}
.x-card__note{position:relative;font-size:12.5px;color:var(--muted);margin:14px 0 22px}
.x-card__cta{position:relative;background:linear-gradient(135deg,var(--gold-soft),var(--gold),var(--gold-deep));color:#2a1a06;font-weight:800;font-size:15px;padding:14px;border-radius:100px;box-shadow:0 14px 30px rgba(201,138,31,.4)}
.x-card__mini{position:relative;margin-top:18px;padding-top:18px;border-top:1px solid var(--line2);font-size:12.5px;color:var(--cream-dim)}
.x-card__mini b{color:var(--gold)}

/* final CTA */
.cta{text-align:center;max-width:680px;margin:0 auto;padding:clamp(80px,12vw,130px) 24px}
.cta__icon{width:88px;height:88px;border-radius:22px;box-shadow:0 20px 50px rgba(0,0,0,.55);margin-bottom:26px}
.cta h2{font-family:var(--serif);font-weight:800;font-size:clamp(32px,5vw,54px);line-height:1.08;margin-bottom:16px}
.cta p{color:var(--cream-dim);font-size:16.5px;margin-bottom:34px;max-width:520px;margin-inline:auto}
.cta .storebtn{margin:0 auto}
.cta__android{display:block;margin-top:20px;font-size:13.5px;color:var(--muted)}

/* footer */
.foot{border-top:1px solid var(--line2);background:#0e0a05;padding:56px clamp(16px,4vw,44px) 30px}
.foot__top{max-width:var(--wrap);margin:0 auto;display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;padding-bottom:34px;border-bottom:1px solid var(--line2)}
.foot__brand p{color:var(--muted);font-size:14px;margin-top:10px;max-width:280px}
.foot__links{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:flex-start;max-width:440px}
.foot__links a{color:var(--cream-dim);font-size:14px;transition:.2s}
.foot__links a:hover{color:var(--gold)}
.foot__bar{max-width:var(--wrap);margin:24px auto 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.foot__bar a{color:var(--gold)}

/* reveal animation */
.reveal{opacity:0;transform:translateY(38px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- LEGAL PAGES ---------- */
.legal{max-width:820px;margin:0 auto;padding:140px clamp(16px,4vw,44px) 80px}
.legal__back{display:inline-flex;align-items:center;gap:8px;color:var(--gold);font-weight:600;font-size:14px;margin-bottom:26px}
.legal h1{font-family:var(--serif);font-weight:800;font-size:clamp(30px,5vw,46px);margin-bottom:8px}
.legal__updated{color:var(--muted);font-size:13.5px;margin-bottom:34px}
.legal h2{font-family:var(--serif);font-size:22px;font-weight:700;color:var(--gold);margin:36px 0 12px}
.legal h3{font-size:16px;font-weight:700;margin:22px 0 8px;color:var(--cream)}
.legal p,.legal li{color:var(--cream-dim);font-size:15px;margin-bottom:12px}
.legal ul{padding-left:22px;margin-bottom:12px}
.legal li{margin-bottom:8px}
.legal a{color:var(--gold);text-decoration:underline}
.legal strong{color:var(--cream)}
.legal__box{background:linear-gradient(160deg,var(--card),var(--card2));border:1px solid var(--line2);border-radius:16px;padding:22px 24px;margin:20px 0}

/* ---------- RESPONSIVE ---------- */
@media(max-width:960px){
  .nav__links{display:none}
  .hero__inner{grid-template-columns:1fr;gap:10px}
  .hero__phone{margin-top:30px}
  .phone{transform:none;animation:floaty 6s ease-in-out infinite}
  .grid--cats{grid-template-columns:1fr 1fr}
  .showcase{grid-template-columns:1fr;gap:40px}
  .x-wrap{grid-template-columns:1fr;gap:40px}
  .pill--android{display:none}
}
@media(max-width:560px){
  .nav__cta .pill--soon{font-size:10.5px;padding:7px 11px}
  .nav__logo{width:32px;height:32px}
  .hero{padding-top:110px}
  .hero__actions{flex-direction:column;align-items:stretch}
  .btn--gold{justify-content:center}
  .storebtn{justify-content:center}
  .grid--cats{grid-template-columns:1fr}
  .step{flex-wrap:wrap;gap:14px;padding:22px}
  .step__n{font-size:34px;min-width:auto}
  .step__ic{display:none}
  .foot__top{flex-direction:column;gap:24px}
}