/*====================================================
  DR. IMRANKHAN NAGORI
  PREMIUM DESIGN SYSTEM V1
====================================================*/

:root{

--primary:#C8A053;
--primary-dark:#A57C2A;
--secondary:#07111F;
--dark:#03060B;
--dark-2:#0B1523;
--dark-3:#131F31;

--white:#FFFFFF;
--light:#F8F8F8;
--muted:#C8CDD6;

--success:#14B86A;
--danger:#E04545;

--radius-xs:8px;
--radius-sm:12px;
--radius-md:18px;
--radius-lg:28px;
--radius-xl:42px;

--shadow-sm:
0 8px 20px rgba(0,0,0,.08);

--shadow:
0 20px 50px rgba(0,0,0,.15);

--shadow-lg:
0 35px 80px rgba(0,0,0,.35);

--transition:.35s ease;

--container:1280px;

}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{

scroll-behavior:smooth;

}

body{

font-family:
Inter,
Poppins,
Segoe UI,
sans-serif;

font-size:16px;

line-height:1.7;

color:#111;

background:#fff;

overflow-x:hidden;

-webkit-font-smoothing:antialiased;

}

img{

display:block;

max-width:100%;

height:auto;

}

a{

text-decoration:none;

transition:var(--transition);

color:inherit;

}

button{

cursor:pointer;

font-family:inherit;

transition:var(--transition);

}

input,
textarea,
select{

font-family:inherit;

outline:none;

}

.container{

width:min(100% - 40px,var(--container));

margin:auto;

}

.section{

padding:110px 0;

}

.section-sm{

padding:70px 0;

}

.text-center{

text-align:center;

}

.eyebrow{

display:inline-flex;

align-items:center;

padding:8px 16px;

border-radius:40px;

background:#fff2;

backdrop-filter:blur(16px);

border:1px solid rgba(255,255,255,.12);

font-size:13px;

font-weight:700;

letter-spacing:.12em;

text-transform:uppercase;

color:var(--primary);

margin-bottom:22px;

}

h1{

font-size:68px;

line-height:1.02;

font-weight:800;

}

h2{

font-size:46px;

line-height:1.15;

font-weight:800;

}

h3{

font-size:28px;

font-weight:700;

}

p{

color:#596171;

}

.btn{

display:inline-flex;

align-items:center;

justify-content:center;

gap:10px;

height:58px;

padding:0 34px;

border-radius:14px;

font-weight:700;

transition:var(--transition);

border:none;

}

.btn:hover{

transform:translateY(-2px);

}

.btn-gold{

background:linear-gradient(
135deg,
#D8B36A,
#B88934
);

color:#fff;

box-shadow:
0 16px 35px
rgba(200,160,83,.35);

}

.btn-gold:hover{

background:linear-gradient(
135deg,
#E2C27D,
#C6943E
);

}

.btn-white{

background:#fff;

color:#111;

}

.btn-white:hover{

background:#f3f3f3;

}

.btn-outline{

border:2px solid var(--primary);

color:var(--primary);

background:transparent;

}

.btn-outline:hover{

background:var(--primary);

color:#fff;

}
/*====================================================
 PREMIUM NAVBAR
====================================================*/

.site-header{

position:fixed;

top:0;

left:0;

right:0;

z-index:1000;

background:rgba(3,6,11,.78);

backdrop-filter:blur(20px);

border-bottom:1px solid rgba(255,255,255,.05);

transition:.35s;

}

.site-header.scrolled{

background:rgba(3,6,11,.96);

box-shadow:0 20px 45px rgba(0,0,0,.30);

}

.navbar{

height:82px;

display:flex;

align-items:center;

justify-content:space-between;

}

.logo{

display:flex;

align-items:center;

gap:14px;

font-size:26px;

font-weight:800;

color:#fff;

}

.logo span{

color:var(--primary);

}

.nav-links{

display:flex;

gap:34px;

align-items:center;

}

.nav-links a{

font-size:15px;

font-weight:600;

color:#D9DEE7;

position:relative;

}

.nav-links a:hover{

color:#fff;

}

.nav-links a::after{

content:"";

position:absolute;

left:0;

bottom:-8px;

width:0;

height:2px;

background:var(--primary);

transition:.3s;

}

.nav-links a:hover::after{

width:100%;

}

/*====================================================
 HERO
====================================================*/

.asa-hero{

position:relative;

overflow:hidden;

padding:130px 0 90px;

min-height:920px;

display:flex;

align-items:center;

background:

radial-gradient(circle at top right,

#D0A75B 0%,

#07111F 32%,

#03060B 100%);

}

.asa-hero::before{

content:"";

position:absolute;

inset:0;

background:

url("../images/webinar-bg.jpg")

center center/cover;

opacity:.16;

}

.asa-hero::after{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(

90deg,

rgba(3,6,11,.95),

rgba(3,6,11,.72),

rgba(3,6,11,.20)

);

}

.asa-hero-grid{

position:relative;

z-index:3;

display:grid;

grid-template-columns:

1.05fr

.75fr

430px;

align-items:center;

gap:55px;

}

/*====================================================
 HERO LEFT
====================================================*/

.asa-live{

display:inline-flex;

align-items:center;

gap:10px;

padding:12px 20px;

border-radius:40px;

background:rgba(255,255,255,.10);

border:1px solid rgba(255,255,255,.10);

backdrop-filter:blur(18px);

color:#fff;

font-weight:700;

margin-bottom:28px;

}

.asa-live::before{

content:"";

width:10px;

height:10px;

background:#19D65F;

border-radius:50%;

animation:pulse 2s infinite;

}

.asa-hero-copy h1{

font-size:76px;

font-weight:900;

line-height:.95;

color:#fff;

margin-bottom:20px;

}

.asa-hero-copy h1 span{

display:block;

color:var(--primary);

}

.asa-sub{

font-size:21px;

line-height:1.9;

color:#D4D8DF;

max-width:650px;

margin-bottom:38px;

}

.asa-hero-actions{

display:flex;

gap:18px;

margin-bottom:35px;

flex-wrap:wrap;

}

/*====================================================
 TRUST CHIPS
====================================================*/

.asa-trust-row{

display:flex;

flex-wrap:wrap;

gap:14px;

}

.asa-trust-row span{

display:flex;

align-items:center;

gap:10px;

padding:12px 20px;

border-radius:40px;

background:rgba(255,255,255,.09);

border:1px solid rgba(255,255,255,.08);

backdrop-filter:blur(20px);

color:#fff;

font-weight:600;

}

/*====================================================
 HERO IMAGE
====================================================*/

.asa-hero-person{

position:relative;

display:flex;

justify-content:center;

align-items:flex-end;

}

.asa-hero-person img{

width:620px;

max-width:none;

filter:

drop-shadow(

0 45px 70px

rgba(0,0,0,.45)

);

animation:floatImage 6s ease-in-out infinite;

}

/*====================================================
 FLOATING LABELS
====================================================*/

.hero-floating{

position:absolute;

padding:15px 22px;

background:#fff;

border-radius:18px;

font-weight:700;

font-size:15px;

box-shadow:

0 20px 45px rgba(0,0,0,.20);

}

.hero-floating.one{

left:-20px;

top:90px;

}

.hero-floating.two{

right:-10px;

top:190px;

}

.hero-floating.three{

left:20px;

bottom:120px;

}

.hero-floating.four{

right:30px;

bottom:35px;

}

/*====================================================
 REGISTRATION CARD
====================================================*/

.asa-register-card{

position:relative;

background:

rgba(255,255,255,.10);

border:1px solid rgba(255,255,255,.18);

backdrop-filter:blur(25px);

border-radius:28px;

padding:36px;

box-shadow:

0 35px 80px rgba(0,0,0,.30);

}

.asa-card-badge{

display:inline-flex;

padding:9px 18px;

border-radius:40px;

background:var(--primary);

color:#fff;

font-size:13px;

font-weight:700;

margin-bottom:18px;

}

.asa-register-card h2{

font-size:34px;

color:#fff;

margin-bottom:10px;

}

.asa-register-card p{

color:#E3E7ED;

margin-bottom:25px;

}

/*====================================================
 COUNTDOWN
====================================================*/

.asa-countdown{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:12px;

margin:25px 0;

}

.asa-countdown div{

background:#fff;

border-radius:16px;

padding:18px 8px;

text-align:center;

}

.asa-countdown strong{

display:block;

font-size:30px;

font-weight:800;

color:var(--primary);

}

.asa-countdown span{

font-size:13px;

font-weight:600;

color:#666;

}

/*====================================================
 FORM
====================================================*/

.asa-form{

display:flex;

flex-direction:column;

gap:16px;

margin-top:20px;

}

.asa-form input{

height:58px;

border-radius:14px;

border:1px solid rgba(255,255,255,.18);

background:#fff;

padding:0 18px;

font-size:16px;

transition:.3s;

}

.asa-form input:focus{

border-color:var(--primary);

box-shadow:

0 0 0 4px

rgba(200,160,83,.18);

}

.asa-form button{

height:60px;

font-size:18px;

font-weight:700;

margin-top:8px;

}

.asa-register-card small{

display:block;

text-align:center;

margin-top:18px;

color:#fff;

opacity:.85;

}

/*====================================================
 ANIMATIONS
====================================================*/

@keyframes pulse{

0%{transform:scale(1);opacity:1;}

50%{transform:scale(1.4);opacity:.4;}

100%{transform:scale(1);opacity:1;}

}

@keyframes floatImage{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0px);

}

}
/*====================================================
 HERO STRIP
====================================================*/

.asa-strip{

background:#fff;

position:relative;

z-index:10;

margin-top:-45px;

}

.asa-strip-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:24px;

background:#fff;

border-radius:24px;

padding:30px;

box-shadow:

