/* Offers: packages, founding prices, add-ons, calculators, booking demo embed (1 Oct 2026).
   Loaded only on pages that sell something beyond the website tiers. */

/* founding price note */
.founding-note{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;margin:0 0 clamp(26px,3vw,40px);font-size:14px;color:var(--ice);opacity:.9;max-width:78ch}
.founding-note .mono{color:var(--acc-2)}
.light .founding-note{color:var(--mute-dark);opacity:1}
.light .founding-note .mono{color:var(--acc)}

/* package groups */
.pk-group + .pk-group{margin-top:clamp(40px,5vw,64px)}
.pk-care + .pk-group,.pk-care + div .pk-group{margin-top:clamp(48px,5.5vw,72px)}
.pk-group-h{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.pk-group-h h3{font-size:clamp(22px,2.2vw,30px)}
.pk-group-h p{color:var(--mute);font-size:14.5px;max-width:60ch}
.light .pk-group-h p{color:var(--mute-dark)}

.pk-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch}
.pk-row.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.pk-row.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.pk{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);padding:24px 22px 22px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));transition:border-color .35s,transform .5s var(--ease),box-shadow .5s var(--ease)}
.pk:hover{border-color:rgba(183,148,255,.55);transform:translateY(-4px);box-shadow:0 30px 70px -40px rgba(122,61,240,.6)}
.pk-n{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--acc-2)}
.pk h3{font-size:clamp(24px,2vw,30px);margin:10px 0 6px;letter-spacing:-.03em}
.pk-d{color:var(--ice);opacity:.82;font-size:14.5px;line-height:1.45;min-height:2.9em}
.pk-price{margin:18px 0 16px;font-family:var(--display);font-weight:700;font-size:clamp(26px,2.3vw,32px);letter-spacing:-.03em;line-height:1;display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 8px}
.pk-price small{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);font-weight:400}
.pk-price s{font-size:16px;color:var(--mute);font-weight:500;letter-spacing:-.01em}
.pk-price em{font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--mute);font-weight:400}
.pk ul{list-style:none;display:grid;gap:8px;font-size:14px;line-height:1.4;color:var(--ice);margin:0 0 22px}
.pk li{padding-left:18px;position:relative}
.pk li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:2px;border-radius:2px;background:var(--acc-2)}
.pk .btn{margin-top:auto;justify-content:center;white-space:normal;text-align:center}
.pk.feat{border-color:rgba(122,61,240,.65);background:linear-gradient(160deg,rgba(122,61,240,.2),rgba(232,121,249,.05) 62%,rgba(255,255,255,.01))}
.pk .flag{position:absolute;top:-11px;left:20px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--acc);color:#fff;padding:4px 10px;border-radius:999px}
.pk .pk-free{color:var(--acc-2)}
.light .pk{background:#fff;border-color:var(--line-dark)}
.light .pk:hover{border-color:var(--acc)}
.light .pk-d,.light .pk ul{color:var(--mute-dark);opacity:1}
.light .pk-n,.light .pk .pk-free{color:var(--acc)}
.light .pk li::before{background:var(--acc)}
.light .pk.feat{background:linear-gradient(160deg,rgba(122,61,240,.1),#fff 60%)}
@media (max-width:1180px){.pk-row{grid-template-columns:repeat(2,minmax(0,1fr))}.pk-row.three{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.pk-row.three{grid-template-columns:1fr}}
@media (max-width:640px){.pk-row,.pk-row.two{grid-template-columns:1fr}.pk-d{min-height:0}}

/* care strip and add-ons */
.pk-care{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:14px;margin-top:clamp(28px,3vw,40px);align-items:stretch}
.pk-care > div{border:1px solid var(--line);border-radius:var(--r);padding:22px}
.pk-care .lead-in h3{font-size:22px;margin:8px 0 8px}
.pk-care .lead-in p{color:var(--mute);font-size:14px}
.pk-care .ct b{font-family:var(--display);font-size:20px;letter-spacing:-.02em;display:block}
.pk-care .ct .price{display:block;font-family:var(--display);font-weight:700;font-size:28px;letter-spacing:-.03em;margin:10px 0 8px}
.pk-care .ct .price small{font-size:13px;color:var(--mute);font-weight:500}
.pk-care .ct p{font-size:14px;color:var(--ice);opacity:.82}
.light .pk-care > div{border-color:var(--line-dark);background:#fff}
.light .pk-care .lead-in p,.light .pk-care .ct p{color:var(--mute-dark);opacity:1}
@media (max-width:900px){.pk-care{grid-template-columns:1fr}}

.addons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;margin-top:8px}
.addon{display:grid;grid-template-columns:1fr auto;gap:4px 20px;padding:18px 0;border-top:1px solid var(--line);align-items:baseline}
.addon b{font-family:var(--display);font-size:19px;letter-spacing:-.02em}
.addon .ap{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:-.02em;white-space:nowrap}
.addon .ap small{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--mute);font-weight:400;text-transform:uppercase;margin-right:4px}
.addon p{grid-column:1/-1;font-size:14px;color:var(--ice);opacity:.8;max-width:56ch}
.light .addon{border-top-color:var(--line-dark)}
.light .addon p{color:var(--mute-dark);opacity:1}
@media (max-width:820px){.addons{grid-template-columns:1fr}}

/* definitions */
.defs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 30px;margin-top:clamp(36px,4vw,56px);padding-top:28px;border-top:1px solid var(--line)}
.defs-h{grid-column:1/-1}
.defs dt{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.02em;margin-bottom:6px}
.defs dd{font-size:14px;color:var(--ice);opacity:.8;line-height:1.5}
.defs > div{min-width:0}
.light .defs{border-top-color:var(--line-dark)}
.light .defs dd{color:var(--mute-dark);opacity:1}
@media (max-width:900px){.defs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.defs{grid-template-columns:1fr}}

/* systems: what we build */
.sys-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sys{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);padding:22px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012))}
.sys .sys-n{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--acc-2)}
.sys h3{font-size:clamp(20px,1.7vw,24px);margin:10px 0 8px;letter-spacing:-.025em}
.sys p{font-size:14px;color:var(--ice);opacity:.82;line-height:1.45;margin-bottom:16px}
.sys .sys-p{margin-top:auto;font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.02em}
.sys .sys-p small{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--mute);font-weight:400;text-transform:uppercase;margin-right:6px}
.sys .sys-p a{font-family:var(--body);font-weight:500;font-size:13px;color:var(--acc-2);margin-left:10px;letter-spacing:0}
.sys.feat{grid-column:span 2;border-color:rgba(122,61,240,.6);background:linear-gradient(150deg,rgba(122,61,240,.2),rgba(255,255,255,.01) 70%)}
.sys.feat h3{font-size:clamp(24px,2.2vw,32px)}
@media (max-width:1100px){.sys-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sys.feat{grid-column:auto}}
@media (max-width:620px){.sys-grid{grid-template-columns:1fr}.sys.feat{grid-column:auto}}

