/* icookmagic - home, MagicApp, help, legal, events, sitemap.
   Look: XD "home_page_banner__1" (countdown band) + owner PDF "home page 1.pdf".
   Colours come from im.css variables or were sampled from her PDF render. */
:root{
  --hp-red:#800404;      /* PDF: "Thousands of Recipes..." */
  --hp-tadka:#C4121A;    /* PDF: "Pyaar Ka Tadka." */
  --hp-grey:#E3E2E2;     /* PDF: stats row */
  --hp-bar:#636363;      /* PDF: Magic Mixx / Grocery Kits label bars */
  --hp-soft:#EDEDED;     /* PDF: partners section */
  --hp-tribe:#F4F4F4;    /* PDF: tribe section */
  --hp-cat:#E5A000;      /* PDF: blog category "Other" */
  --bn-card:#ECEDF2; --bn-inner:#232429; --bn-pink:#E8336D; --bn-green:#70F768;
}

/* ---------- XD countdown band (home_page_banner__1, 1920x279) ---------- */
.bn{background:#060606;color:#fff;padding:28px var(--gut) 32px}
.bn-top{display:flex;align-items:center;gap:24px;flex-wrap:wrap;max-width:1800px;margin:0 auto}
.bn-h{font-family:var(--serif);font-weight:400;font-size:var(--fs-xl);line-height:1.2;margin:0;color:#fff}
.bn-h em{color:var(--bn-green);font-style:italic;box-shadow:0 3px 0 var(--bn-pink);padding-bottom:2px}
.bn-logos{display:flex;gap:16px;align-items:center}
.bn-logos img{height:64px;width:auto;border-radius:var(--r-s)}
.bn-side{margin-left:auto;display:flex;align-items:center;gap:24px}
.bn-pill{background:var(--bn-green);color:#000;font-weight:700;font-size:var(--fs-s);border-radius:999px;height:28px;padding:0 16px;display:inline-flex;align-items:center}
.bn-side .copy{color:#DBA3B7;font-family:var(--sans);font-weight:700;font-size:var(--fs-s);background:none;border:0;cursor:pointer;padding:8px 0}
.bn-note{max-width:1800px;margin:12px auto 0;font-size:var(--fs-xs);color:#A3A3A3}
.bn-note a{color:#DBA3B7}
.bn-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1800px;margin:24px auto 0}
.bn-card{position:relative;display:block;background:var(--bn-card);border-radius:70px;padding:22px 16px 28px;box-shadow:0 8px 0 0 var(--bn-pink);text-decoration:none;color:#fff}
.bn-card .lbl{position:absolute;top:4px;left:56px;font-family:var(--sans);font-weight:700;font-size:var(--fs-xs);line-height:16px;color:#111}
.bn-card .lbl b{color:var(--bn-pink)}
.bn-in{background:var(--bn-inner);border-radius:46px;min-height:92px;display:grid;grid-template-columns:minmax(110px,1fr) auto auto;align-items:center;gap:12px;padding:8px 14px 8px 28px;box-shadow:0 0 0 1px rgba(112,247,104,.45)}
.bn-txt{min-width:0;font-family:var(--sans);font-size:var(--fs-xs);line-height:1.35;color:#E6E6E6}
.bn-txt .s{font-family:var(--serif);font-size:var(--fs-s);color:#fff;line-height:1.25}
.bn-txt .s em,.bn-txt .big{font-family:var(--serif);font-style:italic;color:var(--neon-text)}
.bn-txt .big{font-size:var(--fs-m);line-height:1.15}
.bn-clock{display:flex;align-items:flex-start;gap:3px}
.bn-clock .u{display:flex;flex-direction:column;align-items:center;gap:6px}
.bn-clock .d{width:40px;height:46px;border-radius:var(--r-s);background:linear-gradient(#FBF7EE,#E4D9C3);border:1px solid #A58C7F;box-shadow:0 2px 3px rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:700;font-size:var(--fs-l);color:#1A1A1A;line-height:1}
.bn-clock .t{font-family:var(--sans);font-size:var(--fs-xs);line-height:1;color:#A3A3A3;white-space:nowrap}
.bn-clock .dot{width:4px;height:4px;border-radius:50%;background:var(--bn-green);margin-top:21px;flex:none}
.bn-act{display:flex;flex-direction:column;align-items:center;gap:8px}
.bn-act .date{font-family:var(--sans);font-weight:700;font-size:var(--fs-m);color:#fff}
.bn-act .go{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--bn-pink);color:#fff;border-radius:999px;font-family:var(--sans);font-weight:700;font-size:var(--fs-xs);line-height:1.2;text-align:center;padding:4px 12px;min-height:30px;white-space:nowrap}
.bn-rec{position:absolute;left:0;right:0;bottom:6px;text-align:center;color:var(--bn-pink);font-family:var(--sans);font-weight:600;font-size:var(--fs-xs);line-height:16px}
/* laptops below 1400 (page scaled to 0.8): smaller tiles so the three pills keep one line each */
@media (min-width:1200px) and (max-width:1400px){.bn-cards{gap:12px}.bn-card{padding:22px 8px 28px}.bn-card .lbl{left:52px}.bn-clock .d{width:34px;height:40px;font-size:var(--fs-m)}.bn-in{grid-template-columns:minmax(80px,1fr) auto auto;padding:8px 10px 8px 20px;gap:8px}.bn-act .go{padding:4px 10px}.bn-act .date{font-size:var(--fs-s)}}
@media (max-width:1199px){.bn-cards{grid-template-columns:1fr;max-width:760px}}
@media (max-width:900px){.bn-side{margin-left:0;gap:16px}}
@media (max-width:560px){
  .bn{padding:20px 16px 28px}
  .bn-h{font-size:var(--fs-l)}
  .bn-logos img{height:48px}
  .bn-cards{gap:24px}
  .bn-card{border-radius:28px;padding:24px 10px 30px}
  .bn-card .lbl{left:24px}
  .bn-in{grid-template-columns:1fr;justify-items:center;text-align:center;border-radius:20px;padding:14px 12px;gap:12px;min-height:0}
  .bn-txt{text-align:center}
  .bn-act{flex-direction:row;gap:16px}
}

/* ---------- Owner PDF home: hero ---------- */
.hp-hero{position:relative;background:#EFEEEC;overflow:hidden}
.hp-hero img.bg{width:100%;height:auto;display:block}
.hp-hero .txt{text-align:center;padding:32px 16px 8px}
.hp-hero h1{font-family:var(--sans);font-weight:700;color:#000;font-size:var(--fs-xxl);line-height:1.15;margin:0}
.hp-hero .l2{color:var(--hp-red);font-weight:700;font-size:var(--fs-m);margin:.5em 0 .7em;line-height:1.2}
.hp-hero .l3{font-size:var(--fs-m);color:#111;line-height:1.35;margin:0}
.hp-hero .l3 b{font-weight:700}
.hp-hero .l3 i{color:var(--hp-tadka);font-weight:700}
.hp-hero .heart{color:var(--hp-red);font-weight:700;font-size:var(--fs-s);position:absolute;right:4.6%;bottom:2.4%}
.hp-hero .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:16px}
@media (min-width:901px){
  .hp-hero{aspect-ratio:1920/980}
  .hp-hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%}
  .hp-hero .txt{position:relative;padding-top:1.8vw}
}
@media (max-width:900px){.hp-hero{display:flex;flex-direction:column}.hp-hero .txt{order:-1;padding-bottom:16px}.hp-hero .heart{position:static;display:block;text-align:right;padding:8px 16px 16px}}

/* stats */
.hp-stats{background:var(--hp-grey);padding:16px var(--gut) 24px}
.hp-stats ul{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;max-width:1360px;text-align:center}
.hp-stats b{display:block;font-weight:400;font-size:var(--fs-l);line-height:1.1;color:#000}
.hp-stats span{display:block;font-size:var(--fs-s);color:#222;line-height:1.3}
.hp-stats .smp{display:inline-block;font-size:var(--fs-xs);color:#6b6b6b;background:#fff;border-radius:8px;padding:0 8px;margin-top:4px}
.hp-stats .snote{text-align:center;font-size:var(--fs-xs);color:#555;margin-top:12px}
@media (max-width:900px){.hp-stats ul{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:16px}}

/* before / after */
.hp-ba{position:relative;background:#fff}
.hp-ba img{width:100%;height:auto}
.hp-ba .ribbon{position:absolute;top:2.2%;left:50%;transform:translateX(-50%);background:#fff;color:#000;font-weight:600;letter-spacing:.12em;font-size:var(--fs-s);padding:.25em 1.6em;clip-path:polygon(4% 0,96% 0,100% 50%,96% 100%,4% 100%,0 50%);white-space:nowrap}
.hp-ba .tagx{position:absolute;top:13%;background:#141414;color:#fff;font-size:var(--fs-s);letter-spacing:.04em;padding:.15em .7em;line-height:1.25}
.hp-ba .tagx.l{left:0}.hp-ba .tagx.r{right:0}
@media (max-width:700px){.hp-ba{display:flex;flex-direction:column}.hp-ba .ribbon{order:-1;position:static;transform:none;display:block;text-align:center;clip-path:none;background:#141414;color:#fff;padding:12px 8px;font-size:var(--fs-s);white-space:normal}.hp-ba .tagx{top:auto;bottom:0;font-size:var(--fs-s)}}
.hp-ba .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(48px,7vw,136px);height:clamp(48px,7vw,136px);border-radius:50%;background:rgba(110,110,110,.85);border:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.hp-ba .play::after{content:"";border-left:clamp(14px,2vw,38px) solid #fff;border-top:clamp(9px,1.25vw,24px) solid transparent;border-bottom:clamp(9px,1.25vw,24px) solid transparent;margin-left:12%}

/* authentic taste */
.hp-at{padding:clamp(32px,3.5vw,48px) var(--gut)}
.hp-h2{font-family:var(--sans);font-weight:600;font-size:var(--fs-l);color:#222;text-align:center;margin:0 0 32px;display:flex;align-items:center;justify-content:center;gap:12px}
.hp-h2 img{width:clamp(30px,2.6vw,48px);height:auto}
.hp-at .row{display:grid;grid-template-columns:minmax(0,1.1fr) repeat(3,minmax(0,1fr));gap:clamp(16px,1.6vw,24px);max-width:1500px;margin:0 auto;align-items:center}
.hp-at .lead h3{font-weight:700;font-size:var(--fs-m);line-height:1.1;margin:0 0 16px;color:#222;text-transform:uppercase}
.hp-at .lead .rd{font-size:var(--fs-m);color:#333;margin:0 0 16px}
.hp-at .lead p{font-size:var(--fs-s);margin:0 0 16px;color:#111;line-height:1.4}
.hp-cat{display:block;background:#F2F2F4;text-decoration:none;position:relative;color:#fff}
.hp-cat img{width:100%;aspect-ratio:1/1;object-fit:cover}
.hp-cat .bar{display:block;background:var(--hp-bar);text-align:center;font-size:var(--fs-s);letter-spacing:.04em;padding:.12em 0;font-weight:400}
.hp-cat .soon{position:absolute;top:10px;right:10px;background:#000;color:#fff;font-size:var(--fs-xs);font-weight:600;border-radius:8px;padding:2px 12px}
@media (max-width:900px){.hp-at .row{grid-template-columns:1fr 1fr}.hp-at .lead{grid-column:1/-1}}
@media (max-width:480px){.hp-at .row{grid-template-columns:1fr}}

/* happy food */
.hp-hf{padding:8px var(--gut) clamp(32px,3vw,48px);text-align:center}
.hp-hf h2{font-weight:600;font-size:var(--fs-l);margin:0;color:#222}
.hp-hf .sub{font-size:var(--fs-s);color:#333;margin:2px 0 clamp(24px,3.4vw,48px)}
.hp-tiles{display:grid;grid-template-columns:1fr 1fr 1.48fr 1fr 1fr;gap:clamp(12px,1.2vw,24px);max-width:1640px;margin:0 auto}
.hp-tiles a{display:block;border-radius:clamp(16px,1.4vw,16px);overflow:hidden;position:relative;text-decoration:none;aspect-ratio:287/550}
.hp-tiles a img{width:100%;height:100%;object-fit:cover}
.hp-tiles a.mid{aspect-ratio:auto}
.hp-tiles .list{position:absolute;left:4%;right:4%;top:20%;bottom:22%;background:rgba(20,20,20,.62);border-radius:16px;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:8px}
.hp-tiles .list span{color:#fff;font-size:var(--fs-m);line-height:1.3;letter-spacing:.03em}
.hp-tiles .list a,.hp-tiles .list button{all:unset;cursor:pointer;color:#fff;font-size:var(--fs-s);line-height:1.3;letter-spacing:.03em;padding:2px 0}
.hp-tiles .list button:focus-visible{outline:3px solid var(--pink)}
.hp-tiles .mid{aspect-ratio:auto;border-radius:clamp(16px,1.4vw,16px);overflow:hidden;position:relative}
@media (max-width:900px){.hp-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.hp-tiles .mid{grid-column:1/-1;order:-1;aspect-ratio:600/560}.hp-tiles .mid img{width:100%;height:100%;object-fit:cover}}

/* partners */
.hp-pp{background:var(--hp-soft);padding:clamp(32px,3vw,48px) var(--gut);text-align:center;position:relative}
.hp-pp h2{font-weight:600;font-size:var(--fs-l);margin:0;color:#222}
.hp-pp .sub{font-size:var(--fs-s);color:#333;margin:4px 0 32px}
.hp-pp .people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.3vw,24px);max-width:1010px;margin:0 auto}
.hp-pp .people a{display:block;background:#fff;padding:4px;text-decoration:none}
.hp-pp .people img{width:100%;aspect-ratio:345/420;object-fit:cover}
.hp-pp h3{font-weight:600;font-size:var(--fs-m);line-height:1.15;margin:32px 0 16px;color:#222}
.btn-black{background:#000;color:#fff;border-radius:0;min-height:var(--btn-h);padding:0 24px;font-weight:400}
@media (max-width:600px){.hp-pp .people{grid-template-columns:1fr;max-width:280px}}

/* meal planner */
.hp-mp{padding:clamp(32px,3vw,48px) var(--gut);position:relative;max-width:1920px;margin:0 auto}
.hp-mp .deco-l{position:absolute;left:8%;top:30px;width:clamp(70px,8vw,160px)}
.hp-mp .deco-r{position:absolute;right:3%;top:42%;width:clamp(90px,10vw,220px)}
.hp-mp h2{text-align:center;font-weight:400;letter-spacing:.03em;font-size:var(--fs-l);margin:0;color:#111}
.hp-mp .sub{text-align:center;font-size:var(--fs-s);margin:0 0 clamp(24px,3vw,48px);letter-spacing:.03em}
.hp-mp .feat{display:grid;grid-template-columns:1fr 1fr;gap:32px 48px;max-width:1150px;margin:0 auto 32px;padding:0 0 0 6%}
.hp-mp .feat div{display:flex;align-items:center;gap:16px;font-size:var(--fs-m);letter-spacing:.03em}
.hp-mp .feat img{width:clamp(44px,3.6vw,68px);height:auto}
.hp-mp .health{display:flex;gap:16px;max-width:1150px;margin:0 auto;padding-left:6%}
.hp-mp .health img{width:clamp(48px,4vw,76px);height:auto;flex:none}
.hp-mp .health b{display:block;font-size:var(--fs-m);margin-bottom:12px}
.hp-mp .health p{margin:0;font-size:var(--fs-s);line-height:1.45;letter-spacing:.02em}
.hp-mp .cta{text-align:center;margin-top:24px}
.btn-grey{background:#4A4A4A;color:#fff;border-radius:0;min-height:var(--btn-h);padding:0 32px;font-weight:400;font-size:var(--fs-s);letter-spacing:.03em}
@media (max-width:900px){.hp-mp .deco-l,.hp-mp .deco-r{display:none}.hp-mp .feat{grid-template-columns:1fr;padding:0}.hp-mp .health{padding:0}}

/* pillars strip (blueprint M01-S01 R03) */
.hp-pil{background:#000;color:#fff;padding:24px var(--gut)}
.hp-pil .in{max-width:1500px;margin:0 auto;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hp-pil h2{font-family:var(--serif);font-weight:400;font-size:var(--fs-l);margin:0 16px 0 0}
.hp-pil h2 em{color:var(--neon-text)}
.hp-pil a{color:#fff;text-decoration:none;border:1.5px solid #6b6b6b;border-radius:16px;padding:0 16px;min-height:40px;display:inline-flex;align-items:center;font-weight:600;font-size:var(--fs-s)}
.hp-pil a.pk{border-color:var(--pink);color:var(--pink)}
.hp-pil a .tag{font-size:var(--fs-xs);color:#bbb;margin-left:8px;font-weight:400}

/* tribe */
.hp-tr{background:var(--hp-tribe);padding:clamp(32px,3vw,48px) var(--gut)}
.hp-tr .in{max-width:1300px;margin:0 auto}
.hp-tr h2{font-weight:600;font-size:var(--fs-l);margin:0 0 32px;display:flex;align-items:center;gap:12px;color:#222}
.hp-tr h2 img{width:38px}
.hp-soc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.hp-soc .ph{background:#fff;border:4px solid #3B2A22;border-radius:16px;padding:24px 16px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.hp-soc .ph svg{width:44px;height:44px}
.hp-soc .ph .nm{font-size:var(--fs-s);color:#222}
.hp-soc .ph .hd{font-size:var(--fs-s);color:#666}
@media (max-width:900px){.hp-soc{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.hp-soc{gap:12px}.hp-soc .ph{padding:16px 8px;border-radius:16px}.hp-soc .ph .nm{font-size:var(--fs-s)}.hp-soc .ph .btn{font-size:var(--fs-xs);padding:0 8px;min-height:var(--btn-h)}}

/* latest posts */
.hp-lp{padding:clamp(32px,3vw,48px) var(--gut)}
.hp-lp .in{max-width:1300px;margin:0 auto}
.hp-lp h2{font-weight:600;font-size:var(--fs-l);margin:0 0 32px;color:#222}
.hp-posts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.hp-posts a{text-decoration:none;color:#111;display:block}
.hp-posts .im{aspect-ratio:1/1;display:flex;align-items:flex-start;justify-content:center;border-radius:8px;overflow:hidden;background:#fff}
.hp-posts .im img{width:100%;height:auto}
.hp-posts .im.wide{align-items:center;background:#E8EFE1}
.hp-posts .cat{color:var(--hp-cat);font-weight:600;font-size:var(--fs-s);margin:16px 8px 4px}
.hp-posts h3{font-weight:400;font-size:var(--fs-m);line-height:1.3;margin:0 8px 8px}
.hp-posts .meta{font-size:var(--fs-xs);color:#666;margin:0 8px 12px}
.hp-posts p{font-size:var(--fs-s);color:#333;margin:0 8px}
@media (max-width:900px){.hp-posts{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.hp-posts{gap:12px}.hp-posts h3{font-size:var(--fs-s)}.hp-posts p{font-size:var(--fs-s)}}

/* ---------- Inner pages (About, Help, Legal, MagicApp, Events, Search, Sitemap) ---------- */
.pg-head{background:#000;color:#fff;padding:clamp(16px,2vw,32px) var(--gut)}
.pg-head .in{max-width:none;margin:0}
.pg-head h1{font-family:var(--serif);font-weight:400;font-size:var(--fs-xl);margin:0;line-height:1.15}
.pg-head h1 em{color:var(--neon-text)}
.pg-head p{margin:12px 0 0;color:#ddd;font-size:var(--fs-s);max-width:820px}
.pg-head .crumb{color:#aaa;margin:0 0 12px}.pg-head .crumb a{color:#fff}
.pg{max-width:none;margin:0;padding:clamp(24px,3vw,48px) var(--gut)}
.pg h2{font-family:var(--serif);font-weight:400;font-size:var(--fs-l);margin:0 0 16px}
.pg h3{font-size:var(--fs-m);margin:0 0 8px}
.pg section{margin-bottom:48px}
.pg .lead{font-size:var(--fs-m);max-width:820px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.cardw{background:#fff;border:1px solid var(--grey-line);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:12px}
.cardw h3{margin:0;font-size:var(--fs-m)}
.cardw p{margin:0;font-size:var(--fs-s);color:#333}
.cardw .go{margin-top:auto}
a.cardw{text-decoration:none;color:inherit}
.pill{display:inline-block;font-size:var(--fs-xs);font-weight:600;border-radius:8px;padding:2px 12px;background:var(--chip);color:#333}
.pill.later{background:#000;color:#fff}
.pill.live{background:#E6F7E6;color:#1E7A1E}
.pill.prev{background:var(--pink-soft);color:#B4235A}
.note{background:var(--grey-bg);border-radius:12px;padding:12px 16px;font-size:var(--fs-s);color:#333}
.okbox{background:#E6F7E6;color:#14532D;border-radius:12px;padding:16px 16px;font-size:var(--fs-s)}
.form{display:grid;gap:16px;max-width:640px}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:560px){.form .row2{grid-template-columns:1fr}}
.chk{display:flex;gap:12px;align-items:flex-start;font-size:var(--fs-s)}
.chk input{width:22px;height:22px;flex:none;margin-top:2px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}
.tabs .chip{height:40px;padding:0 16px;font-size:var(--fs-s)}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px;font-size:var(--fs-s)}
.kv dt{color:#666}.kv dd{margin:0}
@media (max-width:480px){.kv{grid-template-columns:1fr}.kv dd{margin-bottom:8px}}
.list-plain{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.res{display:flex;gap:16px;align-items:center;border-bottom:1px solid #eee;padding:12px 0;text-decoration:none;color:inherit}
.res img{width:64px;height:64px;object-fit:cover;border-radius:8px;background:var(--grey-bg);flex:none}
.res .t{font-weight:600}.res .m{font-size:var(--fs-s);color:#666}
.toc{position:sticky;top:12px;font-size:var(--fs-s)}
.toc a{display:block;padding:8px 0;text-decoration:none;color:#222}
.legal-grid{display:grid;grid-template-columns:220px minmax(0,760px);gap:48px}
@media (max-width:900px){.legal-grid{grid-template-columns:1fr}.toc{position:static}}
.legal-doc h2{font-family:var(--sans);font-weight:700;font-size:var(--fs-m);margin:32px 0 8px}
.draft-band{background:#FFF4D6;color:#7A5300;border:1px dashed #C99A2E;border-radius:8px;padding:12px 16px;font-weight:600;font-size:var(--fs-s);margin-bottom:16px}
.sm-cols{columns:3 300px;column-gap:48px}
.sm-cols section{break-inside:avoid;margin-bottom:24px}
.sm-cols h2{font-size:var(--fs-m)}
.sm-cols a{display:block;padding:4px 0;color:#222}
.sm-cols .p{font-size:var(--fs-xs);color:#777;margin-left:8px}

/* MagicApp pillars */
.pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:1100px){.pillars{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.pillars{grid-template-columns:1fr}}
.pillar{background:#0A0A0A;color:#fff;border-radius:999px;padding:24px;text-decoration:none;display:flex;flex-direction:column;gap:8px;min-height:var(--btn-h)}
.pillar h3{font-family:var(--serif);font-weight:400;font-size:var(--fs-s);margin:0}
.pillar p{margin:0;font-size:var(--fs-s);color:#ccc}
.pillar .pill{align-self:flex-start}
.pillar .go{margin-top:auto;color:var(--pink);font-weight:600}

/* game / quiz / tarot */
.stage{background:#0A0A0A;color:#fff;border-radius:16px;padding:clamp(16px,2.5vw,32px)}
.stage h2{color:#fff}
.stage .q{font-size:var(--fs-m);margin:8px 0 16px}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.choices{grid-template-columns:1fr}}
.choices button{min-height:var(--btn-h);border-radius:999px;border:1.5px solid #555;background:#1b1b1b;color:#fff;font-size:var(--fs-s);text-align:left;padding:12px 16px;cursor:pointer}
.choices button.sel{border-color:var(--pink);background:#2a0f19}
.choices button.ok{border-color:#59d64f}
.choices button.no{border-color:#C2185B;opacity:.7}
.prog{height:8px;background:#333;border-radius:4px;overflow:hidden;margin:12px 0}
.prog i{display:block;height:100%;background:var(--pink)}
.tcards{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
@media (max-width:900px){.tcards{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tcard{aspect-ratio:2/3;border-radius:16px;min-height:0;border:2px solid var(--pink-deep);background:#111;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--serif);font-size:var(--fs-m);padding:8px}
.tcard.back{background:repeating-linear-gradient(45deg,#1a1a1a 0 8px,#111 8px 16px)}
.tcard.open{background:var(--pink-wash);color:#111}
.tcard[disabled]{cursor:default}
.board{width:100%;border-collapse:collapse}
.board td,.board th{padding:8px;border-bottom:1px solid #333;text-align:left}
.cd-inline{display:flex;gap:12px;flex-wrap:wrap}
.cd-inline span{background:#111;color:#fff;border-radius:8px;padding:8px 12px;min-width:64px;text-align:center}
.cd-inline b{display:block;font-family:var(--serif);font-size:var(--fs-l);font-weight:400}
.cd-inline small{font-size:var(--fs-xs);color:#bbb}
.err404{text-align:center;padding:48px 16px}
.err404 .n{font-family:var(--serif);font-size:var(--fs-xxl);line-height:1;color:var(--pink-deep)}
@media (max-width:560px){.form[style*="grid-template-columns"]{grid-template-columns:1fr!important}}
[hidden]{display:none!important}
.cardw .pill{align-self:flex-start}
details.cardw{padding:12px 16px;display:block}
@media (max-width:420px){.tcard{font-size:var(--fs-s);border-radius:8px}}
.pg .field .hint{font-size:var(--fs-xs)}
@media (max-width:640px){
  main .btn-sm{min-height:var(--btn-h)}
  .pg-head .crumb a,.bn-note a,.note a,.kv a,.legal-doc p a,#ev > p a,.cardw a:not(.btn),.res .m a{display:inline-flex;align-items:center;min-height:40px}
  .toc a,.sm-cols a{display:flex;align-items:center;flex-wrap:wrap;min-height:40px;padding:0}
  .hp-tiles .list{top:6%;bottom:6%}
  .hp-tiles .list a{min-height:40px;display:flex;align-items:center;justify-content:center}
}

/* ---------- Owner's 11 rules (17 Oct) ---------- */
.hp-soc .ph .btn,.hp-soc .ph button.btn.btn-sm{width:auto!important;align-self:center;padding:0 var(--sp-3)}
.hp-pp .btn-black,.hp-mp .btn-grey,a.btn.btn-black,a.btn.btn-grey{border-radius:var(--r-pill)!important}
.hp-hero .cta-ph{display:flex;justify-content:center;margin-top:var(--sp-3)}
@media (max-width:1199px){.hp-hero .cta-ph{display:flex;justify-content:center;margin-top:var(--sp-3)}}
#hp-play{width:40px;height:40px}
.hp-ba .tagx{border-radius:var(--r-s)}
.hp-cat .bar{border-radius:0 0 var(--r-s) var(--r-s)}

#hp-pil a.pk{color:#FF3D7F}
@media (max-width:420px){.hp-soc{grid-template-columns:1fr}.hp-soc .ph{flex-direction:row;flex-wrap:wrap;justify-content:space-between;padding:12px 16px}.hp-soc .ph svg{width:32px;height:32px}}
.pg{padding-top:var(--sp-4)}
.cardw .btn{width:auto;align-self:flex-start}
#c-form .btn{width:auto}
#c-form .btn{width:auto!important}
#c-form .btn{justify-self:start;align-self:start;padding:0 var(--sp-6)}
@media (max-width:800px){.form[style*="grid-template-columns"]{grid-template-columns:1fr 1fr!important}}
@media (max-width:560px){.form[style*="grid-template-columns"]{grid-template-columns:1fr!important}}

/* v3 (17 Oct): hero and packs fill the first view on computers; the record countdown follows below */
@media (min-width:1200px){.hp-hero{aspect-ratio:auto;height:min(calc(var(--vvw,1920px)*.5104),calc(var(--vvh,960px) - 214px));min-height:560px}.hp-hero img.bg{object-position:50% 48%}}

/* ---------- Records strip, quiet versions (owner to pick; /?band=a or /?band=b) ---------- */
/* Sizes are set for the 1920 board; at 1536 the page shows them at 0.8 (36 -> 29, 23 -> 18.4, 18 -> 14.4 real px).
   Text pairs on black: #EDEDED 17:1, #D0D0D0 13:1; pink #FF3D7F only on large text (6:1) and as the button ground with near-black bold 19px+ text (6:1, large). */
.bn2{background:#060606;color:#EDEDED;padding:40px var(--gut)}
.bn2 h2{font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.25;margin:0;color:#fff}
.bn2 h2 em{font-style:italic;color:#FF3D7F}
.b2-logos{display:inline-flex;gap:10px;vertical-align:middle}
.b2-logos img{height:40px;width:auto;border-radius:6px;background:#fff}
.bn2 .why{font-size:25px;line-height:1.4;color:#EDEDED;margin:10px 0 0}
.b2-cd{display:inline-flex;align-items:baseline;gap:20px;font-variant-numeric:tabular-nums}
.b2-cd .q{display:inline-flex;align-items:baseline;gap:5px}
.b2-cd b{font-family:var(--serif);font-weight:400;font-size:45px;line-height:1;color:#fff}
.b2-cd small{font-size:18px;color:#D0D0D0}
.b2-go{display:inline-flex;align-items:center;min-height:56px;padding:0 32px;border-radius:999px;background:#FF3D7F;color:#060606;font-weight:700;font-size:25px;text-decoration:none;white-space:nowrap}
.b2-go:hover{background:#FF5A92}
.b2-link{color:#EDEDED;font-weight:700;font-size:25px;text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:44px}
.b2-link::after{content:"\2192";color:#FF3D7F}
.b2-link:hover{text-decoration:underline}
/* A: one line, one countdown, one button */
.bn2-a .b2-in{max-width:1640px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:40px}
.bn2-a .b2-head h2{display:inline;margin-right:16px}
.bn2-a .b2-more{max-width:1640px;margin:32px auto 0;padding-top:20px;border-top:1px solid #333;display:flex;gap:48px;flex-wrap:wrap}
.bn2-a .b2-more a{color:#EDEDED;font-size:25px;font-weight:600;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.bn2-a .b2-more a:hover{text-decoration:underline}
/* B: three quiet columns split by thin rules */
.bn2-b .b2-top{max-width:1640px;margin:0 auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.bn2-b .b2-cols{max-width:1640px;margin:28px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #333}
.bn2-b .b2-col{padding:28px 40px 8px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.bn2-b .b2-col + .b2-col{border-left:1px solid #333}
.bn2-b .b2-col:first-child{padding-left:0}
.bn2-b .lbl{margin:0;font-size:18px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#EDEDED}
.bn2-b .ln{margin:0;font-family:var(--serif);font-size:32px;line-height:1.2;color:#fff}
.bn2-b .b2-cd b{font-size:45px}
.bn2-b .rec{margin:0;font-size:18px;color:#D0D0D0}
@media (max-width:1199px){
  .bn2-a .b2-in{grid-template-columns:1fr;gap:24px;justify-items:start}
  .bn2-b .b2-cols{grid-template-columns:1fr}
  .bn2-b .b2-col{padding:24px 0}
  .bn2-b .b2-col + .b2-col{border-left:0;border-top:1px solid #333}
}
@media (max-width:560px){
  .bn2{padding:28px 16px}
  .bn2 h2{font-size:25px}
  .bn2-a .b2-head h2{display:block;margin:0 0 10px}
  .b2-logos img{height:32px}
  .bn2 .why,.b2-link,.bn2-a .b2-more a{font-size:18px}
  .b2-cd{gap:12px}
  .b2-cd b{font-size:32px}
  .b2-cd small,.bn2-b .lbl,.bn2-b .rec{font-size:14px}
  .bn2-b .ln{font-size:25px}
  .bn2-b .b2-cd b{font-size:25px}
  .b2-go{font-size:18px;min-height:48px;padding:0 24px}
  .bn2-a .b2-more{flex-direction:column;gap:4px}
}

.pg-head .pg-act{margin-top:14px}