0 20px 60px rgba(0,0,0,.10);

}

.asa-strip-grid div{

text-align:center;

}

.asa-strip-grid strong{

display:block;

font-size:32px;

font-weight:800;

color:var(--primary);

margin-bottom:8px;

}

.asa-strip-grid span{

font-size:15px;

color:#68707D;

}

/*====================================================
 GENERAL SECTIONS
====================================================*/

.asa-section{

padding:110px 0;

position:relative;

}

.asa-light{

background:#FAFBFD;

}

.asa-dark{

background:#07111F;

color:#fff;

}

.asa-dark p{

color:#D3D8E1;

}

.asa-section-head{

max-width:820px;

margin:auto;

text-align:center;

margin-bottom:70px;

}

.asa-section-head h2{

margin-bottom:18px;

}

.asa-section-head p{

font-size:18px;

line-height:1.9;

}

/*====================================================
 4 COLUMN CARDS
====================================================*/

.asa-grid-4{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:28px;

}

.asa-card{

background:#fff;

border-radius:24px;

overflow:hidden;

transition:.35s;

box-shadow:

0 20px 45px rgba(0,0,0,.08);

}

.asa-card:hover{

transform:translateY(-8px);

box-shadow:

0 35px 80px rgba(0,0,0,.15);

}

.asa-card img{

width:100%;

height:230px;

object-fit:cover;

}

.asa-card h3{

padding:28px 28px 10px;

font-size:24px;

}

.asa-card p{

padding:0 28px 30px;

}

/*====================================================
 WHAT YOU'LL LEARN
====================================================*/

.asa-grid-3{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.asa-glass{

padding:36px;

border-radius:24px;

background:

linear-gradient(

180deg,

rgba(255,255,255,.95),

rgba(248,249,251,.90)

);

border:1px solid rgba(0,0,0,.05);

box-shadow:

0 20px 50px rgba(0,0,0,.08);

transition:.35s;

}

.asa-glass:hover{

transform:translateY(-8px);

}

.asa-glass span{

font-size:42px;

display:block;

margin-bottom:22px;

}

.asa-glass h3{

margin-bottom:14px;

font-size:24px;

}

.asa-glass p{

line-height:1.8;

}

/*====================================================
 ABOUT DOCTOR
====================================================*/

.asa-two{

display:grid;

grid-template-columns:1fr 520px;

align-items:center;

gap:80px;

}

.asa-two h2{

margin:18px 0 25px;

}

.asa-speaker-photo{

display:flex;

justify-content:center;

}

.asa-speaker-photo img{

width:100%;

max-width:470px;

border-radius:30px;

box-shadow:

0 40px 80px rgba(0,0,0,.30);

}

.asa-badges{

display:flex;

flex-wrap:wrap;

gap:14px;

margin-top:35px;

}

.asa-badges span{

padding:12px 20px;

border-radius:40px;

background:rgba(255,255,255,.08);

border:1px solid rgba(255,255,255,.10);

font-weight:700;

}

/*====================================================
 TEDx GALLERY
====================================================*/

.asa-gallery{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:22px;

}

.asa-gallery img{

width:100%;

height:280px;

object-fit:cover;

border-radius:22px;

transition:.35s;

box-shadow:

0 20px 45px rgba(0,0,0,.12);

}

.asa-gallery img:hover{

transform:scale(1.04);

}

/*====================================================
 STATISTICS
====================================================*/

.asa-stats{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

margin-top:60px;

}

.asa-stat{

text-align:center;

padding:40px;

border-radius:24px;

background:#fff;

box-shadow:

0 18px 40px rgba(0,0,0,.08);

}

.asa-stat strong{

display:block;

font-size:52px;

color:var(--primary);

font-weight:900;

margin-bottom:10px;

}

.asa-stat span{

color:#68707D;

font-weight:600;

}

/*====================================================
 TIMELINE
====================================================*/

.asa-timeline{

max-width:900px;

margin:80px auto 0;

position:relative;

}

.asa-timeline::before{

content:"";

position:absolute;

left:50%;

top:0;

bottom:0;

width:4px;

background:#E7EAF0;

transform:translateX(-50%);

}

.asa-time{

position:relative;

width:50%;

padding:20px 45px;

}

.asa-time:nth-child(odd){

left:0;

text-align:right;

}

.asa-time:nth-child(even){

left:50%;

}

.asa-time-box{

background:#fff;

padding:28px;

border-radius:22px;

box-shadow:

0 18px 45px rgba(0,0,0,.08);

}

.asa-time-year{

display:inline-block;

padding:8px 16px;

border-radius:30px;

background:var(--primary);

color:#fff;

font-weight:700;

margin-bottom:16px;

}
/*====================================================
 BOOK PROMOTION
====================================================*/

.asa-book{

display:grid;

grid-template-columns:460px 1fr;

gap:80px;

align-items:center;

}

.asa-book img{

width:100%;

border-radius:28px;

box-shadow:

0 40px 80px rgba(0,0,0,.20);

transition:.4s;

}

.asa-book img:hover{

transform:translateY(-10px);

}

.asa-book h2{

margin:18px 0 22px;

}

.asa-book p{

font-size:18px;

line-height:1.9;

margin-bottom:35px;

}

/*====================================================
 COURSES
====================================================*/

.asa-course-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.asa-course{

background:#fff;

border-radius:24px;

overflow:hidden;

box-shadow:

0 20px 45px rgba(0,0,0,.08);

transition:.35s;

}

.asa-course:hover{

transform:translateY(-8px);

box-shadow:

0 35px 80px rgba(0,0,0,.14);

}

.asa-course img{

width:100%;

height:220px;

object-fit:cover;

}

.asa-course-body{

padding:30px;

}

.asa-course-body h3{

margin-bottom:15px;

font-size:25px;

}

.asa-course-body p{

margin-bottom:24px;

}

/*====================================================
 TESTIMONIALS
====================================================*/

.asa-testimonials{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.asa-testimonial{

background:#fff;

border-radius:24px;

padding:35px;

box-shadow:

0 20px 45px rgba(0,0,0,.08);

transition:.35s;

position:relative;

}

.asa-testimonial:hover{

transform:translateY(-8px);

}

.asa-testimonial::before{

content:"★★★★★";

display:block;

color:#F6B600;

font-size:20px;

margin-bottom:20px;

}

.asa-testimonial p{

font-size:17px;

line-height:1.9;

margin-bottom:30px;

}

.asa-user{

display:flex;

align-items:center;

gap:18px;

}

.asa-user img{

width:70px;

height:70px;

border-radius:50%;

object-fit:cover;

}

.asa-user h4{

font-size:18px;

margin-bottom:4px;

}

.asa-user span{

font-size:14px;

color:#777;

}

/*====================================================
 VIDEO TESTIMONIALS
====================================================*/

.asa-video-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.asa-video{

position:relative;

overflow:hidden;

border-radius:24px;

box-shadow:

0 20px 45px rgba(0,0,0,.12);

cursor:pointer;

}

.asa-video img{

width:100%;

height:260px;

object-fit:cover;

transition:.4s;

}

.asa-video:hover img{

transform:scale(1.08);

}

.asa-video::after{

content:"▶";

position:absolute;

left:50%;

top:50%;

transform:translate(-50%,-50%);

width:90px;

height:90px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:34px;

background:rgba(255,255,255,.90);

color:#111;

}

/*====================================================
 YOUTUBE
====================================================*/

.asa-youtube{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:28px;

}

.asa-youtube-card{

border-radius:24px;

overflow:hidden;

background:#fff;

box-shadow:

0 18px 40px rgba(0,0,0,.08);

transition:.35s;

}

.asa-youtube-card:hover{

transform:translateY(-8px);

}

.asa-youtube-card img{

width:100%;

height:220px;

object-fit:cover;

}

.asa-youtube-card h3{

padding:22px;

font-size:20px;

}

/*====================================================
 INSTAGRAM
====================================================*/

.asa-instagram{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:20px;

}

.asa-instagram img{

width:100%;

aspect-ratio:1;

object-fit:cover;

border-radius:20px;

transition:.35s;

}

.asa-instagram img:hover{

transform:scale(1.05);

}

/*====================================================
 FAQ
====================================================*/

.asa-faq{

max-width:900px;

margin:auto;

}

.asa-faq-item{

background:#fff;

border-radius:18px;

margin-bottom:18px;

overflow:hidden;

box-shadow:

0 12px 35px rgba(0,0,0,.08);

}

.asa-faq-item button{

width:100%;

display:flex;

justify-content:space-between;

align-items:center;

padding:26px 30px;

background:#fff;

border:none;

font-size:19px;

font-weight:700;

}

.asa-faq-item button span{

font-size:28px;

color:var(--primary);

transition:.3s;

}

.asa-faq-item.active button span{

transform:rotate(45deg);

}

.asa-faq-item p{

display:none;

padding:0 30px 28px;

line-height:1.9;

}

.asa-faq-item.active p{

display:block;

}

/*====================================================
 FINAL CTA
====================================================*/

.asa-final{

padding:120px 0;

background:

linear-gradient(

135deg,

#07111F,

#101D30

);

}

.asa-final-box{

max-width:950px;

margin:auto;

text-align:center;

background:

rgba(255,255,255,.06);

border:1px solid rgba(255,255,255,.10);

backdrop-filter:blur(20px);

padding:70px;

border-radius:30px;

}

.asa-final-box h2{

color:#fff;

margin-bottom:20px;

font-size:48px;

}

.asa-final-box p{

color:#D8DEE7;

font-size:20px;

margin-bottom:35px;

}

/*====================================================
 STICKY CTA
====================================================*/

.asa-sticky-mobile{

position:fixed;

left:20px;

right:20px;

bottom:20px;

z-index:999;

display:none;

}

.asa-sticky-mobile a{

display:flex;

justify-content:center;

align-items:center;

height:58px;

background:var(--primary);

border-radius:16px;

color:#fff;

font-weight:800;

font-size:18px;

box-shadow:

0 18px 40px rgba(0,0,0,.25);

}

/*====================================================
 PREMIUM FOOTER
====================================================*/

.site-footer{

background:#03060B;

padding:90px 0 35px;

color:#fff;

}

.footer-grid{

display:grid;

grid-template-columns:2fr 1fr 1fr 1fr;

gap:45px;

margin-top:60px;

}

.footer-grid h3,

.footer-grid h4{

margin-bottom:22px;

}

.footer-grid a{

display:block;

margin-bottom:12px;

color:#BFC6D2;

}

.footer-grid a:hover{

color:#fff;

}

.footer-bottom{

margin-top:55px;

padding-top:30px;

border-top:1px solid rgba(255,255,255,.08);

text-align:center;

color:#8C97A8;

}
/*====================================================
 RESPONSIVE
====================================================*/

@media (max-width:1280px){

.asa-hero-grid{

grid-template-columns:1fr 380px;

gap:45px;

}

.asa-register-card{

grid-column:1/-1;

max-width:520px;

margin:50px auto 0;

}

.asa-hero-person{

justify-content:flex-end;

}

.asa-hero-person img{

width:520px;

}

}

/*--------------------------------------------------*/

@media (max-width:1100px){

.section,
.asa-section{

padding:90px 0;

}

h1{

font-size:56px;

}

h2{

font-size:40px;

}

.asa-hero{

padding:120px 0 70px;

}

.asa-hero-grid{

grid-template-columns:1fr;

text-align:center;

}

.asa-hero-copy{

max-width:900px;

margin:auto;

}

.asa-sub{

margin:auto auto 35px;

}

.asa-hero-actions{

justify-content:center;

}

.asa-trust-row{

justify-content:center;

}

.asa-hero-person{

justify-content:center;

margin-top:40px;

}

.asa-hero-person img{

width:500px;

}

.hero-floating{

display:none;

}

.asa-register-card{

margin-top:45px;

max-width:600px;

}

.asa-strip-grid{

grid-template-columns:repeat(2,1fr);

}

.asa-grid-4{

grid-template-columns:repeat(2,1fr);

}

.asa-grid-3{

grid-template-columns:repeat(2,1fr);

}

.asa-course-grid{

grid-template-columns:repeat(2,1fr);

}

.asa-testimonials{

grid-template-columns:repeat(2,1fr);

}

.asa-video-grid{

grid-template-columns:repeat(2,1fr);

}

.asa-youtube{

grid-template-columns:repeat(2,1fr);

}

.asa-gallery{

grid-template-columns:repeat(2,1fr);

}

.asa-instagram{

grid-template-columns:repeat(3,1fr);

}

.asa-two{

grid-template-columns:1fr;

text-align:center;

}

.asa-badges{

justify-content:center;

}

.asa-book{

grid-template-columns:1fr;

text-align:center;

}

.footer-grid{

grid-template-columns:repeat(2,1fr);

}

}

/*--------------------------------------------------*/

@media (max-width:768px){

body{

font-size:15px;

}

.container{

width:calc(100% - 26px);

}

.section,
.asa-section{

padding:70px 0;

}

.asa-hero{

padding:105px 0 60px;

min-height:auto;

}

.asa-live{

font-size:13px;

padding:10px 16px;

}

.asa-hero-copy h1{

font-size:46px;

}

.asa-sub{

font-size:17px;

line-height:1.8;

}

.asa-hero-person img{

width:380px;

}

.asa-register-card{

padding:28px;

border-radius:22px;

}

.asa-register-card h2{

font-size:28px;

}

.asa-countdown{

grid-template-columns:repeat(2,1fr);

}

.asa-countdown strong{

font-size:26px;

}

.asa-strip{

margin-top:0;

}

.asa-strip-grid{

grid-template-columns:1fr;

padding:25px;

}

.asa-grid-4,

.asa-grid-3,

.asa-course-grid,

.asa-testimonials,

.asa-video-grid,

.asa-gallery,

.asa-youtube{

grid-template-columns:1fr;

}

.asa-instagram{

grid-template-columns:repeat(2,1fr);

}

.asa-gallery img,

.asa-video img,

.asa-youtube-card img{

height:220px;

}

.asa-card img{

height:220px;

}

.asa-book{

gap:45px;

}

.asa-book img{

max-width:330px;

margin:auto;

}

.asa-final{

padding:80px 0;

}

.asa-final-box{

padding:40px 25px;

}

.asa-final-box h2{

font-size:34px;

}

.footer-grid{

grid-template-columns:1fr;

gap:35px;

}

.nav-links{

display:none;

}

.asa-sticky-mobile{

display:block;

}

}

/*--------------------------------------------------*/

@media (max-width:480px){

.asa-hero-copy h1{

font-size:38px;

}

h2{

font-size:30px;

}

.btn{

width:100%;

}

.asa-hero-actions{

flex-direction:column;

}

.asa-trust-row{

flex-direction:column;

}

.asa-trust-row span{

justify-content:center;

}

.asa-hero-person img{

width:310px;

}

.asa-register-card{

padding:24px;

}

.asa-form input{

height:54px;

}

.asa-form button{

height:56px;

}

.asa-countdown{

gap:10px;

}

.asa-countdown div{

padding:14px 8px;

}

.asa-countdown strong{

font-size:22px;

}

.asa-instagram{

grid-template-columns:1fr;

}

}

/*====================================================
 SMOOTH REVEAL ANIMATION
====================================================*/

.reveal{

opacity:0;

transform:translateY(40px);

transition:

opacity .7s ease,

transform .7s ease;

}

.reveal.active{

opacity:1;

transform:none;

}

/*====================================================
 LOADER
====================================================*/

.btn-loading{

pointer-events:none;

opacity:.85;

position:relative;

}

.btn-loading::after{

content:"";

width:18px;

height:18px;

border:2px solid rgba(255,255,255,.35);

border-top-color:#fff;

border-radius:50%;

display:inline-block;

margin-left:10px;

animation:spin .8s linear infinite;

vertical-align:middle;

}

@keyframes spin{

to{

transform:rotate(360deg);

}

}

/*====================================================
 SUCCESS MESSAGE
====================================================*/

.notice{

padding:18px 22px;

border-radius:14px;

margin:20px 0;

background:#EAFBF1;

color:#0E8A4D;

border-left:5px solid #16B86A;

font-weight:600;

animation:fadeUp .45s ease;

}

.notice.error{

background:#FFF2F2;

color:#C53232;

border-left-color:#E04545;

}

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(20px);

}

to{

opacity:1;

transform:none;

}

}

