/* AMINUR RAHAMAN — Modern layer v4 (2026-10-16)
   Loaded AFTER home.css / site.css. Same palette (navy · gold · ivory), premium deep navy #071330 (owner-picked "D"),
   solid colours only (no gradients/shades), modern display type, glass header, lifted cards, readable light-on-navy text. */
:root{
  --navy:#071330; --navy-2:#0E1C38; --navy-3:#13244A;
  --r-card:18px; --r-panel:28px;
  --shadow:0 22px 44px -30px rgba(7,19,48,.55);
  --shadow-lift:0 28px 56px -30px rgba(7,19,48,.6);
  --font-display:"Anek Bangla","Hind Siliguri",system-ui,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ── type ── */
h1,h2,h3,.brand b,.proof-row b,.way h3,.dcard h3{font-family:var(--font-display)}
h1,h2{letter-spacing:0}
h1{font-weight:600}
h2{font-size:clamp(29px,3.6vw,44px);line-height:1.25;font-weight:600}
h3{letter-spacing:0;font-weight:600}
.lead{font-size:clamp(17.5px,1.4vw,19.5px);line-height:1.75}
.eyebrow{font-size:14px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}
.eyebrow::before{width:28px}

/* ── glass header ── */
header.top{background:rgba(247,244,238,.78);-webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid rgba(229,222,208,.7);transition:box-shadow .25s var(--ease),background .25s var(--ease)}
header.top.scrolled{background:rgba(247,244,238,.92);box-shadow:0 10px 30px -22px rgba(7,19,48,.45)}
.nav ul a{position:relative;text-decoration:none}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav ul a:hover::after,.nav ul a:focus-visible::after{transform:scaleX(1)}
.nav .btn{background:var(--navy)}

/* ── hero ── */
.hero{background:var(--ivory)}
.hero h1{font-weight:600;line-height:1.2}
.hero:has(.hero-copy) h1,.hero-copy h1{font-size:clamp(38px,4.4vw,58px)}
.hero h1 em{font-style:normal;color:var(--gold-text)}
.hero:has(.hero-copy) h1 em,.hero-copy h1 em{display:block}
@media (min-width:1041px){.hero-grid{align-items:start}.hero-grid>.system,.hero-grid>*:has(>.system){position:sticky;top:110px}}
.hero:has(.hero-copy) .eyebrow,.hero-copy .eyebrow,.t-hero .eyebrow{font-size:14px;font-weight:700;letter-spacing:2px;color:#fff;background:var(--navy);padding:10px 20px 10px 16px;border-radius:999px;box-shadow:none;text-shadow:none;margin-bottom:26px}
.hero:has(.hero-copy) .eyebrow::before,.hero-copy .eyebrow::before,.t-hero .eyebrow::before{width:9px;height:9px;border-radius:50%;background:var(--gold-soft);box-shadow:0 0 0 4px rgba(217,191,133,.22)}
.hero-copy .paradox{border-radius:var(--r-card);border:1px solid var(--line);border-left:4px solid var(--gold);background:#fff;box-shadow:var(--shadow)}
.system{border-radius:var(--r-panel);background:var(--navy);box-shadow:var(--shadow-lift);outline:1px solid rgba(217,191,133,.28);outline-offset:-10px}
@media (prefers-reduced-motion:no-preference){
  .system{animation:float 7s var(--ease) infinite}
  @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
}

.hero-copy .need{font-family:var(--font-display);font-weight:600;font-size:clamp(19px,1.7vw,22px);color:var(--navy);border-left:3px solid var(--gold);padding-left:14px;margin:22px 0 14px}
.hero:has(.hero-copy) h1,.hero-copy h1{max-width:19ch}

/* ── proof strip: solid navy band, gold numerals ── */
.proof-row{background:var(--navy);border:0;border-radius:var(--r-panel);box-shadow:var(--shadow-lift);overflow:hidden}
.proof-row div{border-color:rgba(255,255,255,.12)!important}
.proof-row b{color:#fff;font-size:clamp(26px,2.6vw,34px);font-weight:600}
.proof-row b em{color:var(--gold-soft)}
.proof-row span{color:#E3E9F3}
.proof-row small{color:#C9D3E3}
@media (min-width:1041px){.proof-row{grid-template-columns:repeat(4,1fr)}.proof-row div{border-bottom:1px solid rgba(255,255,255,.12)}.proof-row div:nth-child(4n){border-right:0}.proof-row div:nth-last-child(-n+4){border-bottom:0}}

/* ── cards: rounder, hairline border, lift on hover ── */
.rc,.ac,.way,.note,.case,.bcard,.op,.step,.cm,.pillar,.dbox,.gcol{border-radius:var(--r-card)}
.rc,.ac,.way,.note,.case,.cm{background:#fff;border:1px solid var(--line);transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s var(--ease)}
@media (hover:hover){
  .rc:hover,.ac:hover,.way:hover,.note:hover,.case:hover,.cm:hover,.bcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-lift);border-color:var(--gold-soft)}
}
.way.feature{border:2px solid var(--gold);box-shadow:var(--shadow-lift)}
.gps-wrap{border-radius:var(--r-panel);box-shadow:var(--shadow-lift)}
.dcard{border-radius:var(--r-card);background:var(--navy)}

/* ── dark bands: one premium navy, readable light text ── */
.dark,footer.site,.dbox.b{background:var(--navy)}
.on-dark .lead,.dark p{color:#E3E9F3}
.dark .foot,.on-dark small{color:#D3DBE8}
.sym-btn{border-radius:14px}
.sym-panel{border-radius:var(--r-panel)}

/* ── buttons ── */
.btn{font-weight:700;letter-spacing:.1px;transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease)}
.btn-primary{background:var(--navy)}
.btn-primary:hover{background:var(--navy-3)}
.btn-gold:hover{box-shadow:0 18px 34px -18px rgba(168,131,58,.8)}
@media (hover:hover){.btn:hover{transform:translateY(-3px)}}

/* ── section rhythm ── */
/* (each page keeps its own section spacing) */
.closing{font-family:var(--font-display);font-weight:500;font-size:clamp(18px,1.6vw,21px)}

/* ── footer ── */
footer.site{color:#D3DBE8}
footer.site h4{color:var(--gold-soft);letter-spacing:1px}
footer.site a{color:#E3E9F3}
footer.site a:hover{color:#fff}

/* ── mobile ── */
@media (max-width:640px){
  .hero:has(.hero-copy) h1,.hero-copy h1{font-size:clamp(34px,10vw,44px)}
  .hero:has(.hero-copy) .eyebrow,.hero-copy .eyebrow{font-size:12px;letter-spacing:1.5px}
  h2{font-size:clamp(26px,7.4vw,34px)}
  .proof-row{border-radius:var(--r-card)}
}