/*! JYOTISH.info /why/ deck — slide layouts. Built on deck.css (tokens, chrome, parts). © SellnShip Solutions Pvt. Ltd. */

.copy{min-width:0}
.copy>*+*{margin-top:clamp(10px,1.6vh,18px)}
.copy>.eyebrow{margin-top:0}
.copy>h1,.copy>h2{margin-top:0}
.kicker{font-family:var(--f-display);font-style:italic;font-size:clamp(1.35rem,1rem + 1.4vw,2.2rem);line-height:1.15;color:var(--accent2);margin:0}
html[lang="hi"] .kicker{font-family:var(--f-dev);font-style:normal;font-size:clamp(1.15rem,.95rem + 1.1vw,1.8rem)}
.dev{font-family:var(--f-dev)}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ticks li{position:relative;padding-left:24px;color:var(--fg);line-height:1.45}
.ticks li::before{content:"";position:absolute;left:3px;top:.62em;width:7px;height:7px;background:var(--accent);transform:rotate(45deg)}
.copy>.lead+.ticks,.copy>.lead+.parts,.copy>.lead+.chips{margin-top:clamp(18px,2.8vh,30px)}

/* ---- 1 · the sky ---- */
#s1 .cols{align-items:center}
.wheelbox{position:relative;width:min(100%,540px);justify-self:center;aspect-ratio:1}
#wheel{display:block;width:100%;height:100%;overflow:visible}
#wheel .w-spin{transform-origin:0 0;transform-box:view-box;animation:wspin 480s linear infinite}
@keyframes wspin{to{transform:rotate(360deg)}}
.calm #wheel .w-spin{animation:none}
#wheel .w-r1{fill:none;stroke:var(--brass);stroke-width:1.5;opacity:.75}
#wheel .w-r2{fill:none;stroke:var(--brass);stroke-width:.8;opacity:.4}
#wheel .w-tk{stroke:var(--brass);stroke-width:.8;opacity:.5}
#wheel .w-sg{stroke:var(--brass2);stroke-width:1.3;opacity:.65}
#wheel .w-st{fill:var(--brass2)}
#wheel .w-st.s0{opacity:.95}#wheel .w-st.s1{opacity:.7}#wheel .w-st.s2{opacity:.5}
#wheel .w-hi{fill:rgba(201,162,78,.2);stroke:var(--brass2);stroke-width:1}
#wheel .w-mh{fill:rgba(207,214,230,.16)}
#wheel .w-mc{fill:#eef2fb}
#wheel .w-moon{filter:drop-shadow(0 0 7px rgba(207,214,230,.85))}
#wheel .w-chart *{fill:none;stroke:var(--brass);stroke-width:1;opacity:.55}
.moonline{display:flex;align-items:center;gap:10px;color:var(--fg2);font-size:.95rem}
.moonline[hidden]{display:none}
.moonline::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--moon);box-shadow:0 0 12px 2px rgba(207,214,230,.55)}
.moonline b{color:var(--moon);font-weight:500}
@media(max-width:900px){
  #s1 .wheelbox{position:absolute;right:-38%;top:2%;width:min(120vw,560px);opacity:.3;z-index:-1;pointer-events:none}
  #s1 .copy{padding-top:2vh}
}

