/* ==========================================================================
   KUNDALIN INSTITUTE
   Palette C. White ground, warm near-black text, maroon on actions only.
   ========================================================================== */

:root{
  --bg:#FFFFFF;
  --soft:#FAF8F5;
  --h:#171310;
  --body:#1A1A1A;
  --mut:#8A817A;
  --acc:#6B2226;
  --acc-d:#4A171A;
  --line:rgba(23,19,16,.12);
  --line-l:rgba(255,255,255,.22);
  --wa:#25D366;
  --wa-d:#1DA851;
  --max:1280px;
  --pad:104px;
}

*,*::before,*::after{ box-sizing:border-box }
[hidden]{ display:none !important }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth }
body{ margin:0; background:var(--bg); color:var(--body);
  font-family:'Satoshi',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased }
img,svg{ max-width:100%; display:block }

/* ---------- Type ---------- */
h1,h2,.display{ font-family:'Newsreader',Georgia,serif; font-weight:300; margin:0; color:var(--acc) }
.display{ font-size:clamp(2.5rem,5.2vw,4.15rem); line-height:1.04; letter-spacing:-.03em }
h1{ font-size:clamp(2.1rem,4vw,3.1rem); line-height:1.1; letter-spacing:-.025em }
h2{ font-size:clamp(1.7rem,2.9vw,2.3rem); line-height:1.18; letter-spacing:-.02em }
h3{ font-family:'Satoshi',sans-serif; font-size:1.125rem; font-weight:700; margin:0;
  letter-spacing:-.01em; line-height:1.35; color:var(--acc) }
h4,.eyebrow{ font-family:'Satoshi',sans-serif; font-size:.75rem; font-weight:500; margin:0;
  letter-spacing:.07em; text-transform:uppercase; color:var(--acc) }
h4.plain{ color:var(--mut) }
p{ margin:0 0 1.05em; max-width:66ch } p:last-child{ margin-bottom:0 }
.lead{ font-size:1.1875rem; line-height:1.6 }
.small{ font-size:.9375rem; line-height:1.55 }
.micro{ font-size:.8125rem; line-height:1.45; letter-spacing:.015em; color:var(--mut) }
em{ font-style:italic } strong{ font-weight:700; color:var(--acc) }
a{ color:var(--acc); text-decoration:none; border-bottom:1px solid currentColor; transition:opacity .15s }
a:hover{ opacity:.6 }
a.plain{ border-bottom:0 }

