/* Leena Pashte Yoga Studio — implements the Claude Design project
   "Leena Pashte Yoga Design System" (tokens copied verbatim). */

/* ---------- tokens: colors (sampled from the logo) ---------- */
:root{
--cream-50:#FBF7EE;--cream-100:#F4EDDE;--cream-200:#EBE1CC;--cream-300:#D9C9AA;
--terracotta-300:#D49A7E;--terracotta-400:#C67A5C;--terracotta-500:#B05C40;--terracotta-600:#9A4B2F;--terracotta-700:#7E3B23;
--green-500:#557F47;--green-600:#45703A;--green-700:#38602E;
--gold-400:#D3944E;--gold-500:#C07B36;--gold-600:#A96526;
--brown-950:#2E1F15;--brown-900:#3A2A1E;--brown-700:#5C4736;--brown-500:#7A6552;
--wa-500:#1DAA61;--wa-600:#178A4E;--wa-700:#128C46;--wa-50:#E9F7EF;
--surface-page:var(--cream-50);--surface-card:#FFFDF8;--surface-tint:var(--cream-100);--surface-dip:var(--cream-200);
--text-strong:var(--brown-950);--text-body:var(--brown-900);--text-muted:var(--brown-500);--text-on-dark:#FFF9EF;--text-on-dark-muted:#CBB9A6;--surface-dark:var(--brown-950);
--brand:var(--terracotta-600);--brand-soft:var(--terracotta-400);--accent-green:var(--green-600);--accent-gold:var(--gold-500);
--cta-whatsapp:var(--wa-500);--cta-whatsapp-press:var(--wa-600);
--border-soft:var(--cream-200);--border-strong:var(--cream-300);
--link:var(--terracotta-700);--link-hover:var(--terracotta-500);
--focus-ring:rgba(192,123,54,.55);
--tint-terracotta:#F2DFD4;--tint-green:#E4EBDD;--tint-gold:#F3E4CE;--tint-neutral:var(--cream-200);
--tint-terracotta-text:var(--terracotta-700);--tint-green-text:var(--green-700);--tint-gold-text:#8A5220;--tint-neutral-text:var(--brown-700);
}

/* ---------- tokens: typography & spacing ---------- */
:root{
--font-ui:"Noto Sans Devanagari",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Mangal",sans-serif;
--font-display:"GT Alpina",Georgia,system-ui,"Noto Sans Devanagari",serif;
--text-sm:16px;--text-base:18px;--text-lg:20px;--text-xl:22px;--text-2xl:26px;--text-3xl:30px;--text-4xl:36px;
--leading-body:1.7;--leading-heading:1.35;
--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-pill:999px;
--shadow-card:0 1px 3px rgba(58,42,30,.08),0 4px 16px rgba(58,42,30,.06);
--tap-min:48px;--tap-cta:56px;
--page-pad:20px;
}

/* GT Alpina (display serif). Files are OPTIONAL — drop the four trial woff2
   files from the design project into assets/fonts/ and they load; otherwise
   Georgia (the designed fallback) is used. See assets/fonts/README.md. */