/* booking demo embed */
.bk-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(30px,5vw,80px);align-items:center}
.bk-points{list-style:none;display:grid;gap:14px;margin-top:22px}
.bk-points li{display:grid;grid-template-columns:28px 1fr;gap:12px;font-size:15px;color:var(--ice)}
.bk-points li i{width:28px;height:28px;border-radius:50%;background:rgba(122,61,240,.22);border:1px solid rgba(183,148,255,.5);display:grid;place-items:center;font-style:normal;font-family:var(--mono);font-size:11px;color:var(--acc-2)}
.bk-points b{display:block;font-family:var(--display);font-size:17px;letter-spacing:-.015em;color:var(--paper)}
.light .bk-points li{color:var(--mute-dark)}
.light .bk-points b{color:var(--ink)}
.bk-phone{position:relative;border-radius:34px;padding:10px;background:#0b0916;border:1px solid rgba(200,206,255,.18);box-shadow:0 50px 120px -50px rgba(122,61,240,.7)}
.bk-phone iframe{display:block;width:100%;height:640px;border:0;border-radius:26px;background:#f4f3f8}
.bk-phone figcaption{display:flex;justify-content:space-between;gap:12px;padding:12px 8px 2px;font-size:12.5px;color:var(--mute)}
.bk-phone figcaption a{color:var(--acc-2)}
@media (max-width:900px){.bk-split{grid-template-columns:1fr}.bk-phone{max-width:440px;margin-inline:auto;width:100%}}

/* savings calculator */
.calc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);border:1px solid var(--line-dark);border-radius:var(--r);background:#fff;padding:clamp(22px,3vw,36px)}
.calc-tools{display:grid;gap:10px}
.calc-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 34px;gap:10px;align-items:center}
.calc input,.calc select{width:100%;font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--line-dark);border-radius:12px;padding:11px 12px}
.calc input:focus,.calc select:focus{outline:2px solid var(--acc);outline-offset:1px}
.calc .cost{position:relative}
.calc .cost::before{content:"\00a3";position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--mute-dark);font-size:15px}
.calc .cost input{padding-left:24px}
.calc-del{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-dark);color:var(--mute-dark);font-size:18px;line-height:1}
.calc-add{justify-self:start;font-size:14px;font-weight:600;color:var(--acc);padding:6px 0}
.calc-labels{display:grid;grid-template-columns:minmax(0,1fr) 120px 34px;gap:10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute-dark)}
.calc-out{border-radius:18px;background:var(--ink);color:var(--paper);padding:clamp(20px,2.6vw,30px);display:grid;gap:16px;align-content:start}
.calc-out .big{font-family:var(--display);font-weight:700;font-size:clamp(36px,4vw,52px);letter-spacing:-.04em;line-height:1}
.calc-out .row{display:flex;justify-content:space-between;gap:14px;border-top:1px solid var(--line);padding-top:12px;font-size:14.5px;color:var(--ice)}
.calc-out .row b{color:var(--paper);font-family:var(--display);letter-spacing:-.02em}
.calc-out .fine{font-size:12.5px;color:var(--mute)}
@media (max-width:860px){.calc{grid-template-columns:1fr}.calc-row,.calc-labels{grid-template-columns:minmax(0,1fr) 100px 34px}}