/* ---------- Layout ---------- */
.wrap{ max-width:var(--max); margin:0 auto; padding:0 40px }
.sec{ padding:var(--pad) 0 }
.sec--soft{ background:var(--soft) }
.sec--acc{ background:var(--acc); color:#F6EFEE }
.sec--acc h2,.sec--acc h3,.sec--acc .display{ color:#FFF }
.sec--acc h4,.sec--acc .eyebrow{ color:rgba(246,239,238,.7) }
.sec--acc .micro{ color:rgba(246,239,238,.72) }
.sec--acc strong{ color:#FFF }
.sec--acc a{ color:#FFF }
.sec--tight{ padding:64px 0 }
.grid{ display:grid; gap:24px }
.g2{ grid-template-columns:repeat(2,1fr) } .g3{ grid-template-columns:repeat(3,1fr) }
.cols{ display:grid; grid-template-columns:1fr 1fr; gap:64px }
.cols-a{ display:grid; grid-template-columns:1.08fr 1fr; gap:64px; align-items:center }
.cols-t{ display:grid; grid-template-columns:1fr 1.15fr; gap:56px; align-items:start }
.prose{ max-width:66ch } .narrow{ max-width:780px }
.mt-s{margin-top:12px}.mt-m{margin-top:24px}.mt-l{margin-top:40px}.mt-xl{margin-top:64px}

/* ---------- Announcement bar ---------- */
.notice{ background:var(--acc); color:#fff; font-size:.8125rem; letter-spacing:.01em;
  position:relative; z-index:110 }
.notice .wrap{ display:flex; align-items:center; justify-content:center; gap:10px;
  min-height:42px; padding-top:9px; padding-bottom:9px; text-align:center }
.notice a{ color:#fff; border-bottom:1px solid rgba(255,255,255,.55) }
.notice a:hover{ opacity:1; border-bottom-color:#fff }
.notice-close{ position:absolute; right:16px; top:50%; transform:translateY(-50%);
  background:none; border:0; color:rgba(255,255,255,.75); font-size:1.125rem;
  line-height:1; cursor:pointer; padding:6px }
.notice-close:hover{ color:#fff }
.notice[hidden]{ display:none !important }

/* ---------- Header ---------- */
.hdr{ position:sticky; top:0; z-index:100; background:var(--bg);
  border-bottom:1px solid var(--line); height:78px; display:flex; align-items:center }
.hdr .wrap{ display:flex; align-items:center; justify-content:space-between; width:100% }
.wordmark{ font-family:'Newsreader',Georgia,serif; font-weight:300; font-size:1.3125rem;
  letter-spacing:.05em; color:var(--h); border:0; white-space:nowrap; display:flex; align-items:center; gap:10px }
.wordmark:hover{ opacity:1 }
.wordmark .coil path{ stroke:var(--acc) }
.nav{ display:flex; gap:26px; align-items:center }
.nav a{ font-size:.875rem; color:var(--body); border:0; padding-bottom:4px; border-bottom:1px solid transparent }
.nav a:hover{ color:var(--acc); opacity:1 }
.nav a.on{ border-bottom-color:var(--acc); color:var(--acc) }
.burger{ display:none; background:none; border:0; cursor:pointer; width:40px; height:40px; padding:8px }
.burger span{ display:block; height:1px; background:var(--h); margin:7px 0 }
.mobilemenu{ position:fixed; inset:0; background:var(--bg); z-index:200; display:none; flex-direction:column; padding:28px }
.mobilemenu.is-open{ display:flex }
.mobilemenu .close{ align-self:flex-end; background:none; border:0; color:var(--h); font-size:2rem; cursor:pointer; line-height:1 }
.mobilemenu nav{ display:flex; flex-direction:column; gap:22px; margin-top:32px }
.mobilemenu nav a{ font-family:'Newsreader',serif; font-size:1.5rem; font-weight:400; color:var(--h); border:0 }
.mobilemenu .btn{ margin-top:auto }

/* ---------- Buttons ---------- */
.btn{ display:inline-block; font-family:'Satoshi',sans-serif; font-size:.875rem; font-weight:500;
  letter-spacing:.01em; padding:14px 28px; border-radius:2px; border:1px solid var(--acc);
  cursor:pointer; text-decoration:none; transition:background .15s,color .15s,border-color .15s }
.btn-p{ background:var(--acc); color:#fff }
.btn-p:hover{ background:var(--acc-d); border-color:var(--acc-d); opacity:1 }
.btn-s{ background:transparent; color:var(--acc) }
.btn-s:hover{ background:var(--acc); color:#fff; opacity:1 }
.sec--acc .btn-p{ background:#fff; color:var(--acc); border-color:#fff }
.sec--acc .btn-p:hover{ background:rgba(255,255,255,.85) }
.sec--acc .btn-s{ border-color:rgba(255,255,255,.6); color:#fff }
.sec--acc .btn-s:hover{ background:#fff; color:var(--acc) }
.btn-row{ display:flex; gap:14px; flex-wrap:wrap }

/* ---------- Coil ---------- */
.coil{ width:28px; height:28px }
.coil path{ stroke:var(--acc); fill:none; stroke-width:1.5 }
.sec--acc .coil path{ stroke:#fff }
.coil-lg{ width:44px; height:44px }

/* ---------- Hero ---------- */
.hero{ padding:80px 0 var(--pad) }
.hero .cols-a{ gap:72px }
.hero--plain{ padding:80px 0 72px }
.hero .lead{ color:var(--body) }
.hero-foot{ margin-top:36px; padding-top:18px; border-top:1px solid var(--line) }
.metarow{ display:flex; flex-wrap:wrap; align-items:center; margin:22px 0 30px }
.metarow span{ font-size:.8125rem; letter-spacing:.015em; color:var(--mut); padding:0 16px; border-left:1px solid var(--line) }
.metarow span:first-child{ padding-left:0; border-left:0 }

/* ---------- Media ---------- */
.ph{ border:1px solid var(--line); border-radius:2px; overflow:hidden; background:var(--soft); position:relative }
.ph svg{ width:100%; height:100%; display:block }
.ph img{ width:100%; height:100%; object-fit:cover; display:block }
.r45{ aspect-ratio:4/5 } .r32{ aspect-ratio:3/2 } .r11{ aspect-ratio:1/1 }
.r169{ aspect-ratio:16/9 } .r23{ aspect-ratio:2/3 } .r219{ aspect-ratio:21/9 }

.mosaic{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:158px; gap:16px }
.mosaic .ph{ height:100% }
.m-a{ grid-column:span 2; grid-row:span 2 }
.m-b{ grid-column:span 2; grid-row:span 1 }
.m-c,.m-d{ grid-column:span 1; grid-row:span 1 }

.strip{ display:grid; grid-auto-flow:column; grid-auto-columns:330px; gap:20px;
  overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:14px }
.strip>*{ scroll-snap-align:start }
.strip::-webkit-scrollbar{ height:3px }
.strip::-webkit-scrollbar-thumb{ background:var(--line) }
.strip::-webkit-scrollbar-track{ background:transparent }
.band{ height:56vh; min-height:380px }
.band .ph{ height:100%; border-left:0; border-right:0; border-radius:0 }

/* ---------- Cards ---------- */
.card{ background:var(--bg); border:1px solid var(--line); border-radius:2px; padding:30px; transition:border-color .15s }
.card:hover{ border-color:var(--acc) }
.sec--soft .card{ background:var(--bg) }
.sec--acc .card{ background:rgba(255,255,255,.06); border-color:var(--line-l) }
.sec--acc .card:hover{ border-color:rgba(255,255,255,.6) }
.card--flush{ padding:0; overflow:hidden }
.card--flush .card-body{ padding:26px }
.price{ font-size:1.125rem; font-weight:700; color:var(--acc) }
.sec--acc .price{ color:#fff }

/* ---------- Spec grid ---------- */
.spec{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line) }
.spec>div{ padding:22px 28px 22px 0; border-bottom:1px solid var(--line) }
.spec dt{ font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--mut); margin-bottom:6px }
.spec dd{ margin:0; font-size:1.0625rem; font-weight:500; color:var(--h) }
.sec--acc .spec{ border-top-color:var(--line-l) }
.sec--acc .spec>div{ border-bottom-color:var(--line-l) }
.sec--acc .spec dt{ color:rgba(246,239,238,.65) }
.sec--acc .spec dd{ color:#fff }

/* ---------- Rows, tables, lists ---------- */
.rows{ border-top:1px solid var(--line) }
.row{ padding:28px 0; border-bottom:1px solid var(--line) }
.row h3{ margin-bottom:6px }
.sec--acc .rows,.sec--acc .row{ border-color:var(--line-l) }
.row--num{ display:grid; grid-template-columns:52px 1fr; gap:24px }
.row-n{ font-size:.8125rem; font-weight:500; color:var(--acc); padding-top:4px; letter-spacing:.03em }
.sec--acc .row-n{ color:rgba(255,255,255,.75) }

.tbl{ width:100%; border-collapse:collapse }
.tbl th{ text-align:left; font-size:.75rem; font-weight:500; letter-spacing:.06em; text-transform:uppercase;
  color:var(--mut); padding:0 24px 14px 0; border-bottom:1px solid var(--line) }
.tbl td{ padding:20px 24px 20px 0; border-bottom:1px solid var(--line); vertical-align:top; font-size:1rem }
.tbl td:last-child,.tbl th:last-child{ padding-right:0 }
.sec--acc .tbl th,.sec--acc .tbl td{ border-bottom-color:var(--line-l) }
.sec--acc .tbl th{ color:rgba(246,239,238,.65) }

.deflist{ display:grid; grid-template-columns:210px 1fr }
.deflist dt{ font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--mut);
  padding:18px 0; border-bottom:1px solid var(--line) }
.deflist dd{ margin:0; padding:18px 0; border-bottom:1px solid var(--line) }
.sec--acc .deflist dt,.sec--acc .deflist dd{ border-bottom-color:var(--line-l) }
.sec--acc .deflist dt{ color:rgba(246,239,238,.65) }

.pullquote{ font-family:'Newsreader',Georgia,serif; font-weight:300;
  font-size:clamp(1.7rem,3.3vw,2.6rem); line-height:1.22; letter-spacing:-.025em; max-width:940px; margin:0; color:var(--acc) }
.sec--acc .pullquote{ color:#fff }

/* ---------- FAQ ---------- */
.faq{ border-top:1px solid var(--line) }
.faq-item{ border-bottom:1px solid var(--line) }
.faq-q{ width:100%; background:none; border:0; cursor:pointer; text-align:left; padding:24px 0;
  font-family:'Satoshi',sans-serif; font-size:1.0625rem; font-weight:500; color:var(--acc);
  display:flex; justify-content:space-between; gap:24px }
.faq-q::after{ content:'+'; font-weight:400; font-size:1.25rem; line-height:1; color:var(--acc) }
.faq-item.is-open .faq-q::after{ content:'\2013' }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .2s ease }
.faq-item.is-open .faq-a{ max-height:560px }
.faq-a p{ padding-bottom:24px }
.sec--acc .faq,.sec--acc .faq-item{ border-color:var(--line-l) }
.sec--acc .faq-q{ color:#fff } .sec--acc .faq-q::after{ color:#fff }

/* ---------- Credentials ---------- */
.creds{ display:flex; gap:18px; align-items:center; flex-wrap:wrap }
.cmark{ border-radius:2px; display:flex; align-items:center; justify-content:center;
  text-align:center; font-size:.625rem; letter-spacing:.05em; color:var(--mut);
  padding:2px; line-height:1.4; width:118px; height:118px }
.cmark--empty{ border:1px dashed var(--line); padding:8px }
.cmark img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain }
.ftr .cmark{ background:#fff; padding:8px }
.cmark.sm{ width:86px; height:86px; font-size:.5625rem; padding:2px }
.sec--acc .cmark{ border-color:var(--line-l); color:rgba(246,239,238,.65) }

/* ---------- Logos and quotes ---------- */
.logos{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px }
.logobox{ border:1px dashed var(--line); border-radius:2px; height:74px; display:flex; align-items:center;
  justify-content:center; font-size:.6875rem; letter-spacing:.08em; text-transform:uppercase; color:var(--mut) }
.quote{ border:1px dashed var(--line); border-radius:2px; padding:30px }
.quote p{ font-family:'Newsreader',serif; font-size:1.1875rem; line-height:1.45; font-weight:300; color:var(--h) }

/* ---------- Forms ---------- */
.form{ max-width:820px }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0 28px }
.field{ display:flex; flex-direction:column; gap:8px; margin-bottom:24px }
.field--full{ grid-column:1/-1 }
.field label,.field .label{ font-size:.875rem; font-weight:500; letter-spacing:.01em; color:var(--acc) }
.field input,.field select,.field textarea{ font-family:'Satoshi',sans-serif; font-size:1rem;
  background:var(--bg); color:var(--body); border:1px solid var(--line); border-radius:2px; padding:14px; width:100% }
.field textarea{ min-height:118px; resize:vertical }
.field input:focus,.field select:focus,.field textarea:focus{ outline:2px solid var(--acc); outline-offset:2px; border-color:transparent }
.field .err{ font-size:.8125rem; font-weight:500 }
.err:not(:empty){ color:#A11B22 }
.fieldset{ border:0; padding:0; margin:0 0 42px }
.fieldset legend{ font-family:'Newsreader',serif; font-size:1.5rem; font-weight:400; padding:0; margin-bottom:10px; color:var(--acc) }
.checkgroup{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
.checkline{ display:flex; gap:10px; align-items:flex-start; font-size:.9375rem; font-weight:400; color:var(--body) }
.checkline input{ width:auto; margin-top:5px; flex:0 0 auto }
.counter{ font-size:.8125rem; color:var(--mut); text-align:right }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }

/* ---------- Shop ---------- */
.prodgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px }
.prod .ph{ margin-bottom:16px }
.qr{ width:180px; height:180px; border:1px dashed var(--line); border-radius:2px; display:flex;
  align-items:center; justify-content:center; text-align:center; font-size:.6875rem;
  letter-spacing:.06em; color:var(--mut); text-transform:uppercase; padding:12px }
.paybox{ border:1px solid var(--line); border-radius:2px; padding:26px;
  display:grid; grid-template-columns:180px 1fr; gap:26px; align-items:center }

/* ---------- Journal ---------- */
.jrow{ padding:28px 0; border-bottom:1px solid var(--line) }
.jrow:first-child{ border-top:1px solid var(--line) }
.jrow h3{ margin:6px 0 8px; font-size:1.375rem; font-family:'Newsreader',serif; font-weight:400; letter-spacing:-.01em }
.jrow h3 a{ border:0; color:var(--acc) } .jrow h3 a:hover{ color:var(--acc); opacity:.6 }
.post p{ font-size:1.1875rem; line-height:1.75 }
.holder{ background:rgba(107,34,38,.05); border-left:2px solid var(--acc); padding:22px 26px }

/* ---------- Footer ---------- */
.ftr{ background:var(--acc-d); color:#EFE4E3; padding:84px 0 36px }
.ftr .wordmark{ color:#fff; font-size:1.5rem }
.ftr .wordmark .coil path{ stroke:#fff }
.ftr h4{ color:rgba(239,228,227,.5); margin-bottom:16px }
.ftr ul{ list-style:none; margin:0; padding:0 } .ftr li{ margin-bottom:10px }
.ftr a{ color:rgba(239,228,227,.85); font-size:.9375rem; border:0 }
.ftr a:hover{ color:#fff; opacity:1 }
.ftr-cols{ display:grid; grid-template-columns:1.7fr 1fr 1fr 1fr; gap:40px }
.ftr .cmark{ border-color:var(--line-l); color:rgba(239,228,227,.6) }
.ftr-legal{ margin-top:54px; padding-top:28px; border-top:1px solid var(--line-l); display:flex;
  justify-content:space-between; gap:22px; flex-wrap:wrap; font-size:.8125rem; color:rgba(239,228,227,.6) }
.ftr-legal div{ display:flex; gap:18px; flex-wrap:wrap }
.ftr-legal a{ font-size:.8125rem }

/* ---------- WhatsApp ---------- */
.wa{ position:fixed; right:22px; bottom:22px; z-index:90; width:54px; height:54px; background:var(--acc);
  border-radius:2px; display:flex; align-items:center; justify-content:center; border:0;
  opacity:0; visibility:hidden; transition:opacity .25s,visibility .25s }
.wa.is-visible{ opacity:1; visibility:visible }
.wa svg{ width:25px; height:25px; fill:#fff }

/* ---------- Utility ---------- */
.skip{ position:absolute; left:-9999px; top:0; background:var(--acc); color:#fff; padding:12px 20px; z-index:999 }
.skip:focus{ left:0 }
:focus-visible{ outline:2px solid var(--acc); outline-offset:2px }
.sec--acc :focus-visible,.ftr :focus-visible{ outline-color:#fff }

/* ---------- Responsive ---------- */
@media (max-width:1080px){ :root{ --pad:76px } .ftr-cols{ grid-template-columns:1fr 1fr } .logos{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:860px){
  :root{ --pad:56px } body{ font-size:16px }
  .wrap{ padding:0 20px }
  .nav,.hdr .btn{ display:none } .burger{ display:block }
  .g2,.g3,.cols,.cols-a,.cols-t,.form-grid,.checkgroup,.prodgrid,.spec,.row--num{ grid-template-columns:1fr; gap:26px }
  .deflist{ grid-template-columns:1fr }
  .deflist dt{ border-bottom:0; padding-bottom:0 } .deflist dd{ padding-top:6px }
  .row--num{ gap:6px }
  .mosaic{ grid-template-columns:repeat(2,1fr); grid-auto-rows:130px }
  .m-a,.m-b{ grid-column:span 2 }
  .strip{ grid-auto-columns:250px }
  .paybox{ grid-template-columns:1fr }
  .hero{ padding:48px 0 56px }
  .band{ height:38vh; min-height:250px }
  .ftr-cols{ grid-template-columns:1fr; gap:30px } .ftr-legal{ flex-direction:column; gap:14px }
  .logos{ grid-template-columns:repeat(2,1fr) }
  .tbl,.tbl tbody,.tbl tr,.tbl td{ display:block; width:100% }
  .tbl thead{ display:none }
  .tbl tr{ border-bottom:1px solid var(--line); padding:16px 0 }
  .tbl td{ border:0; padding:3px 0 }
  .tbl td::before{ content:attr(data-label); display:block; font-size:.6875rem; letter-spacing:.06em;
    text-transform:uppercase; color:var(--mut); margin-bottom:3px }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important }
  html{ scroll-behavior:auto }
}


/* ==========================================================================
   SHOP CART
   ========================================================================== */

.cart-lines{ border-top:1px solid var(--line) }
.cart-line{ display:grid; grid-template-columns:1fr auto 130px; gap:24px; align-items:center;
  padding:24px 0; border-bottom:1px solid var(--line) }
.cart-line h3{ font-size:1.0625rem }
.cart-qty{ display:flex; align-items:center; gap:14px }
.cart-qty button{ width:34px; height:34px; border:1px solid var(--line); background:var(--bg);
  border-radius:2px; cursor:pointer; font-size:1rem; color:var(--acc); line-height:1 }
.cart-qty button:hover{ border-color:var(--acc) }
.cart-qty span{ min-width:20px; text-align:center; font-weight:500 }
.cart-sum{ text-align:right; font-weight:700; color:var(--acc) }
.cart-remove{ display:block; margin-top:6px; background:none; border:0; padding:0; cursor:pointer;
  font-family:'Satoshi',sans-serif; font-size:.8125rem; color:var(--mut);
  text-decoration:underline; font-weight:400 }
.cart-remove:hover{ color:var(--acc) }

.cart-totals{ margin-top:8px }
.cart-total-row{ display:flex; justify-content:space-between; padding:14px 0;
  border-bottom:1px solid var(--line); font-size:1rem }
.cart-total-row--grand{ border-bottom:0; padding-top:20px; font-size:1.25rem; font-weight:700; color:var(--acc) }
.cart-total-row--grand span:first-child{ font-family:'Newsreader',serif; font-weight:400; font-size:1.5rem }

.paypanel{ border:1px solid var(--line); border-radius:2px; padding:30px;
  display:grid; grid-template-columns:210px 1fr; gap:30px; align-items:start }
#qr-holder{ width:210px; height:210px; border:1px dashed var(--line); border-radius:2px;
  display:flex; align-items:center; justify-content:center; padding:14px; text-align:center }
#qr-holder.qr-live{ border-style:solid; border-color:var(--line); padding:6px; background:#fff }
#qr-holder svg{ width:100%; height:auto; display:block }
.payref{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:1rem;
  letter-spacing:.06em; color:var(--acc); font-weight:500 }
.paybig{ font-size:1.5rem; font-weight:700; color:var(--acc); font-family:'Satoshi',sans-serif }

/* ==========================================================================
   WHATSAPP PANEL
   ========================================================================== */

.wa-wrap{ position:fixed; right:22px; bottom:22px; z-index:95;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px }
.wa-card{ width:300px; max-width:calc(100vw - 44px); background:var(--bg);
  border:1px solid var(--line); border-radius:2px; padding:22px;
  box-shadow:0 12px 32px rgba(23,19,16,.12); display:none }
.wa-card.is-open{ display:block }
.wa-card h4{ color:var(--acc); margin-bottom:8px }
.wa-card p{ font-size:.9375rem; line-height:1.5; margin-bottom:14px }
.wa-card .btn{ width:100%; text-align:center; padding:14px;
  background:var(--wa); border-color:var(--wa); color:#fff }
.wa-card .btn:hover{ background:var(--wa-d); border-color:var(--wa-d) }
.wa-close{ position:absolute; top:10px; right:12px; background:none; border:0;
  font-size:1.25rem; line-height:1; cursor:pointer; color:var(--mut) }
.wa-card{ position:relative }
.wa-toggle{ height:62px; background:var(--wa); border:0; border-radius:2px;
  display:flex; align-items:center; justify-content:center; gap:10px;
  cursor:pointer; padding:0 22px 0 18px; box-shadow:0 6px 20px rgba(37,211,102,.28);
  font-family:'Satoshi',sans-serif; font-size:.9375rem; font-weight:500; color:#fff;
  transition:background .15s }
.wa-toggle:hover{ background:var(--wa-d) }
.wa-toggle svg{ width:28px; height:28px; fill:#fff; flex:0 0 auto }
.wa-toggle span{ white-space:nowrap }

/* header cart link */
.nav .cart-nav{ font-variant-numeric:tabular-nums }

@media (max-width:860px){
  .cart-line{ grid-template-columns:1fr auto; gap:14px 20px }
  .cart-sum{ grid-column:2; text-align:right }
  .paypanel{ grid-template-columns:1fr; justify-items:center; text-align:center }
  .paypanel > div:last-child{ text-align:center }
  .wa-card{ width:calc(100vw - 44px) }
}


/* ==========================================================================
   IMAGE GALLERY
   ========================================================================== */

.gallery{ display:grid; grid-auto-flow:column; grid-auto-columns:min(78%,540px); gap:16px;
  overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:14px }
.gallery > *{ scroll-snap-align:start }
.gallery .ph{ height:100% }
.gallery::-webkit-scrollbar{ height:3px }
.gallery::-webkit-scrollbar-thumb{ background:var(--line) }
.gallery::-webkit-scrollbar-track{ background:transparent }
.gallery-hint{ font-size:.8125rem; color:var(--mut); margin-top:10px }

/* product gallery sits square and smaller */
.gallery--product{ grid-auto-columns:min(72%,420px) }

/* ==========================================================================
   FREE SESSION LANDING PAGE
   ========================================================================== */

.lp{ min-height:100vh; display:flex; flex-direction:column }
.lp-main{ flex:1 }
.lp-head{ padding:34px 0; border-bottom:1px solid var(--line) }
.lp-head .wordmark{ color:var(--h) }
.lp-head .wordmark .coil path{ stroke:var(--acc) }
.lp-foot{ padding:34px 0; border-top:1px solid var(--line); font-size:.8125rem; color:var(--mut) }
.lp-foot a{ color:var(--mut) }

@media (max-width:860px){
  .wa-wrap{ left:0; right:0; bottom:0; align-items:stretch; gap:0 }
  .wa-toggle{ width:100%; border-radius:0; height:58px; justify-content:center;
    box-shadow:0 -4px 16px rgba(23,19,16,.14); font-size:1rem }
  .wa-card{ margin:0 12px 10px; width:auto }
  body{ padding-bottom:58px }
  .gallery{ grid-auto-columns:86% }
  .gallery--product{ grid-auto-columns:80% }
}