/*====================================================
 END OF STYLE.CSS V1
====================================================*/
/*====================================================
 PREMIUM GLASS SYSTEM
====================================================*/

.glass{

background:rgba(255,255,255,.08);

backdrop-filter:blur(24px);

-webkit-backdrop-filter:blur(24px);

border:1px solid rgba(255,255,255,.10);

border-radius:24px;

box-shadow:
0 30px 70px rgba(0,0,0,.20);

}

.glass-dark{

background:rgba(7,17,31,.72);

backdrop-filter:blur(28px);

border:1px solid rgba(255,255,255,.08);

}

/*====================================================
 PREMIUM CARDS
====================================================*/

.card{

background:#fff;

border-radius:26px;

padding:34px;

transition:.35s;

box-shadow:

0 18px 40px rgba(0,0,0,.08);

position:relative;

overflow:hidden;

}

.card::before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:linear-gradient(

90deg,

#D8B36A,

#B88934

);

transform:scaleX(0);

transform-origin:left;

transition:.35s;

}

.card:hover{

transform:translateY(-10px);

box-shadow:

0 35px 80px rgba(0,0,0,.14);

}

.card:hover::before{

transform:scaleX(1);

}

/*====================================================
 ICON CIRCLE
====================================================*/

.icon-circle{

width:74px;

height:74px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:34px;

background:linear-gradient(

135deg,

#D8B36A,

#B88934

);

color:#fff;

margin-bottom:24px;

box-shadow:

0 16px 35px rgba(200,160,83,.30);

}

/*====================================================
 SECTION DIVIDER
====================================================*/

.wave-divider{

position:absolute;

left:0;

right:0;

bottom:-1px;

height:120px;

background:linear-gradient(

to bottom,

transparent,

#fff

);

pointer-events:none;

}

/*====================================================
 IMAGE HOVER
====================================================*/

.zoom{

overflow:hidden;

border-radius:24px;

}

.zoom img{

transition:.5s;

}

.zoom:hover img{

transform:scale(1.08);

}

/*====================================================
 BADGES
====================================================*/

.badge-gold{

display:inline-flex;

align-items:center;

gap:8px;

padding:9px 18px;

border-radius:40px;

background:#FFF8EA;

color:#B88934;

font-weight:700;

font-size:14px;

}

.badge-dark{

display:inline-flex;

padding:9px 18px;

border-radius:40px;

background:#07111F;

color:#fff;

font-size:14px;

font-weight:700;

}

/*====================================================
 LIST
====================================================*/

.check-list{

display:grid;

gap:16px;

margin-top:30px;

}

.check-list li{

list-style:none;

display:flex;

align-items:flex-start;

gap:16px;

font-size:17px;

line-height:1.8;

}

.check-list li::before{

content:"✓";

width:30px;

height:30px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

background:#14B86A;

color:#fff;

font-weight:700;

flex-shrink:0;

}

/*====================================================
 HOVER BUTTON EFFECT
====================================================*/

.btn{

position:relative;

overflow:hidden;

}

.btn::before{

content:"";

position:absolute;

left:-120%;

top:0;

width:100%;

height:100%;

background:

linear-gradient(

90deg,

transparent,

rgba(255,255,255,.30),

transparent

);

transition:.6s;

}