/* training: format cards reuse .pk; topics and interest form */
.topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:8px}
.topic{border:1px solid var(--line-dark);border-radius:18px;padding:22px;background:#fff}
.topic .tn{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--acc)}
.topic b{display:block;font-family:var(--display);font-size:19px;letter-spacing:-.02em;margin:8px 0 8px}
.topic p{font-size:14.5px;color:var(--mute-dark)}
@media (max-width:900px){.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.topic-grid{grid-template-columns:1fr}}

.tools-line{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.tools-line span{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;border:1px solid var(--line);border-radius:999px;padding:6px 12px;color:var(--ice)}
.light .tools-line span{border-color:var(--line-dark);color:var(--mute-dark)}

.interest{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:10px;margin-top:22px;max-width:760px}
.interest input{font:inherit;font-size:15px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--paper);padding:13px 18px;min-width:0}
.interest input:focus{outline:2px solid var(--acc);outline-offset:1px}
.interest .done{grid-column:1/-1;color:var(--acc-2);font-size:14.5px}
@media (max-width:720px){.interest{grid-template-columns:1fr}}

/* films and characters (design page) */
.film-cards .pk h3{font-size:clamp(22px,1.9vw,28px)}
.pk .pk-media{margin:-8px -8px 16px;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#0b0916;border:1px solid var(--line)}
.pk .pk-media img{width:100%;height:100%;object-fit:cover}

/* brief CTA hint used on package buttons */
.pk .btn small{opacity:.75;font-weight:500}

/* training hero: a workshop agenda drawn in HTML, with its certificate */
.agenda{position:relative;border:1px solid rgba(200,206,255,.16);border-radius:20px;background:linear-gradient(180deg,#120d24,#0a0816);padding:26px 26px 22px;box-shadow:0 50px 120px -50px rgba(122,61,240,.75)}
.agenda-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:16px}
.agenda-h b{font-family:var(--display);font-size:22px;letter-spacing:-.025em}
.agenda-h span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--acc-2);text-transform:uppercase}
.agenda ol{list-style:none;display:grid;gap:0}
.agenda li{display:grid;grid-template-columns:62px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line);font-size:14.5px;color:var(--ice)}
.agenda li time{font-family:var(--mono);font-size:12px;color:var(--mute)}
.agenda li em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--acc-2);border:1px solid rgba(183,148,255,.35);border-radius:999px;padding:3px 8px}
.agenda li.now{color:var(--paper)}
.agenda li.now time{color:var(--acc-2)}
.cert{position:absolute;right:-18px;bottom:-34px;width:min(250px,60%);transform:rotate(-4deg);border-radius:14px;background:var(--paper);color:var(--ink);padding:16px 18px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7);border:1px solid #fff}
.cert .mono{color:var(--acc)!important;font-size:10px}
.cert b{display:block;font-family:var(--display);font-size:17px;letter-spacing:-.02em;margin:6px 0 4px}
.cert span{font-size:12px;color:var(--mute-dark)}
.cert i{position:absolute;right:14px;top:14px;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#b794ff,#7a3df0);box-shadow:0 0 0 3px rgba(122,61,240,.2)}
@media (max-width:900px){.cert{right:8px;bottom:-26px}}
@media (min-width:1101px){.sys-grid .sys.sys-wide{grid-column:1/-1}}
