:root{
  --cream:#FBF6EC;
  --cream-deep:#F3E7D2;
  --cream-edge:#EFE1C7;
  --gold:#C9A227;
  --gold-deep:#9C7A1E;
  --gold-light:#E8C766;
  --maroon:#4A2416;
  --maroon-dark:#33170D;
  --ink:#3B2415;
  --ink-soft:#8A7256;
  --radius:16px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Poppins',sans-serif;
  color:var(--ink);
  background:var(--cream);
  overflow-x:hidden;
}
h1,h2,h3,.brand__text{font-family:'Cormorant Garamond',serif;}
em{font-style:italic;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
.arrow{display:inline-block;transition:transform .3s var(--ease);}
a:hover .arrow, .btn:hover .arrow{transform:translateX(4px);}

/* ---------- ticker ---------- */
.ticker{
  background:var(--maroon-dark);
  color:var(--gold-light);
  font-size:.76rem;
  letter-spacing:.03em;
  overflow:hidden;
  white-space:nowrap;
  padding:8px 0;
}
.ticker__track{
  display:inline-flex;
  gap:2.5rem;
  padding-left:100%;
  animation:ticker 52s linear infinite;
  will-change:transform;
}
.ticker__track span{opacity:.9}
@keyframes ticker{
  0%{transform:translateX(0);}
  100%{transform:translateX(-100%);}
}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(251,246,236,.92);
  backdrop-filter:saturate(1.2);
  border-bottom:1px solid var(--cream-edge);
}
.nav__inner{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand__mark{
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(160deg,var(--gold-light),var(--gold-deep));
  color:var(--maroon-dark);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;
}
.brand__text{font-size:1.45rem;font-weight:600;color:var(--maroon);}
.brand__text em{color:var(--gold-deep);}
.nav__links{display:flex;gap:1.8rem;font-size:.9rem;font-weight:500;}
.nav__links a{position:relative;color:var(--ink-soft);transition:color .25s;}
.nav__links a:hover{color:var(--gold-deep);}
.nav__links a::after{
  content:'';position:absolute;left:0;bottom:-6px;width:0;height:2px;
  background:var(--gold);transition:width .25s var(--ease);
}
.nav__links a:hover::after{width:100%;}
.nav__cta{white-space:nowrap;}
.nav__burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:40px;height:40px;border:none;background:none;cursor:pointer;
}
.nav__burger span{width:22px;height:2px;background:var(--maroon);transition:transform .3s var(--ease),opacity .3s;margin:0 auto;}
.nav__burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav__burger.is-open span:nth-child(2){opacity:0;}
.nav__burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav__drawer{
  display:none;flex-direction:column;gap:0;
  max-height:0;overflow:hidden;
  background:var(--cream);border-top:1px solid var(--cream-edge);
  transition:max-height .4s var(--ease);
}
.nav__drawer a{padding:14px 24px;border-bottom:1px solid var(--cream-edge);font-size:.95rem;color:var(--ink);}
.nav__drawer .btn{margin:16px 24px;justify-content:center;}
.nav__drawer.is-open{max-height:520px;}

@media(max-width:860px){
  .nav__links,.nav__cta{display:none;}
  .nav__burger,.nav__drawer{display:flex;}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.85rem 1.6rem;border-radius:999px;
  font-weight:500;font-size:.95rem;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s;
}
.btn--primary{
  background:linear-gradient(120deg,var(--gold),var(--gold-deep));color:#2A1408;
  box-shadow:0 10px 26px -10px rgba(156,122,30,.55);
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(156,122,30,.7);}
.btn--outline{
  background:transparent;color:var(--maroon);
  border:1px solid rgba(74,36,22,.3);
}
.btn--outline:hover{background:rgba(74,36,22,.06);transform:translateY(-2px);}
.btn--ghost{
  background:var(--maroon-dark);color:var(--gold-light);
  padding:.7rem 1.4rem;font-size:.88rem;
}
.btn--ghost:hover{background:var(--maroon);transform:translateY(-2px);}