.btn:hover::before{

left:120%;

}

/*====================================================
 SCROLLBAR
====================================================*/

::-webkit-scrollbar{

width:10px;

}

::-webkit-scrollbar-track{

background:#ECECEC;

}

::-webkit-scrollbar-thumb{

background:#C8A053;

border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

background:#A57C2A;

}

/*====================================================
 SELECTION
====================================================*/

::selection{

background:#C8A053;

color:#fff;

}

/*====================================================
 FOCUS ACCESSIBILITY
====================================================*/

a:focus,
button:focus,
input:focus{

outline:none;

}

/*====================================================
 SPACING HELPERS
====================================================*/

.mt-20{margin-top:20px;}
.mt-30{margin-top:30px;}
.mt-40{margin-top:40px;}
.mt-60{margin-top:60px;}
.mt-80{margin-top:80px;}

.mb-20{margin-bottom:20px;}
.mb-30{margin-bottom:30px;}
.mb-40{margin-bottom:40px;}
.mb-60{margin-bottom:60px;}
.mb-80{margin-bottom:80px;}

.pt-80{padding-top:80px;}
.pb-80{padding-bottom:80px;}

/*====================================================
 END PART 6
====================================================*/
/*====================================================
 PREMIUM BACKGROUND DECORATIONS
====================================================*/

.bg-orb{

position:absolute;

border-radius:50%;

filter:blur(100px);

pointer-events:none;

z-index:0;

}

.bg-orb.gold{

width:420px;

height:420px;

background:rgba(200,160,83,.22);

top:-120px;

right:-80px;

}

.bg-orb.blue{

width:520px;

height:520px;

background:rgba(0,120,255,.12);

bottom:-180px;

left:-180px;

}

.grid-pattern{

position:absolute;

inset:0;

background-image:

linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),

linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);

background-size:40px 40px;

opacity:.35;

pointer-events:none;

}

/*====================================================
 PREMIUM SECTION TITLES
====================================================*/

.section-title{

font-size:52px;

font-weight:900;

line-height:1.15;

margin-bottom:20px;

color:#111;

}

.section-title.light{

color:#fff;

}

.section-desc{

font-size:19px;

line-height:1.9;

max-width:760px;

margin:auto;

color:#677180;

}

.section-desc.light{

color:#D4DAE4;

}

/*====================================================
 FEATURE ICON BOX
====================================================*/

.feature-box{

display:flex;

align-items:flex-start;

gap:20px;

padding:28px;

border-radius:22px;

background:#fff;

box-shadow:

0 18px 45px rgba(0,0,0,.08);

transition:.35s;

}

.feature-box:hover{

transform:translateY(-8px);

}

.feature-box-icon{

width:68px;

height:68px;

border-radius:18px;

display:flex;

align-items:center;

justify-content:center;

font-size:30px;

background:linear-gradient(135deg,#D8B36A,#B88934);

color:#fff;

flex-shrink:0;

}

.feature-box h3{

margin-bottom:10px;

font-size:22px;

}

.feature-box p{

margin:0;

}

/*====================================================
 FLOATING STATS
====================================================*/

.float-stat{

position:absolute;

background:#fff;

padding:18px 24px;

border-radius:20px;

box-shadow:

0 22px 55px rgba(0,0,0,.18);

animation:floatSlow 7s ease-in-out infinite;

}

.float-stat strong{

display:block;

font-size:28px;

font-weight:900;

color:var(--primary);

}

.float-stat span{

font-size:14px;

color:#666;

font-weight:600;

}

.float-stat.one{

top:90px;

left:-35px;

}

.float-stat.two{

bottom:110px;

right:-30px;

animation-delay:2s;

}

@keyframes floatSlow{

0%{transform:translateY(0);}

50%{transform:translateY(-12px);}

100%{transform:translateY(0);}

}

/*====================================================
 PREMIUM VIDEO CARD
====================================================*/

.video-card{

position:relative;

overflow:hidden;

border-radius:26px;

background:#000;

box-shadow:

0 25px 60px rgba(0,0,0,.20);

}

.video-card iframe{

display:block;

width:100%;

aspect-ratio:16/9;

border:0;

}

.video-card::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(

180deg,

transparent,

rgba(0,0,0,.15)

);

pointer-events:none;

}

/*====================================================
 SOCIAL GRID
====================================================*/

.social-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:22px;

}

.social-card{

position:relative;

overflow:hidden;

border-radius:22px;

background:#fff;

box-shadow:

0 18px 45px rgba(0,0,0,.08);

transition:.35s;

}

.social-card:hover{

transform:translateY(-8px);

}

.social-card img{

width:100%;

aspect-ratio:1;

object-fit:cover;

}

.social-card .overlay{

position:absolute;

inset:0;

display:flex;

align-items:center;

justify-content:center;

background:rgba(0,0,0,.45);

opacity:0;

transition:.35s;

color:#fff;

font-size:18px;

font-weight:700;

}

.social-card:hover .overlay{

opacity:1;

}

/*====================================================
 PREMIUM TABLE
====================================================*/

.table-premium{

width:100%;

border-collapse:collapse;

overflow:hidden;

border-radius:22px;

box-shadow:

0 20px 50px rgba(0,0,0,.08);

}

.table-premium thead{

background:#07111F;

color:#fff;

}

.table-premium th{

padding:20px;

font-size:15px;

letter-spacing:.05em;

text-transform:uppercase;

}

.table-premium td{

padding:18px 20px;

background:#fff;

border-bottom:1px solid #ECEFF4;

}

.table-premium tbody tr:hover td{

background:#FAFBFD;

}

/*====================================================
 PREMIUM BLOCKQUOTE
====================================================*/

.quote{

position:relative;

padding:35px 40px;

border-left:6px solid var(--primary);

background:#FFFDF8;

border-radius:0 20px 20px 0;

font-size:20px;

line-height:1.9;

font-style:italic;

}

.quote::before{

content:"“";

position:absolute;

top:-18px;

left:18px;

font-size:80px;

color:rgba(200,160,83,.20);

font-family:Georgia,serif;

}

/*====================================================
 IMAGE MASK
====================================================*/

.round-image{

overflow:hidden;

border-radius:28px;

}

.round-image img{

width:100%;

display:block;

transition:.45s;

}

.round-image:hover img{

transform:scale(1.06);

}

/*====================================================
 SHIMMER EFFECT
====================================================*/

.shimmer{

position:relative;

overflow:hidden;

}

.shimmer::after{

content:"";

position:absolute;

top:0;

left:-120%;

width:80%;

height:100%;

background:

linear-gradient(

90deg,

transparent,

rgba(255,255,255,.30),

transparent

);

animation:shimmer 3s infinite;

}

@keyframes shimmer{

100%{

left:160%;

}

}

/*====================================================
 PREMIUM DIVIDER
====================================================*/

.divider{

width:90px;

height:5px;

margin:25px auto 0;

border-radius:20px;

background:

linear-gradient(

90deg,

#D8B36A,

#B88934

);

}

/*====================================================
 END PART 7
====================================================*/
/*====================================================
 MOBILE OFF CANVAS MENU
====================================================*/

.mobile-toggle{

display:none;

width:46px;

height:46px;

border:none;

background:transparent;

padding:0;

position:relative;

z-index:1101;

}

.mobile-toggle span{

display:block;

width:28px;

height:3px;

margin:5px auto;

background:#fff;

border-radius:20px;

transition:.35s;

}

.mobile-menu{

position:fixed;

top:0;

right:-360px;

width:340px;

height:100vh;

background:#07111F;

padding:100px 35px 40px;

transition:.45s;

z-index:1100;

overflow-y:auto;

box-shadow:

-20px 0 60px rgba(0,0,0,.35);

}

.mobile-menu.open{

right:0;

}

.mobile-menu a{

display:block;

padding:16px 0;

font-size:18px;

font-weight:600;

color:#fff;

border-bottom:1px solid rgba(255,255,255,.08);

}

.mobile-menu a:hover{

color:var(--primary);

}

.mobile-overlay{

position:fixed;

inset:0;

background:rgba(0,0,0,.55);

opacity:0;

visibility:hidden;

transition:.35s;

z-index:1090;

}

.mobile-overlay.show{

opacity:1;

visibility:visible;

}

/*====================================================
 PREMIUM FOOTER V2
====================================================*/

.footer-newsletter{

display:flex;

gap:18px;

margin-top:28px;

}

.footer-newsletter input{

flex:1;

height:56px;

border-radius:14px;

border:none;

padding:0 18px;

background:#182537;

color:#fff;

}

.footer-newsletter input::placeholder{

color:#AEB8C8;

}

.footer-social{

display:flex;

gap:14px;

margin-top:30px;

}

.footer-social a{

width:46px;

height:46px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

background:#182537;

color:#fff;

transition:.35s;

}

.footer-social a:hover{

background:var(--primary);

transform:translateY(-4px);

}

/*====================================================
 PREMIUM SCROLL TO TOP
====================================================*/

.scroll-top{

position:fixed;

right:24px;

bottom:24px;

width:52px;

height:52px;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

background:var(--primary);

color:#fff;

font-size:20px;

cursor:pointer;

opacity:0;

visibility:hidden;

transition:.35s;

box-shadow:

0 15px 35px rgba(0,0,0,.22);

z-index:998;

}

.scroll-top.show{

opacity:1;

visibility:visible;

}

.scroll-top:hover{

transform:translateY(-4px);

}

/*====================================================
 SECTION HOVER GLOW
====================================================*/

.glow-hover{

position:relative;

overflow:hidden;

}