@font-face{font-family:"GT Alpina";src:url("./assets/fonts/GT-Alpina-Standard-Regular-Trial.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"GT Alpina";src:url("./assets/fonts/GT-Alpina-Standard-Regular-Italic-Trial.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"GT Alpina";src:url("./assets/fonts/GT-Alpina-Standard-Medium-Trial.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"GT Alpina";src:url("./assets/fonts/GT-Alpina-Standard-Bold-Trial.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

/* ---------- base ---------- */
*{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-ui);font-size:var(--text-base);line-height:var(--leading-body);-webkit-text-size-adjust:100%}
h1,h2,h3{color:var(--text-strong);line-height:var(--leading-heading);margin:0}
a{color:var(--link);text-decoration:underline;text-underline-offset:3px}
a:hover{color:var(--link-hover)}
:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
img{max-width:100%;display:block}
p{margin:0}
/* This brand does not animate. Press feedback is color, not motion. */
*{animation:none!important;transition:none!important}

/* ---------- language switching (no-flash, CSS-driven) ---------- */
html[data-view="picker"] .site{display:none}
html[data-view="site"] .picker{display:none}
html[data-lang="mr"] [data-lang-section]:not([data-lang-section="mr"]){display:none!important}
html[data-lang="hi"] [data-lang-section]:not([data-lang-section="hi"]){display:none!important}
html[data-lang="en"] [data-lang-section]:not([data-lang-section="en"]){display:none!important}

/* ---------- buttons (design system: the only CTA is WhatsApp green) ---------- */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;font-family:var(--font-ui);text-decoration:none;cursor:pointer;border-radius:var(--radius-md);width:100%;padding:0 24px;border:none;line-height:1.3}
.btn-wa{background:var(--cta-whatsapp);color:#fff;min-height:var(--tap-cta);font-size:20px;font-weight:700}
.btn-wa:hover{color:#fff}
.btn-wa:active{background:var(--cta-whatsapp-press)}
.btn-wa svg{flex-shrink:0}
.btn-primary{background:var(--terracotta-600);color:var(--text-on-dark);min-height:var(--tap-cta);font-size:20px;font-weight:700}
.btn-primary:hover{color:var(--text-on-dark)}
.btn-primary:active{background:var(--terracotta-700)}
.btn-outline{background:transparent;color:var(--terracotta-600);border:2px solid var(--terracotta-500);min-height:var(--tap-min);font-size:18px;font-weight:600}
.btn-outline:hover{color:var(--terracotta-600)}
.btn-outline:active{background:var(--cream-200)}
.btn-lg{min-height:var(--tap-cta)}

/* ---------- language picker (first visit) ---------- */
.picker{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px}
.picker-logo{background:var(--surface-tint);border-radius:20px;padding:10px}
.picker-logo img{width:132px;height:132px;border-radius:12px}
.picker .overline{margin-top:24px}
.picker-title{font-size:24px;font-weight:700;color:var(--text-strong);margin-top:6px}
.picker-sub{font-size:16px;color:var(--text-muted);margin-top:2px;margin-bottom:24px}
.picker-buttons{display:flex;flex-direction:column;gap:12px;width:100%;max-width:340px}
.picker-note{font-size:14px;color:var(--text-muted);margin-top:20px}

/* ---------- header ---------- */
.top{background:var(--surface-tint);border-bottom:1px solid var(--border-soft)}
.top-inner{max-width:880px;margin:0 auto;padding:16px var(--page-pad);display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between}
.top-brand{display:flex;align-items:center;gap:14px}
.top-brand img{width:56px;height:56px;border-radius:10px}
.top-name{font-size:20px;font-weight:700;color:var(--terracotta-600);line-height:1.3}
.lang-toggle{flex:1 1 240px;max-width:340px;display:flex;gap:4px;background:var(--cream-200);border-radius:var(--radius-pill);padding:4px}
.lang-toggle button{flex:1;min-height:40px;border:none;cursor:pointer;border-radius:var(--radius-pill);font-family:var(--font-ui);font-size:16px;font-weight:400;background:transparent;color:var(--brown-700)}
.lang-toggle button[aria-pressed="true"]{background:var(--terracotta-600);color:var(--cream-50);font-weight:700}

/* ---------- sections ---------- */
.section{max-width:880px;margin:64px auto 0;padding:0 var(--page-pad)}
.rule{width:48px;height:3px;border-radius:2px;background:var(--terracotta-500)}
.overline{font-family:var(--font-display);font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-gold)}
.rule+.overline{margin-top:12px}
.section h2{font-size:28px;font-weight:700;margin-top:6px}
.lede{margin-top:6px}

/* ---------- hero ---------- */
.hero{max-width:880px;margin:0 auto;padding:48px var(--page-pad) 0;text-align:center}
.hero h1{font-size:clamp(32px,5.5vw,44px);font-weight:700;line-height:1.3;margin:12px auto 0;max-width:640px}
.hero p{font-size:19px;margin:12px auto 0;max-width:560px}
.hero-badge{margin-top:14px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin:24px auto 0;max-width:560px}
.hero-ctas a{flex:1 1 220px;display:flex;align-items:center;justify-content:center;min-height:56px;border-radius:var(--radius-md);text-decoration:none;padding:0 24px}
.hero-ctas .cta-fill{background:var(--terracotta-600);color:var(--text-on-dark);font-size:20px;font-weight:700}
.hero-ctas .cta-fill:active{background:var(--terracotta-700)}
.hero-ctas .cta-line{border:2px solid var(--terracotta-500);color:var(--terracotta-600);font-size:19px;font-weight:600}
.hero-ctas .cta-line:active{background:var(--cream-200)}
.hero-img{margin-top:32px;width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:var(--radius-lg);border:1px solid var(--cream-300)}

/* ---------- badges ---------- */
.badge{display:inline-block;padding:3px 12px;border-radius:var(--radius-pill);font-size:15px;font-weight:600}
.badge-sm{padding:2px 10px;font-size:14px}
.badge-gold{background:var(--tint-gold);color:var(--tint-gold-text)}
.badge-terracotta{background:var(--tint-terracotta);color:var(--tint-terracotta-text)}
.badge-green{background:var(--tint-green);color:var(--tint-green-text)}

/* ---------- cards ---------- */
.card{background:var(--surface-card);border:1px solid var(--border-soft);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}
.card-list{padding:4px 24px}
.card-pad{padding:24px}
.card-rules{padding:18px 24px}
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:20px;align-items:start}
.stack{display:flex;flex-direction:column;gap:12px}

/* schedule rows */
.sched-row{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--border-soft)}
.sched-row:last-child{border-bottom:none}
.sched-time{font-family:var(--font-display);font-size:19px;font-weight:700;color:var(--terracotta-600);min-width:96px}
.sched-name{font-weight:600;color:var(--text-strong)}
.sched-days{font-size:16px;color:var(--text-muted);margin-top:2px}