/* ---------- shared type ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.78rem;letter-spacing:.12em;font-weight:600;
  color:var(--gold-deep);margin-bottom:1rem;
}
.eyebrow--dark{color:var(--gold-deep);}
.eyebrow__dot{width:6px;height:6px;border-radius:50%;background:currentColor;}
.section__head{max-width:640px;margin:0 auto 3rem;text-align:center;}
.section__head h2{font-size:clamp(1.7rem,4vw,2.4rem);font-weight:600;color:var(--maroon);line-height:1.2;}
.section__sub{color:var(--ink-soft);margin-top:.9rem;font-size:1.02rem;line-height:1.6;}

section{padding:clamp(3rem,7vw,5.5rem) 24px;}

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:92vh;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  align-items:center;
  padding:0 24px;
  overflow:hidden;
  color:var(--ink);
}
.hero__bg{
  position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(ellipse at 78% 15%, rgba(201,162,39,.16), transparent 55%),
    radial-gradient(ellipse at 10% 90%, rgba(201,162,39,.12), transparent 50%),
    var(--cream);
}
.hero__arch{
  position:absolute;left:50%;top:8px;transform:translateX(-50%);
  width:min(640px,90vw);height:auto;z-index:-1;opacity:.9;
}
.hero__arch-dots circle{fill:var(--gold);}
.hero__arch-om{font-size:22px;fill:var(--gold-deep);font-family:'Cormorant Garamond',serif;}

.hero__inner{max-width:600px;padding:9rem 0 4rem;}
.hero__title{font-size:clamp(2.2rem,4.6vw,3.4rem);font-weight:600;line-height:1.14;color:var(--maroon);}
.hero__title em{color:var(--gold-deep);}
.hero__sub{margin:1.6rem 0 2.2rem;font-size:1.05rem;line-height:1.7;color:var(--ink-soft);max-width:520px;}
.hero__ctas{display:flex;gap:1rem;flex-wrap:wrap;}

/* ---------- corner om + dot grid motif ---------- */
.corner-om{
  position:absolute;right:6%;top:2%;z-index:2;
  display:flex;flex-direction:column;align-items:flex-end;gap:.4rem;
  animation:float 6s ease-in-out infinite;
}
.corner-om__glyph{font-size:1.5rem;color:var(--gold-deep);line-height:1;}
.dot-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  width:76px;
}
.dot-grid span{width:3px;height:3px;border-radius:50%;background:var(--gold);opacity:.55;}
@keyframes float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-14px);}
}
@keyframes spin-slow{
  from{transform:rotate(0);}
  to{transform:rotate(360deg);}
}

@media(max-width:980px){.corner-om{position:static;align-items:center;margin:1.5rem auto 0;}}

/* ---------- why ---------- */
.why{background:var(--cream);}
.why__inner{max-width:680px;margin:0 auto;text-align:center;}
.why__inner h2{font-size:clamp(1.6rem,3.6vw,2.2rem);color:var(--maroon);font-weight:600;line-height:1.25;margin:.6rem 0 1.1rem;}