.glow-hover::before{

content:"";

position:absolute;

left:-50%;

top:-50%;

width:220px;

height:220px;

background:

radial-gradient(

circle,

rgba(216,179,106,.25),

transparent 70%

);

opacity:0;

transition:.45s;

pointer-events:none;

}

.glow-hover:hover::before{

opacity:1;

left:20%;

top:10%;

}

/*====================================================
 IMAGE BORDER EFFECT
====================================================*/

.gold-border{

padding:3px;

border-radius:30px;

background:

linear-gradient(

135deg,

#D8B36A,

transparent,

#B88934

);

}

.gold-border img{

border-radius:27px;

display:block;

}

/*====================================================
 PREMIUM TAGS
====================================================*/

.tag{

display:inline-flex;

align-items:center;

padding:8px 16px;

border-radius:30px;

background:#FFF8EA;

color:#B88934;

font-size:13px;

font-weight:700;

margin:4px;

}

/*====================================================
 LOADING SKELETON
====================================================*/

.skeleton{

background:

linear-gradient(

90deg,

#F3F4F6 25%,

#ECECEC 37%,

#F3F4F6 63%

);

background-size:400% 100%;

animation:skeleton 1.4s ease infinite;

border-radius:12px;

}

@keyframes skeleton{

0%{

background-position:100% 0;

}

100%{

background-position:-100% 0;

}

}

/*====================================================
 PRINT
====================================================*/

@media print{

.site-header,

.site-footer,

.asa-sticky-mobile,

.scroll-top,

.mobile-menu,

.mobile-overlay{

display:none!important;

}

body{

background:#fff;

}

.asa-section{

padding:20px 0;

}

}

/*====================================================
 EXTRA UTILITIES
====================================================*/

.hide{

display:none!important;

}

.show{

display:block!important;

}

.flex{

display:flex;

}

.flex-center{

display:flex;

align-items:center;

justify-content:center;

}

.space-between{

display:flex;

justify-content:space-between;

align-items:center;

}

.w-100{

width:100%;

}

.text-white{

color:#fff;

}

.text-gold{

color:var(--primary);

}

.bg-dark{

background:#07111F;

}

.bg-white{

background:#fff;

}

.radius{

border-radius:24px;

}

.shadow{

box-shadow:

0 25px 60px rgba(0,0,0,.12);

}

/*====================================================
 PERFORMANCE
====================================================*/

img{

content-visibility:auto;

}

.card,
.asa-card,
.asa-glass,
.asa-course,
.asa-testimonial{

will-change:transform;

}

/*====================================================
 STYLE.CSS V1 COMPLETE
====================================================*/


/*====================================================
  V2 POLISH — SITEWIDE FRAME  (append at the very end)
  Fixes header/nav/mobile-menu/footer to match markup.
  Additive only — uses your existing tokens & colours.
====================================================*/

/* Font baseline (Inter now loaded from Google Fonts) */
body{ font-family:Inter, "Segoe UI", system-ui, sans-serif; }

/* Fixed-header offset for pages that DON'T have the big hero */
body.no-hero{ padding-top:82px; }
@media (max-width:768px){ body.no-hero{ padding-top:70px; } }

/* Navbar height a touch tighter on mobile */
@media (max-width:768px){ .navbar{ height:66px; } }