/* price rows */
.price-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--border-soft)}
.price-row:last-child{border-bottom:none}
.price-label{font-weight:600;color:var(--text-strong)}
.price-sub{font-size:16px;color:var(--text-muted)}
.price{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--text-strong);white-space:nowrap}
.price small{font-size:15px;font-weight:400;color:var(--text-muted)}

/* teacher card */
.teacher{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.teacher-photo{flex:1 1 240px;max-width:360px}
.teacher-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-md);border:1px solid var(--cream-300)}
.teacher-bio{flex:1.6 1 260px}
.teacher-name{font-size:22px;font-weight:700;color:var(--text-strong)}
.teacher-bio p{margin-top:8px}
.sig{font-family:var(--font-display);font-style:italic;font-size:22px;color:var(--terracotta-600);margin-top:12px}

/* rules list */
.rules-title{font-size:16px;font-weight:700;color:var(--text-strong)}
.rules{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.rules div{display:flex;gap:10px;font-size:17px}
.rules span:first-child{color:var(--terracotta-500)}

/* hall band */
.band{background:var(--surface-tint);margin-top:64px;padding:48px 0;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft)}
.band .section{margin-top:0}
.photo-4x3{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-lg);border:1px solid var(--cream-300)}

/* CTA row under sections */
.cta-wrap{max-width:560px;margin:20px auto 0}
.cta-hint{font-size:15px;color:var(--text-muted);text-align:center;margin-top:8px}

/* visit card */
.visit-address{font-weight:600;color:var(--text-strong)}
.visit-landmark{font-size:16px;color:var(--text-muted);margin-top:4px}
.visit-hours{font-size:17px;margin-top:14px}
.visit-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.visit-links a{flex:1 1 200px;display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:var(--radius-md);border:2px solid var(--terracotta-500);color:var(--terracotta-600);font-size:18px;font-weight:600;text-decoration:none;padding:0 20px}
.visit-links a:active{background:var(--cream-200)}

/* footer */
.foot{background:var(--surface-dark);margin-top:64px;padding:40px 0 48px}
.foot-inner{max-width:480px;margin:0 auto;padding:0 var(--page-pad);display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.foot-logo{background:var(--surface-tint);border-radius:var(--radius-md);padding:6px}
.foot-logo img{width:56px;height:56px;border-radius:var(--radius-sm)}
.foot-name{font-size:19px;font-weight:700;color:var(--text-on-dark)}
.foot-inner .btn{width:100%}
.foot-phone{color:var(--text-on-dark);font-size:17px}
.foot-copy{font-size:14px;color:var(--text-on-dark-muted);margin-top:8px}