.hero__phone{
  position:absolute;right:-40px;top:12%;z-index:1;
  animation:float 6s ease-in-out infinite;
  animation-delay:.4s;
}
.phone{
  width:250px;border-radius:46px;
  background:linear-gradient(165deg,#2a140a,#160a04);
  border:3px solid #0d0603;
  box-shadow:
    0 36px 64px -22px rgba(74,36,22,.4),
    inset 0 0 0 1.5px rgba(255,255,255,.07),
    inset 0 1.5px 3px rgba(255,255,255,.1);
  padding:8px;
}
.phone--sm{width:200px;border-radius:38px;border-width:2.5px;padding:6px;}
.phone__notch{
  width:74px;height:20px;border-radius:12px;background:#000;
  margin:0 auto 6px;position:relative;
}
.phone__notch::after{
  content:'';position:absolute;right:14px;top:50%;translate:0 -50%;
  width:6px;height:6px;border-radius:50%;
  background:#1c1c1c;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.phone--sm .phone__notch{width:52px;height:14px;border-radius:8px;margin-bottom:5px;}
.phone--sm .phone__notch::after{width:4px;height:4px;right:9px;}
.phone__screen{
  background:var(--cream);border-radius:38px;
  padding:1.1rem .9rem;color:var(--ink);min-height:190px;
}
.phone--sm .phone__screen{padding:.85rem .7rem;min-height:190px;max-height:190px;overflow:hidden;border-radius:32px;}
.phone__date{font-size:.62rem;color:var(--ink-soft);letter-spacing:.03em;text-transform:uppercase;}
.phone__tithi{font-size:1.05rem;margin:.35rem 0 .8rem;color:var(--maroon);font-weight:600;}
.phone--sm .phone__tithi{font-size:.9rem;}
.phone__grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem .5rem;}
.phone__grid div{background:var(--cream-deep);border-radius:10px;padding:.5rem .55rem;}
.phone__grid span{display:block;font-size:.58rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;}
.phone__grid strong{font-size:.72rem;color:var(--maroon);}
.phone__chip{
  margin-top:.8rem;background:linear-gradient(120deg,var(--gold),var(--gold-deep));color:#2A1408;
  font-size:.66rem;text-align:center;padding:.5rem;border-radius:10px;font-weight:600;
}
.phone__chip--ghost{background:var(--cream-deep);color:var(--maroon);}

.phone__row{
  display:flex;align-items:center;gap:.5rem;
  background:var(--cream-deep);border-radius:10px;
  padding:.55rem .6rem;margin-top:.5rem;font-size:.7rem;color:var(--ink);
}
.phone__row:first-of-type{margin-top:.9rem;}
.phone__row--active{background:linear-gradient(120deg,var(--gold-light),var(--gold));color:#2A1408;font-weight:600;}

.phone__screen--verse{display:flex;flex-direction:column;justify-content:center;text-align:center;gap:.7rem;min-height:230px;}
.phone__verse-te{font-size:.95rem;color:var(--maroon);line-height:1.5;}
.phone__verse-en{font-size:.68rem;color:var(--ink-soft);font-style:italic;}

.phone__map{
  position:relative;margin-top:.8rem;height:150px;border-radius:12px;
  background:
    repeating-linear-gradient(0deg, rgba(201,162,39,.12) 0 1px, transparent 1px 20px),
    repeating-linear-gradient(90deg, rgba(201,162,39,.12) 0 1px, transparent 1px 20px),
    var(--cream-deep);
  overflow:hidden;
}
.phone__pin{
  position:absolute;width:10px;height:10px;border-radius:50% 50% 50% 0;
  background:var(--gold-deep);transform:rotate(-45deg);
  left:45%;top:45%;
}
.phone__pin--you{
  background:var(--maroon);width:12px;height:12px;left:47%;top:22%;
  box-shadow:0 0 0 5px rgba(74,36,22,.18);
}

@media(max-width:980px){
  .hero{grid-template-columns:1fr;padding-top:2rem;}
  .hero__inner{padding:7.5rem 0 2rem;max-width:100%;text-align:center;margin:0 auto;}
  .hero__ctas{justify-content:center;}
  .hero__sub{margin-left:auto;margin-right:auto;}
  .hero__title{font-size:clamp(2rem,7vw,2.6rem);}
  .hero__phone{position:static;margin:2rem auto 0;animation:none;}
  .hero__medallion{position:static;margin:1.5rem auto 0;}
}

/* ---------- panchangam ---------- */
.panchangam{background:var(--cream-deep);}
.panch__cards{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;
}
.panch__card{
  background:#fff;border-radius:var(--radius);
  padding:1.4rem 1rem;text-align:center;
  border:1px solid var(--cream-edge);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.panch__card:hover{transform:translateY(-6px);box-shadow:0 20px 34px -18px rgba(156,122,30,.35);}
.panch__icon{font-size:1.6rem;display:block;margin-bottom:.6rem;}
.panch__label{display:block;font-size:.68rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.35rem;}
.panch__card strong{font-size:.92rem;color:var(--maroon);}

@media(max-width:980px){.panch__cards{grid-template-columns:repeat(3,1fr);}}
@media(max-width:560px){.panch__cards{grid-template-columns:repeat(2,1fr);gap:.7rem;}}

/* ---------- learn ---------- */
.learn__grid{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;
}
.learn__card{
  background:linear-gradient(165deg,#fff,var(--cream-deep));
  border-radius:20px;padding:2rem 1.7rem;
  border:1px solid var(--cream-edge);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.learn__card:hover{transform:translateY(-8px);box-shadow:0 26px 40px -22px rgba(156,122,30,.35);}
.learn__card--wide{grid-column:span 3;display:flex;align-items:center;gap:1.6rem;background:linear-gradient(120deg,var(--maroon-dark),var(--maroon));color:var(--cream);}
.learn__card.learn__card--wide h3{color:#fff;font-weight:700;}
.learn__card.learn__card--wide .learn__link{color:var(--gold-light);}
.learn__card.learn__card--wide p{color:rgba(251,246,236,.85);}
.learn__glyph{font-size:2rem;margin-bottom:1rem;}
.learn__card--wide .learn__glyph{margin-bottom:0;font-size:2.6rem;}
.learn__card h3{font-size:1.35rem;font-weight:600;margin-bottom:.6rem;color:var(--maroon);}
.learn__card p{color:var(--ink-soft);font-size:.92rem;line-height:1.6;}
.learn__link{display:inline-flex;align-items:center;gap:6px;margin-top:1rem;font-size:.88rem;font-weight:600;color:var(--gold-deep);}

@media(max-width:900px){
  .learn__grid{grid-template-columns:1fr 1fr;}
  .learn__card--wide{grid-column:span 2;flex-direction:column;align-items:flex-start;}
}
@media(max-width:600px){
  .learn__grid{grid-template-columns:1fr;}
  .learn__card--wide{grid-column:span 1;}
}

/* ---------- app screens: orbit showcase ---------- */
.screens{background:var(--cream);overflow:hidden;}
.screens__orbit{
  position:relative;
  width:min(800px, calc(100vw - 48px));aspect-ratio:1/1;
  margin:3rem auto 0;
  --dur:56s;
  --radius:260px;
}
.screens__center{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:.6rem;z-index:1;
}
.dot-grid--center{width:96px;grid-template-columns:repeat(6,1fr);gap:9px;justify-content:center;opacity:.7;}
.screens__center-om{
  font-size:1.8rem;color:var(--gold-deep);opacity:.9;display:inline-block;
}
.screens__ring{
  position:absolute;inset:0;
  animation:orbitSpin var(--dur) linear infinite;
}
.screens__orbit:hover .screens__ring,
.screens__orbit:hover .screens__phone-wrap{animation-play-state:paused;}
.screens__slot{
  position:absolute;top:50%;left:50%;width:0;height:0;
  transform:rotate(var(--angle)) translateX(var(--radius));
}
.screens__phone-wrap{
  position:relative;display:inline-block;text-align:center;
  transform:translate(-50%,-50%) rotate(calc(-1 * var(--angle)));
  animation:counterSpin var(--dur) linear infinite;
}
.screens__phone-wrap:hover{z-index:5;}
.screens__phone-wrap .phone{margin:0 auto;transition:box-shadow .4s var(--ease),transform .4s var(--ease);}
.screens__phone-wrap:hover .phone{box-shadow:0 34px 60px -18px rgba(156,122,30,.55);transform:scale(1.06);}
.screens__label{
  position:absolute;top:100%;left:50%;
  transform:translateX(-50%);
  margin-top:.85rem;white-space:nowrap;
  font-size:.82rem;color:var(--ink-soft);font-weight:500;
}

@keyframes orbitSpin{
  from{transform:rotate(0deg);}
  to{transform:rotate(360deg);}
}
@keyframes counterSpin{
  from{transform:translate(-50%,-50%) rotate(calc(-1 * var(--angle)));}
  to{transform:translate(-50%,-50%) rotate(calc(-1 * var(--angle) - 360deg));}
}

@media(prefers-reduced-motion:reduce){
  .screens__ring,.screens__phone-wrap{animation:none;}
  .screens__phone-wrap{transform:translate(-50%,-50%) rotate(calc(-1 * var(--angle)));}
}

@media(max-width:980px){
  .screens__orbit{--radius:210px;width:min(700px, calc(100vw - 48px));}
}
@media(max-width:680px){
  .screens__orbit{--radius:190px;--dur:42s;width:min(640px, calc(100vw - 48px));}
  .phone--sm{width:150px;border-width:2.5px;border-radius:30px;}
  .phone--sm .phone__notch{width:44px;height:12px;border-radius:7px;}
  .phone--sm .phone__screen{padding:.7rem .6rem;min-height:190px;max-height:190px;border-radius:25px;}
  .screens__label{font-size:.76rem;}
  .dot-grid--center{width:76px;}
  .screens__center-om{font-size:1.5rem;}
}
@media(max-width:460px){
  .screens__orbit{--radius:98px;--dur:36s;width:min(400px, calc(100vw - 48px));}
  .phone--sm{width:86px;padding:5px;border-width:2px;border-radius:20px;}
  .phone--sm .phone__notch{width:26px;height:8px;border-radius:5px;margin-bottom:3px;}
  .phone--sm .phone__notch::after{width:3px;height:3px;right:5px;}
  .phone--sm .phone__screen{padding:.34rem .3rem;min-height:80px;max-height:80px;border-radius:15px;}
  .phone--sm .phone__tithi{font-size:.64rem;margin-bottom:.3rem;}
  .phone--sm .phone__date{font-size:.44rem;}
  .phone__grid{gap:.3rem;}
  .phone__grid div{padding:.35rem .4rem;}
  .phone__grid span{font-size:.4rem;}
  .phone__grid strong{font-size:.52rem;}
  .phone__row{font-size:.48rem;padding:.32rem .4rem;margin-top:.3rem;}
  .phone__row:first-of-type{margin-top:.5rem;}
  .phone__verse-te{font-size:.62rem;}
  .phone__verse-en{font-size:.46rem;}
  .phone__chip{font-size:.44rem;padding:.3rem;margin-top:.4rem;}
  .phone__map{height:38px;margin-top:.3rem;}
  .screens__label{font-size:.66rem;margin-top:.55rem;}
  .dot-grid--center{width:56px;gap:5px;}
  .screens__center-om{font-size:1.1rem;}
}

/* ---------- features ---------- */
.features{background:var(--maroon-dark);color:var(--cream);}
.features .section__head h2{color:#fff;}
.features .section__sub{color:rgba(251,246,236,.75);}
.features__grid{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;
}
.feature{
  background:rgba(251,246,236,.05);
  border:1px solid rgba(251,246,236,.12);
  border-radius:18px;padding:1.8rem 1.4rem;
  transition:transform .35s var(--ease),background .35s;
}
.feature:hover{transform:translateY(-6px);background:rgba(251,246,236,.09);}
.feature__icon{font-size:1.8rem;margin-bottom:.8rem;}
.feature h3{font-family:'Cormorant Garamond',serif;font-size:1.25rem;margin-bottom:.5rem;color:var(--gold-light);}
.feature p{font-size:.88rem;color:rgba(251,246,236,.75);line-height:1.6;}

@media(max-width:900px){.features__grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.features__grid{grid-template-columns:1fr;}}

/* ---------- how it works ---------- */
.how__steps{
  max-width:1000px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;
  position:relative;
}
.how__step{text-align:center;padding:0 1rem;}
.how__num{
  display:inline-block;font-family:'Cormorant Garamond',serif;
  font-size:2.6rem;color:var(--gold);font-weight:600;
}
.how__step h3{margin:.6rem 0 .5rem;font-size:1.3rem;color:var(--maroon);}
.how__step p{color:var(--ink-soft);font-size:.92rem;line-height:1.6;}

@media(max-width:780px){.how__steps{grid-template-columns:1fr;gap:2.4rem;}}

/* ---------- quote ---------- */
.quote{
  background:linear-gradient(120deg,var(--maroon),var(--maroon-dark));
  text-align:center;color:#fff;padding:5rem 24px;
}
.quote__mark{font-family:'Cormorant Garamond',serif;font-size:4rem;color:var(--gold-light);line-height:0;}
.quote__text{
  max-width:640px;margin:1.2rem auto 0;
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:clamp(1.3rem,3vw,1.7rem);line-height:1.5;
}

/* ==========================================================
   INSTALL GUIDE — realistic phone mockups, auto-cycling steps
   ========================================================== */
.ig{background:var(--cream);}
.ig:target .ig__head{animation:igGlow 1.8s var(--ease);border-radius:24px;}
@keyframes igGlow{
  0%{box-shadow:0 0 0 0 rgba(201,162,39,.5);}
  55%{box-shadow:0 0 50px 18px rgba(201,162,39,.28);}
  100%{box-shadow:0 0 0 0 rgba(201,162,39,0);}
}
.ig__head{max-width:640px;margin:0 auto 2.4rem;text-align:center;}
.ig__head h2{
  font-family:'Poppins',sans-serif;
  font-size:clamp(1.9rem,4.2vw,2.6rem);font-weight:700;
  color:var(--ink);line-height:1.2;
}
.ig__head .section__sub{max-width:520px;margin-left:auto;margin-right:auto;}

.ig__tabs{
  max-width:400px;margin:0 auto 2.8rem;
  display:flex;gap:.3rem;
  background:var(--cream-edge);padding:.3rem;border-radius:999px;
}
.ig__tab{
  flex:1;padding:.65rem 1.2rem;border-radius:999px;border:none;
  background:transparent;color:var(--ink-soft);
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.88rem;
  cursor:pointer;transition:background .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease);
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
}
.ig__tab-icon{flex-shrink:0;display:inline-flex;}
.ig__tab--active{
  background:#241a14;color:#fff;
  box-shadow:0 8px 18px -8px rgba(0,0,0,.4);
}

.ig__subtabs{
  max-width:260px;margin:-1.6rem auto 2.2rem;
  display:none;gap:.25rem;
  background:transparent;padding:0;border-radius:999px;
}
.ig__subtabs--visible{display:flex;}
.ig__subtab{
  flex:1;padding:.4rem .9rem;border-radius:999px;
  border:1px solid var(--cream-edge);background:transparent;color:var(--ink-soft);
  font-family:'Poppins',sans-serif;font-weight:600;font-size:.76rem;
  cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
  display:inline-flex;align-items:center;justify-content:center;gap:.35rem;
}
.ig__subtab-icon{flex-shrink:0;display:inline-flex;}
.ig__subtab--active{
  background:var(--cream-edge);color:var(--ink);border-color:transparent;
}

.ig__body{
  max-width:980px;margin:0 auto;
  display:grid;grid-template-columns:1fr auto;gap:3rem;align-items:start;
}

.ig__steps{display:flex;flex-direction:column;gap:.25rem;}
.ig__step{
  display:flex;gap:1rem;padding:1rem 1.1rem;border-radius:16px;
  cursor:pointer;border:1px solid transparent;background:transparent;
  transition:background .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease),transform .4s var(--ease);
  text-align:left;width:100%;
}
.ig__step:hover{background:rgba(74,36,22,.03);}
.ig__step--active{
  background:#fff;border-color:var(--cream-edge);
  box-shadow:0 16px 32px -20px rgba(74,36,22,.3);
}
.ig__step-num{
  flex-shrink:0;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;font-weight:700;
  background:var(--cream-edge);color:var(--ink-soft);
  transition:background .4s var(--ease),color .4s var(--ease),box-shadow .4s var(--ease);
}
.ig__step--active .ig__step-num{
  background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#fff;
  box-shadow:0 6px 14px -4px rgba(156,122,30,.55);
}
.ig__step-body h4{font-size:1rem;font-weight:700;color:var(--ink);margin-bottom:.25rem;}
.ig__step-body p{font-size:.85rem;color:var(--ink-soft);line-height:1.55;}

.ig__phone-wrap{display:flex;justify-content:center;}
.ig__phone{
  position:relative;width:260px;height:540px;
  border-radius:56px;border:10px solid #150d08;
  background:linear-gradient(160deg,#2a1c12,#150d08);
  box-shadow:
    0 50px 100px -30px rgba(0,0,0,.55),
    inset 0 0 0 2px rgba(255,255,255,.06);
  padding:8px;
}
.ig__island{
  position:absolute;top:20px;left:50%;transform:translateX(-50%);
  width:88px;height:26px;background:#000;border-radius:16px;z-index:6;
  transition:width .3s var(--ease),height .3s var(--ease),border-radius .3s var(--ease),top .3s var(--ease);
}

/* Android phone frame — punch-hole camera, squarer corners, no dynamic island */
.ig__phone--android{
  border-radius:34px;
  background:linear-gradient(160deg,#333,#111);
}
.ig__phone--android .ig__screen{border-radius:24px;}
.ig__phone--android .ig__island{
  width:12px;height:12px;border-radius:50%;top:14px;
}
.ig__screen{
  position:relative;width:100%;height:100%;border-radius:46px;
  overflow:hidden;background:#fdfaf5;
}
.ig__screen--dark{background:linear-gradient(165deg,#3d2c1c,#1c130c);}

.ig__screen-inner{position:absolute;inset:0;animation:igScreenFade .45s var(--ease);}

/* address bar (Safari / Chrome) */
.ig__addressbar{
  position:absolute;top:44px;left:12px;right:12px;
  display:flex;align-items:center;gap:.5rem;
  background:var(--cream-edge);padding:.55rem .8rem;border-radius:12px;
  font-size:.62rem;font-weight:600;color:var(--ink);
}
.ig__addressbar .ig__dot{width:7px;height:7px;border-radius:50%;background:#b8a888;flex-shrink:0;}
.ig__addressbar .ig__url{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ig__addressbar .ig__share{font-size:.85rem;flex-shrink:0;}
.ig__addressbar .ig__more-inline{font-size:.8rem;color:var(--ink-soft);flex-shrink:0;}
.ig__addressbar .ig__share--active{
  animation:igPulseRing 1.3s ease-out infinite;
  border-radius:6px;
}

/* Safari bottom toolbar */
.ig__toolbar{
  position:absolute;bottom:14px;left:14px;right:14px;
  display:flex;justify-content:space-between;align-items:center;
  color:#a89a86;font-size:.95rem;
}

/* Safari bottom address bar + ••• menu button */
.ig__bottombar{
  position:absolute;bottom:14px;left:12px;right:12px;
  display:flex;align-items:center;gap:.5rem;
}
.ig__addresspill{
  flex:1;min-width:0;display:flex;align-items:center;gap:.5rem;
  background:var(--cream-edge);padding:.55rem .8rem;border-radius:12px;
  font-size:.62rem;font-weight:600;color:var(--ink);
}
.ig__addresspill .ig__url{
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.ig__more{
  width:26px;height:26px;border-radius:8px;background:var(--cream-edge);
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;color:var(--ink);flex-shrink:0;
}
.ig__more.ig__share--active{
  animation:igPulseRing 1.3s ease-out infinite;
  border-radius:6px;
}

/* share sheet */
.ig__sheet{
  position:absolute;left:8px;right:8px;bottom:8px;
  background:#fff;border-radius:20px 20px 18px 18px;
  box-shadow:0 -12px 30px rgba(0,0,0,.15);
  padding:.7rem .6rem .9rem;
  animation:igSheetUp .45s var(--ease);
}
.ig__sheet-handle{width:34px;height:4px;background:#e0d8c8;border-radius:2px;margin:0 auto .6rem;}
.ig__sheet-row{
  display:flex;align-items:center;gap:.6rem;padding:.5rem .5rem;border-radius:10px;
  font-size:.7rem;font-weight:600;color:#a89a86;
}
.ig__sheet-row--active{
  background:linear-gradient(135deg,#fdf3dd,#f8e6bc);color:var(--maroon);
}
.ig__sheet-row .ig__ico{
  width:22px;height:22px;border-radius:6px;background:#f0e9db;
  display:flex;align-items:center;justify-content:center;font-size:.72rem;flex-shrink:0;
}
.ig__sheet-row--active .ig__ico{background:var(--gold-deep);color:#fff;}

/* add-to-home confirm dialog */
.ig__confirm{
  position:absolute;top:44px;left:10px;right:10px;
  background:#fff;border-radius:16px;box-shadow:0 14px 34px rgba(0,0,0,.18);
  padding:.7rem .8rem;animation:igConfirmDrop .45s var(--ease);
}
.ig__confirm-top{
  display:flex;justify-content:space-between;align-items:center;gap:.4rem;
  font-size:.66rem;font-weight:700;color:var(--ink-soft);margin-bottom:.55rem;
}
.ig__confirm-top span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ig__confirm-top .ig__add{color:var(--gold-deep);flex-shrink:0;}
.ig__confirm-row{display:flex;align-items:center;gap:.6rem;min-width:0;}
.ig__confirm-row .ig__ico{
  width:32px;height:32px;border-radius:9px;flex-shrink:0;
  background:linear-gradient(135deg,var(--gold-light),var(--gold-deep));color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;
}
.ig__confirm-row .ig__txt{min-width:0;}
.ig__confirm-row .ig__txt strong{display:block;font-size:.74rem;color:var(--ink);}
.ig__confirm-row .ig__txt span{
  display:block;font-size:.6rem;color:var(--ink-soft);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* android install prompt */
.ig__prompt{
  position:absolute;left:18px;right:18px;bottom:60px;
  background:#fff;border-radius:16px;box-shadow:0 14px 34px rgba(0,0,0,.18);
  padding:1rem;text-align:center;animation:igPromptPop .45s var(--ease);
}
.ig__prompt-icon{font-size:1.3rem;margin-bottom:.4rem;}
.ig__prompt-title{font-size:.78rem;font-weight:700;color:var(--ink);margin-bottom:.7rem;}
.ig__prompt-actions{display:flex;flex-direction:column;gap:.4rem;}
.ig__prompt-btn{padding:.55rem;border-radius:9px;border:none;font-size:.7rem;font-weight:700;}
.ig__prompt-btn--primary{background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:#fff;}
.ig__prompt-btn--ghost{background:var(--cream-edge);color:var(--ink-soft);}

/* home screen (final installed state) */
.ig__home{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.55rem;text-align:center;
  padding:0 1.6rem;
}
.ig__home-icon{
  width:60px;height:60px;border-radius:18px;
  background:linear-gradient(150deg,var(--gold-light),var(--gold-deep));color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.7rem;font-weight:700;
  box-shadow:0 16px 32px -10px rgba(0,0,0,.35);
  animation:igIconDrop .55s var(--ease);
}
.ig__home-name{font-weight:700;color:var(--ink);font-size:.9rem;}
.ig__home-tag{font-size:.7rem;color:var(--ink-soft);}
.ig__home-indicator{
  position:absolute;bottom:12px;left:50%;transform:translateX(-50%);
  width:104px;height:4px;border-radius:2px;background:rgba(0,0,0,.18);
}
.ig__home-indicator--dark{background:rgba(255,255,255,.35);}

.ig__android-grid{
  position:absolute;top:44px;left:50%;transform:translateX(-50%);
  display:flex;gap:.6rem;
}
.ig__android-grid span{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.14);}
.ig__android-caption{
  position:absolute;bottom:32px;left:0;right:0;text-align:center;
  color:#fff;font-weight:700;font-size:.76rem;
}

/* cta row */
.ig__cta{
  max-width:900px;margin:3rem auto 0;
  display:flex;align-items:center;justify-content:center;gap:1.2rem;flex-wrap:wrap;
}
.ig__open-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:#241a14;color:#fff;padding:.9rem 1.7rem;border-radius:999px;
  font-weight:600;font-size:.95rem;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.ig__open-btn:hover{transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(0,0,0,.45);}
.ig__cta-note{color:var(--ink-soft);font-size:.85rem;}

/* animations */
@keyframes igScreenFade{from{opacity:0;transform:scale(.98);}to{opacity:1;transform:scale(1);}}
@keyframes igSheetUp{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:translateY(0);}}
@keyframes igConfirmDrop{from{opacity:0;transform:translateY(-14px);}to{opacity:1;transform:translateY(0);}}
@keyframes igPromptPop{from{opacity:0;transform:scale(.92) translateY(8px);}to{opacity:1;transform:scale(1) translateY(0);}}
@keyframes igIconDrop{
  0%{opacity:0;transform:scale(.6) translateY(-12px);}
  60%{transform:scale(1.06) translateY(0);}
  100%{opacity:1;transform:scale(1);}
}
@keyframes igPulseRing{
  0%{filter:drop-shadow(0 0 0 rgba(156,122,30,.7));}
  70%{filter:drop-shadow(0 0 7px rgba(156,122,30,0));}
  100%{filter:drop-shadow(0 0 0 rgba(156,122,30,0));}
}

@media(prefers-reduced-motion:reduce){
  .ig__screen-inner,.ig__sheet,.ig__confirm,.ig__prompt,.ig__home-icon{animation:none;}
  .ig__addressbar .ig__share--active{animation:none;}
}

/* ---------- download ---------- */
.download{background:var(--cream-deep);text-align:center;}
.download__inner{max-width:600px;margin:0 auto;}
.download h2{font-size:clamp(1.8rem,4vw,2.3rem);color:var(--maroon);margin-bottom:.6rem;}
.download .hero__ctas{justify-content:center;margin-top:1.8rem;}

.cta-pulse{animation:ctaPulse 1.6s var(--ease);}
@keyframes ctaPulse{
  0%,100%{box-shadow:0 10px 26px -10px rgba(156,122,30,.55);}
  30%{box-shadow:0 0 0 10px rgba(201,162,39,.35),0 10px 26px -10px rgba(156,122,30,.55);}
}
.download__note{margin-top:1rem;font-size:.82rem;color:var(--ink-soft);}

/* ---------- footer ---------- */
.footer{background:var(--maroon-dark);color:rgba(251,246,236,.7);padding:3rem 24px 2rem;text-align:center;}
.brand--footer{justify-content:center;margin-bottom:.6rem;}
.brand--footer .brand__text{color:#fff;}
.footer p{font-size:.85rem;margin-top:.3rem;}
.footer__copy{margin-top:1.2rem;font-size:.75rem;opacity:.6;}

/* ---------- reveal animation ---------- */
.reveal{
  opacity:0;transform:translateY(28px);
  transition:opacity .8s var(--ease),transform .8s var(--ease);
}
.reveal.is-visible{opacity:1;transform:translateY(0);}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .ticker__track,.medallion--spin,.medallion--spin span,.hero__phone{animation:none;}
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ---------- responsive: install guide ---------- */
@media(max-width:900px){
  .ig__body{grid-template-columns:1fr;justify-items:center;}
  .ig__steps{width:100%;max-width:480px;}
  .ig__phone-wrap{margin-top:2rem;}
}
@media(max-width:560px){
  .ig__phone{width:220px;height:460px;border-radius:46px;}
  .ig__island{width:70px;height:20px;top:16px;}
  .ig__tabs{max-width:320px;}
  .ig__tab{padding:.55rem 1rem;font-size:.8rem;}
  .ig__step{padding:.8rem;gap:.8rem;}
  .ig__step-num{width:30px;height:30px;font-size:.78rem;}
  .ig__step-body h4{font-size:.92rem;}
  .ig__step-body p{font-size:.8rem;}
  .ig__cta{flex-direction:column;gap:.7rem;}
}

/* ---------- small-screen global guards ---------- */
@media(max-width:420px){
  .hero__ctas{flex-direction:column;align-items:stretch;}
  .hero__ctas .btn{justify-content:center;}
}