/* ---- 2 · what you get ---- */
.gifts{list-style:none;margin:clamp(14px,2.6vh,30px) 0 14px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(min-width:760px){.gifts{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}}
.gift{background:var(--glass2);border:1px solid var(--line2);border-radius:var(--radius);padding:14px 14px 16px;min-width:0}
.gift .ic{display:block;width:32px;height:32px;stroke:var(--brass);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:8px}
.gift h3{font-family:var(--f-display);font-size:1.32rem;line-height:1.1;margin-bottom:4px;color:var(--fg)}
html[lang="hi"] .gift h3{font-family:var(--f-dev);font-size:1.15rem;line-height:1.3}
.gift p{font-size:.86rem;line-height:1.45;color:var(--fg2)}
.gift.hot{border-color:var(--brass-line);background:linear-gradient(180deg,rgba(201,162,78,.14),rgba(201,162,78,.04))}
.gift.hot .ic{stroke:var(--brass2)}
@media(max-width:559px){
  #s2 .lead{display:none}
  .gift{padding:11px 12px 12px}.gift .ic{width:26px;height:26px;margin-bottom:5px}.gift h3{font-size:1.15rem}.gift p{font-size:.8rem;line-height:1.38}
}

/* ---- 3 · the animal ---- */
.s3grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "fig" "info";gap:10px 44px;align-items:center}
.s3grid .head{grid-area:head;min-width:0}.s3grid .figcol{grid-area:fig;min-width:0;display:grid;gap:10px}.s3grid .info{grid-area:info;min-width:0}
@media(min-width:901px){
  .s3grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-areas:"head fig" "info fig";grid-template-rows:auto auto;align-content:center;row-gap:0}
  .s3grid .head{align-self:end}.s3grid .info{align-self:start}
}
.figbox{position:relative;width:100%;height:clamp(240px,36vh,330px);border-radius:26px;background:radial-gradient(52% 56% at 50% 54%,rgba(36,52,104,.5),rgba(10,15,30,.0) 74%)}
@media(min-width:901px){.figbox{height:min(60vh,560px)}}
.figbox canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.figbox.nofig::after{content:"";position:absolute;left:50%;top:50%;width:90px;height:90px;margin:-45px 0 0 -45px;border:1px solid var(--brass-line);border-radius:50%}
.pickrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center}
.pkb{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:rgba(10,15,29,.75);color:var(--fg2);cursor:pointer;display:grid;place-items:center;padding:0}
.pkb:hover{border-color:var(--accent);color:var(--fg)}
.pkb svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.strip{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding:4px 14px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(90deg,transparent,#000 22px,#000 calc(100% - 22px),transparent);-webkit-overflow-scrolling:touch}
.strip::-webkit-scrollbar{display:none}
.chip.pk{flex:none;min-height:34px}
.chip.pk.on{border-color:var(--brass);color:var(--brass2);background:rgba(201,162,78,.16)}
html[lang="hi"] .chip.pk{font-family:var(--f-dev);font-size:.95rem}
#s3nature{margin-top:6px}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px;margin:14px 0 12px}
.facts>div{min-width:0}
.facts dt{font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);margin-bottom:2px}
html[lang="hi"] .facts dt{letter-spacing:.04em;text-transform:none;font-size:.78rem}
.facts dd{margin:0;font-size:.95rem;line-height:1.35;color:var(--fg)}
.chip.mine{margin-top:10px;border-color:var(--brass-line);color:var(--brass2)}
.chip.mine[hidden]{display:none}
@media(max-width:900px){
  .s3grid .info .small{display:none}
  .facts{margin:10px 0 4px;gap:8px 16px}.facts dd{font-size:.88rem}
  #s3nature{font-size:1rem}
}
@media(max-width:560px) and (max-height:760px){.facts{display:none}}

/* ---- 4 · ask ---- */
.parts{list-style:none;counter-reset:p;margin:6px 0 0;padding:0;display:grid;gap:12px}
.parts li{counter-increment:p;display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:12px;align-items:start}
.parts li::before{content:counter(p);grid-row:1/3;width:28px;height:28px;border-radius:50%;border:1px solid var(--brass-line);color:var(--brass2);display:grid;place-items:center;font:500 .85rem var(--f-mono);margin-top:1px}
html[lang="hi"] .parts li::before{content:counter(p,devanagari);font-family:var(--f-dev)}
.parts b{font-weight:500;color:var(--fg)}
.parts span{color:var(--fg2);font-size:.95rem;line-height:1.45}
.shot.ask{max-width:520px;justify-self:center;width:100%}
@media(max-width:900px){.parts span{font-size:.88rem}.parts{gap:8px}}
@media(max-width:560px){#s4 .lead{display:none}.parts li:nth-child(n+2) span{display:none}.parts li:nth-child(n+2){align-items:center}.parts li:nth-child(n+2)::before{grid-row:1}}
@media(max-width:560px){.shot.ask img{-webkit-mask-image:linear-gradient(180deg,#000 86%,transparent);mask-image:linear-gradient(180deg,#000 86%,transparent)}.shot.milan img{-webkit-mask-image:linear-gradient(180deg,#000 86%,transparent);mask-image:linear-gradient(180deg,#000 86%,transparent)}#s4 .chips{gap:6px}#s4 .chip{min-height:28px;padding:2px 10px;font-size:.78rem}.shot.ask{max-width:100%}.shot.ask img{max-height:38vh;object-fit:cover;object-position:top}}

/* ---- 5 · promise ---- */
.promise{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:clamp(12px,2.4vh,26px)}
@media(min-width:901px){.promise{grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:18px;align-items:stretch}}
.pcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pc{background:var(--glass2);border:1px solid var(--line2);border-radius:var(--radius);padding:13px 15px 15px;min-width:0}
.pc h3{font-family:var(--f-display);font-size:1.3rem;line-height:1.15;margin-bottom:5px;color:var(--fg)}
html[lang="hi"] .pc h3{font-family:var(--f-dev);font-size:1.1rem;line-height:1.35}
.pc p{font-size:.88rem;line-height:1.45;color:var(--fg2)}
.never h3{font:500 .74rem var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
html[lang="hi"] .never h3{letter-spacing:.04em;text-transform:none;font-size:.9rem}
.never ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.never li{position:relative;padding-left:28px;color:var(--fg);font-size:1rem;line-height:1.4}
.never li::before{content:"";position:absolute;left:2px;top:.3em;width:15px;height:15px;background:linear-gradient(45deg,transparent 43%,var(--brass) 43% 57%,transparent 57%),linear-gradient(-45deg,transparent 43%,var(--brass) 43% 57%,transparent 57%)}
.tested{margin-top:clamp(10px,1.6vh,16px);max-width:84ch}
#s5 .wrap>.small+.small{margin-top:4px}
@media(max-width:700px){
  #s5 .lead{display:none}
  .pcards{grid-template-columns:minmax(0,1fr);gap:8px}
  .pc{padding:10px 13px 11px}.pc h3{font-size:1.15rem;margin-bottom:2px}.pc p{font-size:.82rem;line-height:1.38}
  .never li{font-size:.92rem}.never ul{gap:8px}
  #s5 .wrap>.small{font-size:.78rem;line-height:1.45}
}

/* ---- 6 · Prashna ---- */
.shot.prashna{max-width:350px;justify-self:center;width:100%}
.shot.prashna img{max-height:min(70vh,720px);object-fit:cover;object-position:top;-webkit-mask-image:linear-gradient(180deg,#000 84%,transparent);mask-image:linear-gradient(180deg,#000 84%,transparent)}
@media(max-width:900px){.shot.prashna{max-width:310px}.shot.prashna img{max-height:38vh;-webkit-mask-image:linear-gradient(180deg,#000 90%,transparent);mask-image:linear-gradient(180deg,#000 90%,transparent)}}
@media(max-width:900px){#s6 .copy{order:0}#s6 .cols.rev>:first-child{order:0}}

/* ---- 7 · Milan ---- */
@media(min-width:901px){#s7 .cols{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)}}
.shot.milan img{object-fit:cover;object-position:top}
.shot.milan figcaption{font-size:.78rem;padding:8px 12px}
@media(max-width:700px){.shot.milan{max-width:320px;justify-self:center;width:100%}.shot.milan img{max-height:36vh}#s7 .ticks li:nth-child(n+3){display:none}#s7 .lead{font-size:.95rem}}

/* ---- 8 · Diwali ---- */
.diwali{display:grid;gap:14px;align-content:start;border-color:rgba(240,162,75,.35);background:linear-gradient(180deg,rgba(240,162,75,.09),rgba(12,17,31,.78))}
.diyas{display:block;width:100%;max-width:300px;height:auto;margin:0 auto -2px}
.diyas .bowl{fill:#b8650a}
.diyas .fl{fill:#ffcf7a;transform-box:fill-box;transform-origin:50% 100%;animation:flick 2.6s ease-in-out infinite}
.diyas .gl{fill:rgba(255,190,90,.28)}
.diyas g:nth-child(2n) .fl{animation-delay:-.7s}.diyas g:nth-child(3n) .fl{animation-delay:-1.4s}
@keyframes flick{0%,100%{transform:scale(1,1)}35%{transform:scale(.88,1.1)}70%{transform:scale(1.06,.94)}}
.calm .diyas .fl{animation:none}
.fres .when{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
html[lang="hi"] .fres .when{letter-spacing:.04em;text-transform:none;font-size:.88rem}
.fres .time{font-family:var(--f-display);font-size:clamp(2.1rem,1.3rem + 3.2vw,3.8rem);line-height:1.04;color:var(--fg);white-space:nowrap;font-variant-numeric:lining-nums}
html[lang="hi"] .fres .time{font-family:var(--f-dev);font-size:clamp(1.8rem,1.2rem + 2.6vw,3.1rem);white-space:normal}
.fres .time i{font-style:normal;color:var(--accent2);padding:0 .12em}
.fres .date{margin-top:6px;color:var(--fg);font-size:1.02rem}
.fres .date em{font-style:normal;color:var(--accent2);margin-left:6px}
.fres .why{margin-top:10px;font-size:.82rem;line-height:1.55;color:var(--fg3)}
.fres .bad{color:var(--fg2)}
.soon{display:flex;align-items:center;gap:10px;color:var(--fg2);font-size:.95rem}
@media(max-width:560px){#s8 .lead{display:none}.fres .why{font-size:.76rem;line-height:1.45}}

/* ---- 9 · prices ---- */
.ptab-w{margin:clamp(12px,2.4vh,26px) 0 12px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--glass)}
.ptab{width:100%;border-collapse:collapse;font-size:.95rem}
.ptab th,.ptab td{padding:10px 16px;text-align:left;vertical-align:top;border-top:1px solid var(--line2)}
.ptab thead th{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:500;border-top:0;background:rgba(201,162,78,.07)}
html[lang="hi"] .ptab thead th{letter-spacing:.04em;text-transform:none;font-size:.82rem}
.ptab tbody th{font-weight:500;color:var(--fg);white-space:nowrap}
.ptab td.num{white-space:nowrap;color:var(--brass2);font-family:var(--f-display);font-size:1.3rem;line-height:1.2;font-variant-numeric:lining-nums}
.ptab td:last-child{color:var(--fg2)}
.ptab tr.free td.num{color:var(--mint)}
@media(max-width:760px){
  .ptab thead{display:none}
  .ptab,.ptab tbody{display:block}
  .ptab tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 12px;padding:9px 13px;border-top:1px solid var(--line2)}
  .ptab tr:first-child{border-top:0}
  .ptab th,.ptab td{padding:0;border:0}
  .ptab tbody th{grid-column:1;white-space:normal}
  .ptab td.num{grid-column:2;grid-row:1;text-align:right;font-size:1.15rem}
  .ptab td:last-child{grid-column:1/-1;font-size:.82rem;line-height:1.4}
}

/* ---- 10 · try it ---- */
.tryit{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(16px,3vw,56px);align-items:start}
.tryit>*{min-width:0}
@media(min-width:901px){
  .tryit{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"copy fout" "copy fin";grid-template-rows:auto 1fr;row-gap:clamp(14px,2.4vh,26px);align-content:center}
  .tryit>.copy{grid-area:copy}.tryit>.fout{grid-area:fout;align-self:start}.tryit>.finale{grid-area:fin;margin-top:0;align-self:start}
}
.finder{display:grid;gap:12px;margin-top:clamp(10px,2vh,18px);max-width:520px}
.finder .row2{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
.finder .check{padding-bottom:10px}
.ferr{min-height:1.2em;color:#ffb38a;margin:0}
.fout{min-height:250px;display:grid;align-content:center}
.fout .empty{color:var(--fg3);text-align:center;font-size:.95rem}
.fcard{display:grid;gap:14px}
.fcard .top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(12px,2vw,22px);align-items:center}
.fmini{position:relative;width:clamp(110px,14vw,170px);aspect-ratio:1.15;border-radius:18px;background:radial-gradient(54% 58% at 50% 54%,rgba(36,52,104,.5),rgba(10,15,30,0) 74%)}
.fmini canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.fcard h3.nm{font-family:var(--f-display);font-size:clamp(2rem,1.3rem + 2.4vw,3.3rem);line-height:1.02;color:var(--fg);overflow-wrap:anywhere}
html[lang="hi"] .fcard h3.nm{font-family:var(--f-dev);line-height:1.15;font-size:clamp(1.8rem,1.2rem + 2vw,2.8rem)}
.fcard .sub{color:var(--accent2);font-size:.95rem;margin-top:4px}
.fcard .animal{color:var(--fg);margin-top:6px}
.fcard .animal b{font-weight:500;color:var(--accent2)}
.fcard .eyebrow{margin-bottom:6px}
.fcard .nature{color:var(--fg2);font-size:.98rem;line-height:1.5}
@media(max-width:560px){
  .fcard{gap:12px}
  .fcard .top{grid-template-columns:92px minmax(0,1fr);gap:10px}
  .fmini{width:92px}
  .fcard .eyebrow{font-size:.64rem;letter-spacing:.1em;margin-bottom:4px}
  .fcard .eyebrow::after{display:none}
  .fcard h3.nm{font-size:1.9rem}
  .fcard .sub{font-size:.88rem}
  .fcard .animal{font-size:.9rem;margin-top:4px}
}
.fcard .note{color:var(--fg3);font-size:.86rem;line-height:1.5}
.fcard .alt{display:grid;gap:8px}
.fcard .alt>div{border:1px solid var(--line);border-radius:12px;padding:8px 12px;background:var(--glass2);display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.fcard .alt b{font-family:var(--f-display);font-size:1.3rem;font-weight:500;color:var(--fg)}
html[lang="hi"] .fcard .alt b{font-family:var(--f-dev);font-size:1.1rem}
.fcard .alt span{color:var(--fg3);font-size:.84rem}
.finale{margin-top:clamp(14px,2.6vh,30px);display:grid;gap:12px}
.foot{max-width:92ch;line-height:1.6}
@media(max-width:900px){
  .fout:has(.empty){display:none}
  .fout{min-height:0}
  #s10 .lead{font-size:.95rem}
  .finder .field input{min-height:44px}
}
@media(max-width:560px){#s10 .lead{font-size:.88rem;line-height:1.45}#s10 .foot{font-size:.76rem;line-height:1.5}#s10 .finder{gap:10px}#s10 .finale{margin-top:0}}