/*---------------- LOGO ----------------*/
.logo{ text-decoration:none; }
.logo-badge{
  width:46px; height:46px; flex:0 0 46px;
  display:flex; align-items:center; justify-content:center;
  border-radius:12px;
  background:linear-gradient(135deg,#D8B36A,#B88934);
  color:#0A1120; font-weight:900; font-size:18px;
  box-shadow:0 8px 20px rgba(200,160,83,.35);
}
.logo-text{ display:flex; flex-direction:column; line-height:1.2; }
.logo-text strong{ font-size:18px; font-weight:800; color:#fff; }
.logo-text strong span{ color:var(--primary); }
.logo-text small{
  font-size:10.5px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:#9FB0C4;
}
@media (max-width:480px){
  .logo-text small{ display:none; }
  .logo-text strong{ font-size:16px; }
}

/*---------------- DESKTOP NAV ----------------*/
.nav-links a.active{ color:#fff; }
.nav-links a.active::after{ width:100%; }
.nav-cta{
  height:44px; padding:0 22px;
  display:inline-flex; align-items:center;
  border-radius:12px; font-weight:800; font-size:14px;
  color:#0A1120 !important;
  background:linear-gradient(135deg,#D8B36A,#B88934);
  box-shadow:0 12px 26px rgba(200,160,83,.32);
}
.nav-cta::after{ display:none !important; }
.nav-cta:hover{ transform:translateY(-2px); }

/*---------------- MOBILE TOGGLE (was never shown) ----------------*/
@media (max-width:768px){ .mobile-toggle{ display:block; } }
.mobile-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.mobile-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.mobile-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
.mobile-menu .btn{ width:100%; margin-top:20px; }

/*---------------- FOOTER CTA (classes were missing) ----------------*/
.footer-cta{
  text-align:center;
  padding-bottom:55px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-cta h2{ color:#fff; margin:8px 0 14px; }
.footer-cta p{ color:#AEB8C8; max-width:640px; margin:0 auto 32px; }
.footer-actions{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }

/* Footer columns */
.site-footer .footer-grid h3{ color:#fff; margin-bottom:14px; }
.site-footer .footer-grid h4{
  color:#fff; margin-bottom:16px; font-size:15px;
  letter-spacing:.06em; text-transform:uppercase;
}
.site-footer .footer-grid p{ color:#9BA6B6; }
.site-footer .footer-grid a{ display:block; color:#B9C2D0; padding:6px 0; }
.site-footer .footer-grid a:hover{ color:var(--primary); }

/* Outline buttons sit on dark footer — make them readable */
.site-footer .btn-outline{ color:#fff; border-color:rgba(255,255,255,.35); }
.site-footer .btn-outline:hover{ background:var(--primary); border-color:var(--primary); color:#0A1120; }
.footer-social svg{ width:20px; height:20px; }

/*---------------- FOOTER RESPONSIVE ----------------*/
@media (max-width:768px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){
  .footer-grid{ grid-template-columns:1fr; }
  .footer-actions .btn{ width:100%; }
}

/*====================================================
  END V2 POLISH
====================================================*/
/*====================================================
  V2 POLISH — HOMEPAGE + CARDS + WEBINAR DATE
  Append AFTER the previous V2 block. Additive only.
====================================================*/

/*---------------- HOMEPAGE HERO ----------------*/
.home-hero{
  position:relative; overflow:hidden;
  padding:150px 0 120px;
  text-align:center; color:#fff;
  background:#05070E url("../images/webinar-bg.jpg") center center/cover no-repeat;
}
.home-hero::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(60% 55% at 78% 8%, rgba(200,160,83,.22) 0%, transparent 55%),
    linear-gradient(180deg, rgba(5,7,14,.72) 0%, rgba(5,7,14,.80) 55%, rgba(3,6,11,.94) 100%);
}
.home-hero .container{ position:relative; z-index:2; max-width:920px; }
.home-hero .eyebrow{ background:rgba(255,255,255,.06); }
.home-hero h1{
  color:#fff; font-size:66px; line-height:1.04; font-weight:900;
  margin:18px 0 22px;
}
.home-hero h1 span{ color:var(--primary); display:block; }
.home-hero .hero-sub{
  font-size:20px; line-height:1.8; color:#D4D8DF;
  max-width:720px; margin:0 auto 36px;
}
.home-hero .hero-actions{
  display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:36px;
}
.trust-pills{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.trust-pills span{
  padding:10px 18px; border-radius:40px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  color:#fff; font-weight:600; font-size:14px; backdrop-filter:blur(10px);
}
@media (max-width:768px){
  .home-hero{ padding:120px 0 90px; }
  .home-hero h1{ font-size:40px; }
  .home-hero .hero-sub{ font-size:17px; }
}

/*---------------- STAT STRIP INNER ----------------*/
.asa-strip-grid > div{ text-align:center; }
.asa-strip-grid strong{ display:block; font-size:34px; font-weight:900; color:#07111F; line-height:1.1; }
.asa-strip-grid span{ color:#6B7280; font-weight:600; font-size:14px; }
@media (max-width:768px){
  .asa-strip{ margin-top:-30px; }
  .asa-strip-grid{ grid-template-columns:1fr 1fr; gap:18px; }
  .asa-strip-grid strong{ font-size:26px; }
}

/*---------------- ICON CARDS (homepage) ----------------*/
.card{ display:block; color:inherit; }
.card .icon{ font-size:42px; line-height:1; margin-bottom:16px; }
.card h3{ margin-bottom:10px; color:#111; }
.card p{ color:#596171; }
.card .card-link{
  display:inline-block; margin-top:16px;
  color:var(--primary); font-weight:700; font-size:15px;
}
.card:hover{ transform:translateY(-6px); box-shadow:0 30px 65px rgba(0,0,0,.12); }
.card.featured-card{ border:1px solid rgba(200,160,83,.40); }
.card.featured-card::after{
  content:"Recommended"; position:absolute; top:16px; right:16px;
  background:var(--primary); color:#0A1120;
  font-size:11px; font-weight:800; letter-spacing:.04em;
  padding:5px 12px; border-radius:30px;
}

/* Section heads on the dark section need light text */
.asa-dark .asa-section-head h2{ color:#fff; }
.asa-dark .asa-section-head p{ color:#C8CDD6; }

/*---------------- WEBINAR DATE PILL (.asa-date was missing) ----------------*/
.asa-date{
  margin:16px 0; padding:12px 16px; border-radius:12px;
  background:rgba(200,160,83,.16); border:1px solid rgba(200,160,83,.30);
  color:#fff; font-weight:700; text-align:center;
}

/*====================================================
  END HOMEPAGE POLISH
====================================================*/
/*====================================================
  V2 POLISH — EYEBROW FIX + WEBINAR REFINEMENT
  Append LAST (after the previous two blocks).
  Scoped to avoid side effects on other pages.
====================================================*/

/*---- FIX: eyebrow was translucent-white on light bg (invisible) ----*/
.asa-light .eyebrow,
.asa-section:not(.asa-dark) .eyebrow,
body.no-hero .asa-strip + .asa-section .eyebrow,
.asa-book .eyebrow,
.asa-two:not(.asa-dark) .eyebrow{
  background:rgba(200,160,83,.12);
  border-color:rgba(200,160,83,.28);
  color:#A57C2A;
}
/* keep eyebrows on dark backgrounds bright */
.asa-dark .eyebrow,
.home-hero .eyebrow,
.webinar-page .asa-hero .eyebrow{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.14);
  color:var(--primary);
}

/*---- HERO: fix the one-word-per-line headline wrap ----*/
.webinar-page .asa-hero-copy h1{ font-size:58px; line-height:1.02; }
.webinar-page .asa-hero-copy h1 span{ display:inline; }
@media (max-width:768px){ .webinar-page .asa-hero-copy h1{ font-size:42px; } }

/* keep the speaker cutout inside its lane */
.webinar-page .asa-hero-person img{ max-width:100%; }

/*---- "What You'll Learn": turn raw emoji into designed gold badges ----*/
.webinar-page .asa-glass span{
  width:68px; height:68px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:30px; border-radius:18px; margin-bottom:22px;
  background:linear-gradient(135deg,#FFF3DC,#F3E2BC);
  box-shadow:0 10px 24px rgba(200,160,83,.22);
}

/*---- Hover feedback on cards / glass ----*/
.webinar-page .asa-glass{ transition:.35s; }
.webinar-page .asa-glass:hover{ transform:translateY(-6px); box-shadow:0 32px 60px rgba(0,0,0,.12); }
.webinar-page .asa-card:hover{ transform:translateY(-6px); box-shadow:0 32px 60px rgba(0,0,0,.14); }
.webinar-page .asa-card p{ padding:0 28px 28px; color:#596171; margin:0; }
.webinar-page .asa-gallery img:hover{ transform:translateY(-6px) scale(1.02); }

/*---- FAQ: rotate the + into an ×, add pointer ----*/
.asa-faq-item button{ cursor:pointer; }
.asa-faq-item button span{ transition:.3s; font-size:26px; color:var(--primary); line-height:1; }
.asa-faq-item.active button span{ transform:rotate(45deg); }

/*---- Success / error notice ----*/
.webinar-page .notice{
  padding:13px 16px; border-radius:12px; margin-bottom:14px; font-weight:600;
  background:rgba(20,184,106,.16); border:1px solid rgba(20,184,106,.38); color:#fff;
}
.webinar-page .notice.error{ background:rgba(224,69,69,.16); border-color:rgba(224,69,69,.42); }

/*---- Register card: tighten form spacing ----*/
.webinar-page .asa-form input{ margin-bottom:12px; }
.webinar-page .asa-register-card h2{ margin-bottom:6px; }

/*====================================================
  END WEBINAR REFINEMENT
====================================================*/
/*=========================================================
  WEBINAR HERO — MATCHES YOUR MOCKUP   (append LAST)
  Full-bleed dark/city hero, centre speaker, uppercase
  headline, feature bar, gold register card, urgency bar.
=========================================================*/

.wh2{ position:relative; overflow:hidden; background:#05070E url("../images/webinar-bg.jpg") center/cover no-repeat; padding:120px 0 60px; }

/* Layer 1 — city backdrop (uses your existing webinar-bg.jpg).
   UPGRADE: to use one composite photo, set this image to your
   speaker+city export and hide .wh2-photo below. */
.wh2::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:url("../images/webinar-hero-bg.jpg") center top/cover no-repeat;
  opacity:1;
}
/* Layer 2 — dark washes so headline (left) + card (right) stay readable */
.wh2::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, rgba(5,7,14,.93) 0%, rgba(5,7,14,.72) 26%, rgba(5,7,14,.30) 50%, rgba(5,7,14,.72) 72%, rgba(5,7,14,.93) 100%),
    linear-gradient(0deg, rgba(5,7,14,.85) 0%, transparent 34%);
}
/* stage photo is now the background — hide the separate cutout layer */
.wh2-photo{ display:none; }
.wh2 .container{ position:relative; z-index:3; }

/* Layer 1.5 — speaker cutout, centred, standing on the floor */
.wh2-photo{
  position:absolute; z-index:2; bottom:0; left:50%; transform:translateX(-50%);
  height:94%; display:flex; align-items:flex-end; pointer-events:none;
}
.wh2-photo img{ height:100%; width:auto; max-width:none; filter:drop-shadow(0 25px 55px rgba(0,0,0,.6)); }

.wh2-grid{ display:grid; grid-template-columns:1fr 470px; gap:40px; align-items:center; min-height:600px; }

/* ---------- LEFT ---------- */
.wh2-live{ display:inline-flex; align-items:center; gap:12px; margin-bottom:22px; }
.wh2-live .live{ display:inline-flex; align-items:center; gap:7px; background:#E23B3B; color:#fff; font-weight:800; font-size:12px; letter-spacing:.10em; padding:6px 12px; border-radius:8px; }
.wh2-live .live::before{ content:""; width:8px; height:8px; border-radius:50%; background:#fff; animation:pulse 2s infinite; }
.wh2-live .lbl{ color:#fff; font-weight:800; letter-spacing:.20em; font-size:14px; }

.wh2 h1{
  font-family:"Anton", Inter, sans-serif; font-weight:400;
  font-size:94px; line-height:.9; letter-spacing:.01em; text-transform:uppercase; color:#fff; margin:0;
}
.wh2 h1 span{ color:#EBB93F; display:block; }
.wh2-underline{ width:230px; height:5px; border-radius:4px; margin:20px 0 22px; background:linear-gradient(90deg,#EBB93F,#B88934); }
.wh2-tag{ font-size:26px; font-weight:800; color:#fff; margin-bottom:16px; }
.wh2-copy{ color:#C9D2DE; max-width:480px; font-size:16px; line-height:1.7; margin-bottom:30px; }

.wh2-features{
  display:grid; grid-template-columns:repeat(4,1fr); max-width:520px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  border-radius:16px; overflow:hidden; backdrop-filter:blur(10px);
}
.wh2-feature{ padding:20px 12px; text-align:center; border-right:1px solid rgba(255,255,255,.10); }
.wh2-feature:last-child{ border-right:none; }
.wh2-feature svg{ width:30px; height:30px; color:#EBB93F; margin-bottom:10px; }
.wh2-feature b{ display:block; color:#fff; font-size:14px; letter-spacing:.05em; }
.wh2-feature small{ color:#9FB0C4; font-size:11.5px; }

/* ---------- RIGHT CARD ---------- */
.wh2-card{
  background:rgba(9,14,24,.80); border:1.5px solid rgba(200,160,83,.55);
  border-radius:20px; padding:32px 30px; backdrop-filter:blur(14px);
  box-shadow:0 40px 90px rgba(0,0,0,.5);
}
.wh2-card h3{ text-align:center; color:#fff; font-size:27px; font-weight:800; margin:0 0 4px; }
.wh2-card-sub{ text-align:center; color:#EBB93F; font-weight:700; margin-bottom:22px; }
.wh2-count{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }
.wh2-count > div{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); border-radius:12px; padding:12px 4px; text-align:center; }
.wh2-count strong{ display:block; font-size:29px; font-weight:800; color:#EBB93F; line-height:1; }
.wh2-count span{ font-size:11px; color:#9FB0C4; letter-spacing:.06em; }
.wh2-till{ display:flex; align-items:center; justify-content:center; gap:8px; color:#EBB93F; font-weight:700; margin-bottom:20px; }
.wh2-till svg{ width:16px; height:16px; }

.wh2-field{ position:relative; margin-bottom:14px; }
.wh2-field svg{ position:absolute; left:15px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:#9FB0C4; }
.wh2-field input{
  width:100%; height:54px; padding:0 16px 0 44px; border-radius:12px;
  background:rgba(255,255,255,.04); border:1px solid rgba(200,160,83,.30); color:#fff; font-size:15px;
}
.wh2-field input::placeholder{ color:#9FB0C4; }
.wh2-field input:focus{ border-color:#EBB93F; background:rgba(255,255,255,.07); }
.wh2-submit{
  width:100%; height:58px; border:none; border-radius:12px; cursor:pointer; margin-top:4px;
  background:linear-gradient(135deg,#E9C15A,#C6943E); color:#1a1206;
  font-weight:800; font-size:17px; letter-spacing:.02em; text-transform:uppercase;
  display:flex; align-items:center; justify-content:center; gap:10px;
  box-shadow:0 16px 34px rgba(200,160,83,.35); transition:.3s;
}
.wh2-submit:hover{ transform:translateY(-2px); }
.wh2-secure{ text-align:center; color:#9FB0C4; font-size:12.5px; margin-top:14px; }

/* ---------- BOTTOM URGENCY BAR ---------- */
.wh2-bottom{
  position:relative; z-index:3; margin-top:44px;
  background:rgba(9,14,24,.74); border:1px solid rgba(200,160,83,.35);
  border-radius:16px; padding:22px 28px; display:flex; align-items:center; gap:24px;
}
.wh2-date{ flex:0 0 auto; width:66px; height:72px; border:2px solid #EBB93F; border-radius:12px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#EBB93F; font-weight:800; line-height:1.05; }
.wh2-date b{ font-size:26px; } .wh2-date small{ font-size:12px; letter-spacing:.10em; }
.wh2-bottom-txt{ flex:1; }
.wh2-bottom-txt b{ display:block; color:#fff; font-size:20px; }
.wh2-bottom-txt span{ color:#AEB8C8; }

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .wh2-grid{ grid-template-columns:1fr; }
  .wh2-photo{ opacity:.25; height:100%; }
  .wh2-card{ max-width:520px; }
  .wh2 h1{ font-size:72px; }
  .wh2-left{ position:relative; z-index:3; }
}
@media (max-width:768px){
  .wh2{ padding:100px 0 40px; }
  .wh2::before{ background-position:center 16%; opacity:.55; }
  .wh2::after{ background:linear-gradient(180deg, rgba(5,7,14,.82) 0%, rgba(5,7,14,.92) 100%); }
  .wh2 h1{ font-size:50px; }
  .wh2-features{ grid-template-columns:repeat(2,1fr); }
  .wh2-feature:nth-child(2){ border-right:none; }
  .wh2-feature{ border-bottom:1px solid rgba(255,255,255,.10); }
  .wh2-count strong{ font-size:23px; }
  .wh2-bottom{ flex-direction:column; text-align:center; }
}

/*---- Registration success state (Post-Redirect-Get) ----*/
.wh2-success{ text-align:center; padding:18px 6px; }
.wh2-success-ic{ width:72px; height:72px; border-radius:50%; margin:0 auto 18px; display:flex; align-items:center; justify-content:center; font-size:38px; color:#0a1206; background:linear-gradient(135deg,#E9C15A,#C6943E); box-shadow:0 16px 34px rgba(200,160,83,.35); }
.wh2-success h3{ color:#fff; font-size:24px; margin-bottom:10px; }
.wh2-success p{ color:#C9D2DE; margin-bottom:22px; line-height:1.7; }
.wh2-success .wh2-submit{ text-decoration:none; }

/*---- Price display in register card ----*/
.wh2-price{ text-align:center; margin:2px 0 16px; color:#fff; font-weight:800; font-size:22px; }
.wh2-price s{ color:#8b93a1; font-weight:600; font-size:16px; margin-left:8px; }
.wh2-price span{ display:block; color:#EBB93F; font-size:12px; font-weight:700; letter-spacing:.03em; margin-top:4px; }

/*---- "For Whom" cards: show full (uncropped) images + 5-up grid ----*/
.asa-grid-5{ display:grid; grid-template-columns:repeat(5,1fr); gap:22px; }
@media (max-width:1100px){ .asa-grid-5{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:768px){ .asa-grid-5{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .asa-grid-5{ grid-template-columns:1fr; } }

.webinar-page .asa-card{ overflow:hidden; }
.webinar-page .asa-card img{
  width:100%; height:280px; object-fit:cover; object-position:center top;
  display:block; background:#0d1522;
}

/*=========================================================
  MANUAL PAYMENT PAGE (?pay=1)
=========================================================*/
.pay-wrap{ max-width:600px; margin:0 auto; position:relative; z-index:3; }
.pay-card{ background:rgba(9,14,24,.88); border:1.5px solid rgba(200,160,83,.5); border-radius:20px; padding:32px 30px; color:#fff; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.pay-head{ text-align:center; margin-bottom:22px; }
.pay-head h2{ color:#fff; font-size:26px; margin-bottom:6px; }
.pay-amt{ font-size:42px; font-weight:900; color:#EBB93F; line-height:1; }
.pay-ref{ color:#9FB0C4; font-size:14px; margin-top:8px; }
.pay-ref b{ color:#fff; }
.pay-method{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.10); border-radius:14px; padding:18px; margin-bottom:14px; }
.pay-method h4{ color:#fff; font-size:15px; margin-bottom:12px; display:flex; align-items:center; gap:8px; letter-spacing:.02em; }
.pay-qr{ background:#fff; padding:14px; border-radius:12px; width:max-content; margin:0 auto; }
.pay-qr img, .pay-qr canvas{ display:block; }
.pay-qr-hint{ text-align:center; color:#9FB0C4; font-size:12.5px; margin-top:10px; }
.pay-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:rgba(0,0,0,.28); border-radius:10px; padding:11px 14px; margin-top:8px; }
.pay-row small{ display:block; color:#8b93a1; font-size:11px; letter-spacing:.05em; text-transform:uppercase; }
.pay-row span{ font-family:'Space Mono',monospace; color:#fff; word-break:break-all; font-size:14px; }
.copy-btn{ background:rgba(200,160,83,.18); border:1px solid rgba(200,160,83,.5); color:#EBB93F; border-radius:8px; padding:7px 13px; cursor:pointer; font-size:13px; font-weight:700; white-space:nowrap; }
.copy-btn:hover{ background:rgba(200,160,83,.28); }
.pay-online{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:54px; border-radius:12px; background:linear-gradient(135deg,#E9C15A,#C6943E); color:#1a1206; font-weight:800; text-transform:uppercase; font-size:15px; text-decoration:none; }
.pay-confirm{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; height:56px; border-radius:12px; background:#25D366; color:#06381f; font-weight:800; font-size:16px; text-decoration:none; margin-top:6px; }
.pay-confirm:hover{ filter:brightness(1.05); }
.pay-note{ text-align:center; color:#9FB0C4; font-size:13px; line-height:1.6; margin-top:16px; }
@media (max-width:768px){ .pay-card{ padding:26px 18px; } }

/*---- Payment method selector (tabs) ----*/
.pm-tabs{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:18px; }
.pm-tab{ padding:12px 4px; border-radius:12px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); color:#c9d2de; font-weight:700; font-size:12.5px; cursor:pointer; transition:.2s; line-height:1.2; }
.pm-tab:hover{ border-color:rgba(200,160,83,.5); }
.pm-tab.active{ background:linear-gradient(135deg,#E9C15A,#C6943E); color:#1a1206; border-color:transparent; }
.pm-panel{ display:none; }
.pm-panel.active{ display:block; animation:pmFade .25s ease; }
@keyframes pmFade{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:none;} }
.pm-soon{ text-align:center; padding:26px 14px; }
.pm-soon .badge{ display:inline-block; background:rgba(235,185,63,.15); border:1px solid rgba(235,185,63,.4); color:#EBB93F; padding:7px 16px; border-radius:30px; font-weight:800; font-size:13px; margin-bottom:14px; letter-spacing:.03em; }
.pm-soon p{ color:#9FB0C4; line-height:1.6; }

/*---- Counseling session picker ----*/
.cns-wrap{ max-width:640px; margin:0 auto; position:relative; z-index:3; }
.cns-card{ background:rgba(9,14,24,.88); border:1.5px solid rgba(200,160,83,.5); border-radius:20px; padding:32px 30px; color:#fff; box-shadow:0 40px 90px rgba(0,0,0,.5); }
.cns-card > h2{ color:#fff; text-align:center; font-size:26px; margin-bottom:6px; }
.cns-card > .sub{ text-align:center; color:#9FB0C4; margin-bottom:24px; }
.cns-label{ display:block; color:#c9d2de; font-weight:700; font-size:13px; letter-spacing:.04em; text-transform:uppercase; margin:18px 0 10px; }
.cns-opts{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.cns-opt input{ position:absolute; opacity:0; pointer-events:none; }
.cns-opt label{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:3px; padding:16px; border:1.5px solid rgba(255,255,255,.14); border-radius:14px; cursor:pointer; transition:.2s; background:rgba(255,255,255,.03); }
.cns-opt label:hover{ border-color:rgba(200,160,83,.5); }
.cns-opt input:checked + label{ border-color:#EBB93F; background:rgba(235,185,63,.12); }
.cns-opt .dur{ font-weight:800; font-size:16px; color:#fff; }
.cns-opt .price{ color:#EBB93F; font-weight:800; }
.cns-field{ position:relative; margin-bottom:14px; }
.cns-field input, .cns-field select{ width:100%; height:54px; padding:0 16px; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid rgba(200,160,83,.30); color:#fff; font-size:15px; }
.cns-field input::placeholder{ color:#9FB0C4; }
.cns-field select option{ color:#111; }
.cns-two{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:768px){ .cns-two{ grid-template-columns:1fr; } .cns-opts{ grid-template-columns:1fr; } .cns-card{ padding:26px 18px; } }

/*=========================================================
  HOME PAGE — videos / instagram / testimonials
=========================================================*/
/* YouTube videos */
.yt-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.yt-card{ border-radius:16px; overflow:hidden; background:#000; aspect-ratio:16/9; box-shadow:0 20px 45px rgba(0,0,0,.12); }
.yt-card iframe{ width:100%; height:100%; border:0; display:block; }
.yt-cta{ text-align:center; margin-top:34px; }
@media (max-width:900px){ .yt-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .yt-grid{ grid-template-columns:1fr; } }

/* Instagram reels */
.ig-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.ig-item{ position:relative; aspect-ratio:9/16; border-radius:14px; overflow:hidden; display:block; background:#0d1522; }
.ig-item img{ width:100%; height:100%; object-fit:cover; transition:.4s; }
.ig-item:hover img{ transform:scale(1.05); }
.ig-item::after{ content:""; position:absolute; top:50%; left:50%; width:0; height:0; transform:translate(-40%,-50%); border-style:solid; border-width:11px 0 11px 18px; border-color:transparent transparent transparent rgba(255,255,255,.92); filter:drop-shadow(0 2px 6px rgba(0,0,0,.5)); }
.ig-cta{ text-align:center; margin-top:34px; }
@media (max-width:900px){ .ig-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .ig-grid{ grid-template-columns:repeat(2,1fr); } }

/* Testimonials */
.tst-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.tst-card{ background:#fff; border-radius:20px; padding:28px; box-shadow:0 20px 45px rgba(0,0,0,.08); display:flex; flex-direction:column; }
.tst-stars{ color:#EBB93F; letter-spacing:2px; margin-bottom:12px; font-size:16px; }
.tst-card p{ color:#3a4048; line-height:1.7; flex:1; }
.tst-who{ display:flex; align-items:center; gap:12px; margin-top:18px; }
.tst-av{ width:44px; height:44px; border-radius:50%; background:linear-gradient(135deg,#D8B36A,#B88934); color:#0A1120; display:flex; align-items:center; justify-content:center; font-weight:800; }
.tst-name{ font-weight:800; color:#111; }
.tst-role{ color:#8b93a1; font-size:13px; }
@media (max-width:900px){ .tst-grid{ grid-template-columns:1fr; } }

/* Home hero with photo */
.home-hero .hh-photo{ margin-top:40px; }
.home-hero .hh-photo img{ max-width:340px; width:100%; border-radius:20px; border:1px solid rgba(200,160,83,.4); box-shadow:0 30px 70px rgba(0,0,0,.5); }

/* Transformation card tag/footer */
.tst-tag{ display:inline-block; align-self:flex-start; background:rgba(200,160,83,.14); border:1px solid rgba(200,160,83,.32); color:#A57C2A; font-weight:800; font-size:12.5px; padding:6px 13px; border-radius:30px; margin-bottom:14px; letter-spacing:.02em; }
.tst-foot{ margin-top:16px; color:#7a8291; font-weight:700; font-size:13px; }

/*=========================================================
  BOOK PAGE
=========================================================*/
.dark-page{ position:relative; background:#05070E; padding:130px 0 80px; overflow:hidden; }
.dark-page::before{ content:""; position:absolute; inset:0; background:radial-gradient(60% 60% at 80% 10%, rgba(200,160,83,.14), transparent 60%); pointer-events:none; }
.dark-page .container{ position:relative; z-index:2; }
.book-wrap{ display:grid; grid-template-columns:360px 1fr; gap:48px; align-items:start; }
.book-cover img{ width:100%; border-radius:14px; box-shadow:0 40px 80px rgba(0,0,0,.55); border:1px solid rgba(200,160,83,.35); display:block; }
.book-cover .book-fallback{ aspect-ratio:3/4; border-radius:14px; background:linear-gradient(160deg,#16203a,#0b1220); border:1px solid rgba(200,160,83,.35); display:flex; align-items:center; justify-content:center; text-align:center; color:#9FB0C4; padding:24px; box-shadow:0 40px 80px rgba(0,0,0,.55); }
.book-info h1{ color:#fff; font-size:38px; line-height:1.1; margin-bottom:8px; }
.book-info .by{ color:#EBB93F; font-weight:700; margin-bottom:18px; }
.book-info p{ color:#c9d2de; line-height:1.75; margin-bottom:16px; }
.book-list{ list-style:none; padding:0; margin:0 0 24px; }
.book-list li{ color:#c9d2de; padding:7px 0 7px 30px; position:relative; }
.book-list li::before{ content:"✓"; position:absolute; left:0; color:#EBB93F; font-weight:800; }
.fmt-opts{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:6px 0 18px; }
.fmt-opt input{ position:absolute; opacity:0; pointer-events:none; }
.fmt-opt label{ display:block; padding:18px; border:1.5px solid rgba(255,255,255,.14); border-radius:14px; cursor:pointer; transition:.2s; background:rgba(255,255,255,.03); }
.fmt-opt label:hover{ border-color:rgba(200,160,83,.5); }
.fmt-opt input:checked + label{ border-color:#EBB93F; background:rgba(235,185,63,.12); }
.fmt-opt .ft{ font-weight:800; color:#fff; font-size:16px; }
.fmt-opt .fmeta{ color:#9FB0C4; font-size:12.5px; margin:2px 0 8px; }
.fmt-opt .fp{ color:#EBB93F; font-weight:800; font-size:20px; }
.fmt-opt .fp s{ color:#8b93a1; font-weight:600; font-size:14px; margin-left:6px; }
.book-form .wh2-field{ margin-bottom:12px; }
.book-form .wh2-field input{ width:100%; height:52px; padding:0 16px; border-radius:12px; background:rgba(255,255,255,.04); border:1px solid rgba(200,160,83,.30); color:#fff; font-size:15px; }
.book-form .wh2-field input::placeholder{ color:#9FB0C4; }
.book-ship{ display:none; }
.book-ship.on{ display:block; }
.book-two{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:900px){ .book-wrap{ grid-template-columns:1fr; } .book-cover{ max-width:300px; margin:0 auto; } .book-two{ grid-template-columns:1fr; } .fmt-opts{ grid-template-columns:1fr; } }

/*=========================================================
  INDEPENDENCE DAY (15 Aug) TRICOLOR THEME
=========================================================*/
.tricolor{ height:5px; border-radius:6px; background:linear-gradient(90deg,#FF9933 0 33.3%,#ffffff 33.3% 66.6%,#138808 66.6% 100%); }
.freedom-badge{ display:inline-flex; align-items:center; gap:9px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.20); border-radius:40px; padding:6px 16px 6px 7px; margin-bottom:16px; }
.freedom-badge span{ color:#fff; font-weight:800; font-size:12.5px; letter-spacing:.03em; }
.freedom-badge svg{ animation:chakraSpin 14s linear infinite; transform-origin:center; }
@keyframes chakraSpin{ to{ transform:rotate(360deg); } }
.card-tri{ margin:-32px -30px 18px; border-radius:20px 20px 0 0; }
.wh2-freedom{ display:flex; align-items:center; justify-content:center; gap:8px; color:#EBB93F; font-weight:800; font-size:12.5px; letter-spacing:.02em; margin:-4px 0 16px; }
@media (max-width:768px){ .card-tri{ margin:-26px -18px 16px; } }

/* Combined LIVE badge inside the freedom badge */
.fb-live{ background:#E23B3B; color:#fff; font-weight:800; font-size:10.5px; padding:3px 9px; border-radius:6px; letter-spacing:.06em; display:inline-flex; align-items:center; gap:5px; }
.fb-live::before{ content:""; width:6px; height:6px; border-radius:50%; background:#fff; animation:fbPulse 1.8s infinite; }
@keyframes fbPulse{ 0%,100%{opacity:1;} 50%{opacity:.25;} }
.freedom-badge{ flex-wrap:wrap; }

/* Instagram official embeds (from reel URLs) */
.ig-embeds{ display:flex; flex-wrap:wrap; gap:20px; justify-content:center; }
.ig-embeds .instagram-media{ width:100% !important; max-width:328px !important; min-width:280px !important; margin:0 !important; }

/*=========================================================
  LEGAL PAGES (privacy, terms, refund, disclaimer)
=========================================================*/
.legal-page{ position:relative; background:#080d17; padding:130px 0 80px; }
.legal-wrap{ max-width:820px; margin:0 auto; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:46px 48px; }
.legal-wrap h1{ color:#fff; font-size:34px; line-height:1.15; margin-bottom:6px; }
.legal-updated{ color:#8b93a1; font-size:14px; margin-bottom:26px; }
.legal-wrap h2{ color:#EBB93F; font-size:20px; margin:30px 0 10px; }
.legal-wrap p{ color:#c4ccd6; line-height:1.8; margin-bottom:12px; }
.legal-wrap ul{ padding-left:22px; margin:0 0 14px; }
.legal-wrap li{ color:#c4ccd6; line-height:1.8; margin-bottom:8px; }
.legal-wrap a{ color:#EBB93F; }
.legal-note{ margin-top:26px; padding:16px 18px; border-radius:12px; background:rgba(235,185,63,.08); border:1px solid rgba(235,185,63,.25); color:#d7c290; font-size:14px; }
@media (max-width:768px){ .legal-wrap{ padding:30px 20px; } .legal-wrap h1{ font-size:27px; } }

/*=========================================================
  GALLERY PAGE
=========================================================*/
.gallery-page{ position:relative; background:#080d17; padding:130px 0 80px; }
.gal-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:34px; }
.gal-item{ display:block; border-radius:14px; overflow:hidden; aspect-ratio:4/3; background:#0d1522; border:1px solid rgba(255,255,255,.06); }
.gal-item img{ width:100%; height:100%; object-fit:cover; transition:.45s ease; display:block; }
.gal-item:hover img{ transform:scale(1.06); }
.gal-empty{ text-align:center; color:#9FB0C4; padding:50px 20px; line-height:1.9; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:16px; margin-top:20px; }
@media (max-width:900px){ .gal-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .gal-grid{ grid-template-columns:1fr; } }

/*=========================================================
  PAYMENT PROOF SUBMISSION
=========================================================*/
.proof-box{ background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.10); border-radius:14px; padding:20px; margin-top:6px; }
.proof-box h3{ color:#fff; font-size:16px; }
.proof-form label{ display:block; color:#c4ccd6; font-size:13px; font-weight:600; margin:12px 0 6px; }
.proof-form input[type=text]{ width:100%; height:46px; padding:0 14px; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.18); color:#fff; }
.proof-form input[type=file]{ width:100%; padding:11px 12px; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.18); color:#c4ccd6; font-size:13px; }
.proof-form input:focus{ outline:none; border-color:#EBB93F; }
.proof-err{ background:rgba(255,80,110,.12); border:1px solid rgba(255,80,110,.4); color:#ff9db0; padding:10px 14px; border-radius:10px; margin-bottom:12px; font-size:14px; }
.proof-done{ text-align:center; padding:14px 6px; }
.proof-tick{ width:64px; height:64px; margin:0 auto 14px; border-radius:50%; background:linear-gradient(135deg,#2fae6a,#12351f); color:#fff; font-size:32px; display:flex; align-items:center; justify-content:center; }
.proof-done h3{ color:#fff; font-size:20px; margin-bottom:8px; }
.proof-done p{ color:#9FB0C4; font-size:14px; line-height:1.7; margin-bottom:16px; }