/* ============================================================
   guide.css  ·  Beauty Guru Facilitation Guide
   The Vitality Project x SalonCentric  ·  US Letter, print ready

   Branding follows the marketing site (site-styles.css) and
   Elizabeth's approved look: script eyebrows in a brand colour,
   Noto Serif headlines, highlighted words inside sentences,
   rounded everything, tinted card backgrounds, soft corner glows.
   No flat label bars, no rules under headings, no em dashes.
   ============================================================ */

@font-face{
  font-family:'Club Tropicana';
  src:url('assets/club_tropicana.woff') format('woff');
  font-display:block;
}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:block;src:url('assets/f/dmsans-400.woff2') format('woff2');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:block;src:url('assets/f/dmsans-500.woff2') format('woff2');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:block;src:url('assets/f/dmsans-600.woff2') format('woff2');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:block;src:url('assets/f/dmsans-700.woff2') format('woff2');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:800;font-display:block;src:url('assets/f/dmsans-800.woff2') format('woff2');}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:900;font-display:block;src:url('assets/f/dmsans-900.woff2') format('woff2');}
@font-face{font-family:'Noto Serif';font-style:normal;font-weight:300;font-display:block;src:url('assets/f/notoserif-300.woff2') format('woff2');}
@font-face{font-family:'Noto Serif';font-style:normal;font-weight:400;font-display:block;src:url('assets/f/notoserif-400.woff2') format('woff2');}
@font-face{font-family:'Noto Serif';font-style:normal;font-weight:500;font-display:block;src:url('assets/f/notoserif-500.woff2') format('woff2');}
@font-face{font-family:'Noto Serif';font-style:normal;font-weight:600;font-display:block;src:url('assets/f/notoserif-600.woff2') format('woff2');}
@font-face{font-family:'Raleway';font-style:normal;font-weight:500;font-display:block;src:url('assets/f/raleway-500.woff2') format('woff2');}
@font-face{font-family:'Raleway';font-style:normal;font-weight:600;font-display:block;src:url('assets/f/raleway-600.woff2') format('woff2');}
@font-face{font-family:'Raleway';font-style:normal;font-weight:700;font-display:block;src:url('assets/f/raleway-700.woff2') format('woff2');}
@font-face{font-family:'Raleway';font-style:normal;font-weight:800;font-display:block;src:url('assets/f/raleway-800.woff2') format('woff2');}
@font-face{font-family:'Raleway';font-style:normal;font-weight:900;font-display:block;src:url('assets/f/raleway-900.woff2') format('woff2');}
@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:block;src:url('assets/f/bebasneue-400.woff2') format('woff2');}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:block;src:url('assets/f/montserrat-700.woff2') format('woff2');}
@font-face{font-family:'Brittany Signature';font-style:normal;font-weight:400;font-display:block;src:url('assets/f/brittany-signature.woff') format('woff');}
@font-face{font-family:'Kalam';font-style:normal;font-weight:700;font-display:block;src:url('assets/f/kalam-700.woff2') format('woff2');}
:root{
  --pink:#ff7feb; --green:#75eb63; --yellow:#fae851; --blue:#026cce;
  --orange:#ff7c44; --purple:#ae5fe0; --black:#000; --ink:#17131d;
  --white:#fff; --paper:#f7f7f7; --muted:#5d5568;

  --script:"Club Tropicana", cursive;
  --serif:"Noto Serif", Georgia, serif;
  --sans:"Raleway", system-ui, sans-serif;
  --body:"DM Sans", system-ui, sans-serif;

  --rainbow:linear-gradient(100deg,#ff7feb 0%,#ae5fe0 20%,#026cce 40%,
                            #33d6c8 56%,#75eb63 70%,#fae851 85%,#ff7c44 100%);

  /* pillar colours, matching the cover art */
  --mind:#ff7feb; --heart:#ff7c44; --bodyc:#75eb63; --career:#026cce;

  /* elastic photo heights, tuned so every page flows top down with no
     stranded gap. Do not hand edit without re-running the fit check. */
  --h03:1.71in; --h04:1.31in; --h06:2.83in; --h07:3.99in; --h08:2.30in;
  --h09:4.37in; --h11:3.50in; --h12:2.53in; --h13:0.90in; --h14:3.58in;
  --h15:3.36in; --h10a:2.78in; --h10b:2.82in; --h02:3.78in; --h03f:3.40in;

  --pageW:8.5in; --pageH:11in;
  --padX:.62in; --padT:.52in; --padB:.84in;
}

*{box-sizing:border-box;}

@page{ size:letter; margin:0; }

html,body{margin:0;padding:0;}
body{
  background:#e8e6ea;
  color:var(--ink);
  font-family:var(--body);
  font-size:14px;          /* 10.5pt floor */
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
p{margin:0 0 10px;}
h1,h2,h3,h4{margin:0;font-weight:inherit;}
ul{margin:0;padding:0;list-style:none;}

/* ── the page ─────────────────────────────────────────────── */
.sheet{padding:34px 0 60px;}
.page{
  position:relative;
  width:var(--pageW);
  height:var(--pageH);
  margin:0 auto 26px;
  background:var(--white);
  overflow:hidden;
  page-break-after:always;
  break-after:page;
  box-shadow:0 18px 46px rgba(23,19,29,.22);
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}
.page:last-child{page-break-after:auto;break-after:auto;}
.inner{
  position:absolute;
  top:var(--padT); right:var(--padX); bottom:var(--padB); left:var(--padX);
  display:flex; flex-direction:column;
}
.page.dark{background:#000;color:#fff;}

/* soft corner glows */
.glow{position:absolute;pointer-events:none;z-index:0;}
.glow img{width:100%;height:auto;}
.glow-tr{top:-120px;right:-130px;width:330px;opacity:.30;}
.glow-bl{bottom:-140px;left:-150px;width:360px;opacity:.24;}
.glow-br{bottom:-130px;right:-120px;width:300px;opacity:.22;}
/* a column flex container will squeeze its children by default, which
   silently clipped a card. Nothing on a page may shrink. */
.inner > *{position:relative;z-index:1;flex-shrink:0;}

/* ── running footer ───────────────────────────────────────── */
.foot{
  position:absolute; left:var(--padX); right:var(--padX); bottom:.22in;
  display:flex; align-items:center; gap:12px;
  font:500 8.4px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  color:#9a93a4; z-index:2;
}
.foot .f-l{flex:0 0 auto;}
.foot .f-c{flex:1 1 auto;text-align:center;}
.foot .f-r{flex:0 0 auto;display:flex;align-items:center;gap:8px;}
.foot .f-num{font-weight:800;color:var(--ink);letter-spacing:.06em;font-size:9.5px;}
.foot .f-mark{width:15px;height:15px;opacity:.95;}

/* ── type ─────────────────────────────────────────────────── */
.eb{                       /* script eyebrow, Elizabeth's approved look */
  font-family:var(--script); font-size:27px; line-height:1;
  color:var(--pink); margin:0 0 6px; display:block;
}
.eb.green{color:#3fae2e;} .eb.blue{color:var(--blue);}
.eb.orange{color:#f2600e;} .eb.purple{color:var(--purple);}
.eb.sm{font-size:22px;}

.h-serif{
  font-family:var(--serif); font-weight:300; letter-spacing:-.012em;
  line-height:1.16; font-size:31px; color:var(--ink);
}
.h-serif.sm{font-size:25px;}
.h-serif b,.h-serif strong{font-weight:600;}
.h-caps{
  font-family:var(--sans); font-weight:800; text-transform:uppercase;
  letter-spacing:-.015em; line-height:1; font-size:30px;
}
.sub-script{                /* rotated orange script subline tucked under */
  font-family:var(--script); color:#f2600e; font-size:26px; line-height:1;
  display:inline-block; transform:rotate(-3.2deg); transform-origin:left center;
  margin:6px 0 0 6px;
}

.hl      {box-shadow:inset 0 -.34em 0 rgba(255,127,235,.40);font-weight:700;}
.hl-green{box-shadow:inset 0 -.34em 0 rgba(117,235,99,.42); font-weight:700;}
.hl-blue {box-shadow:inset 0 -.34em 0 rgba(2,108,206,.20);  font-weight:700;}
.hl-yell {box-shadow:inset 0 -.34em 0 rgba(250,232,81,.62); font-weight:700;}

.lede{font-size:13.4px;line-height:1.62;color:#3a3442;}
.body-s{font-size:12.4px;line-height:1.56;color:#413b4a;}

/* ── pills, chips, cards ──────────────────────────────────── */
.pill{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 15px;border-radius:999px;
  font:700 11px/1.25 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  background:color-mix(in srgb, var(--ac,#ff7feb) 16%, #fff);
  color:#2a2431;
}
.pill.solid{background:var(--ac);color:#fff;}
.pill.ghost{background:#f2f0f4;color:#4a4353;}
.pill.sc{text-transform:none;letter-spacing:.01em;font-size:12px;}
.pill.lg{font-size:12px;padding:8px 18px;}
.pill-row{display:flex;flex-wrap:wrap;gap:8px;}

.card{
  border-radius:18px;padding:16px 18px;
  background:color-mix(in srgb, var(--ac,#ff7feb) 11%, #fff);
}
.card.white{background:#fff;box-shadow:0 2px 14px rgba(23,19,29,.09);}
.card.tight{padding:13px 15px;border-radius:16px;}
.card h4{
  font-family:var(--script);font-size:21px;line-height:1;
  color:var(--ac);margin:0 0 5px;
}
.card .k{
  font:800 11px/1.3 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:#2a2431;display:block;margin-bottom:3px;
}

/* facilitation tip: rounded, orange tinted, script label */
.tip{
  --ac:var(--orange);
  border-radius:16px;padding:11px 15px 12px;margin:11px 0 15px;
  background:color-mix(in srgb, var(--orange) 15%, #fff);
}
.tip .lbl{
  font-family:var(--script);font-size:21px;line-height:1.1;word-spacing:.35em;
  color:#f2600e;display:block;margin-bottom:3px;
}
.tip p{margin:0;font-size:12.8px;line-height:1.52;color:#3c3645;}
.tip p + p{margin-top:5px;}

/* ── guide sections ───────────────────────────────────────── */
.sec{
  margin:0;border-radius:18px;padding:14px 19px;
  background:#f6f5f8;
  border:1px solid rgba(23,19,29,.06);
}
.sec + .sec{margin-top:12px;}
.sec-head{display:flex;align-items:flex-end;gap:14px;margin:0 0 7px;}
.sec-no{
  font-family:var(--script);font-size:26px;line-height:1;color:var(--pink);
  flex:0 0 auto;padding-bottom:2px;
}
.sec-title{
  font-family:var(--serif);font-weight:400;font-size:23px;line-height:1.1;
  letter-spacing:-.012em;color:var(--ink);
}
.sec-title.two{font-size:20px;}
.mats{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;}
.mats .m-lbl{
  font:800 9.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  color:#8d8598;
}
.mats .m{
  padding:4.5px 13px;border-radius:999px;font:700 10.5px/1.2 var(--sans);
  letter-spacing:.04em;background:#f1eff4;color:#3d3747;
}
.mats .m.wb{background:color-mix(in srgb, var(--pink) 17%, #fff);}
.mats .m.em{background:color-mix(in srgb, var(--blue) 13%, #fff);}
.mats .m.sn{background:color-mix(in srgb, var(--yellow) 34%, #fff);}
.mats .m.rs{background:color-mix(in srgb, var(--green) 20%, #fff);}

.narr{                       /* italic narration of what Elizabeth does */
  font-style:italic;font-size:13.3px;line-height:1.56;color:#332d3c;
  margin:0 0 11px;
}
.narr b,.narr strong{font-style:italic;font-weight:700;color:var(--ink);}

.quote{
  --ac:var(--purple);
  border-radius:20px;padding:20px 24px;
  background:color-mix(in srgb, var(--purple) 10%, #fff);
  font-family:var(--serif);font-weight:300;font-style:italic;
  font-size:15.5px;line-height:1.52;color:#2c2635;
}


/* ── photos ───────────────────────────────────────────────── */
.ph{border-radius:16px;overflow:hidden;background:#eee;}
.ph img{width:100%;height:100%;object-fit:cover;display:block;}
.ph.r20{border-radius:20px;} .ph.r12{border-radius:12px;}

.polaroid{
  background:#fff;padding:10px 10px 0;border-radius:6px;
  box-shadow:0 12px 30px rgba(0,0,0,.30);
}
.polaroid img{border-radius:2px;}
.polaroid .cap{
  font-family:var(--script);font-size:17px;line-height:1.15;
  color:#2a2431;text-align:center;padding:9px 4px 11px;
}
.washi{
  position:absolute;width:74px;height:26px;
  background:rgba(174,143,226,.62);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);
}

/* ── grids ────────────────────────────────────────────────── */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px;}
.row{display:flex;gap:14px;}
.spacer{flex:1 1 auto;}
.push{margin-top:auto;}

/* ── download button ──────────────────────────────────────── */
#dl{
  position:fixed;right:26px;bottom:26px;z-index:99;
  border:0;cursor:pointer;border-radius:999px;
  padding:15px 30px;background:var(--pink);color:#1b1220;
  font:800 13px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;
  box-shadow:0 12px 30px rgba(255,127,235,.5);
}
#dl:hover{transform:translateY(-2px);}

@media print{
  body{background:#fff;}
  .sheet{padding:0;}
  .page{margin:0;box-shadow:none;}
  #dl{display:none !important;}
}

/* ============================================================
   COVER  ·  recreated from the SalonCentric x Vitality tile
   ============================================================ */
.cover{background:#000;color:#fff;}
.cover .frame{
  position:absolute;inset:.34in;
  border:1.2px solid rgba(255,255,255,.75);
  z-index:4;pointer-events:none;
}
.cover .beam{position:absolute;inset:0;z-index:0;}
.cover .beam::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse 30% 22% at 46% 34%, rgba(255,190,35,.98) 0%, rgba(255,150,25,.78) 44%, rgba(255,120,20,0) 74%),
    radial-gradient(ellipse 30% 24% at 60% 32%, rgba(250,236,90,.72) 0%, rgba(250,236,90,0) 70%),
    radial-gradient(ellipse 32% 30% at 20% 35%, rgba(255,35,135,.95) 0%, rgba(236,30,120,0) 72%),
    radial-gradient(ellipse 32% 30% at 80% 35%, rgba(70,228,85,.92) 0%, rgba(60,210,80,0) 72%),
    radial-gradient(ellipse 54% 40% at 28% 54%, rgba(150,45,215,.60) 0%, rgba(150,45,215,0) 74%),
    radial-gradient(ellipse 54% 40% at 72% 54%, rgba(20,90,215,.56) 0%, rgba(20,90,215,0) 74%),
    radial-gradient(ellipse 46% 22% at 50% 16%, rgba(120,40,190,.42) 0%, rgba(120,40,190,0) 78%);
  filter:blur(3px);
}
.cover .beam::after{      /* fade the whole bloom back into black at the edges */
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 56% 40% at 50% 36%, rgba(0,0,0,0) 26%, rgba(0,0,0,.70) 62%, #000 90%);
}
.cover .waves{
  position:absolute;top:0;bottom:0;width:1.05in;z-index:1;opacity:.55;
  background:repeating-linear-gradient(90deg,
    rgba(255,60,120,.5) 0 1.4px, rgba(255,60,120,0) 1.4px 13px);
  mask-image:linear-gradient(90deg,#000,rgba(0,0,0,0));
  -webkit-mask-image:linear-gradient(90deg,#000,rgba(0,0,0,0));
}
.cover .waves.l{left:0;}
.cover .waves.r{
  right:0;transform:scaleX(-1);
  background:repeating-linear-gradient(90deg,
    rgba(70,225,120,.5) 0 1.4px, rgba(70,225,120,0) 1.4px 13px);
}
.cover .cin{
  position:absolute;inset:.34in;z-index:5;
  display:flex;flex-direction:column;align-items:center;
  justify-content:space-between;
  padding:.46in .46in 1.06in;
}
.cover .cgroup{display:flex;flex-direction:column;align-items:center;}
.lockup{display:flex;align-items:center;gap:22px;}
.lockup img.sc{width:212px;filter:brightness(0) invert(1);}
.lockup img.tvp{width:132px;}
.lockup .x{font:600 15px/1 var(--sans);color:rgba(255,255,255,.85);}
.cover .kicker{
  font-family:var(--script);font-size:25px;line-height:1;
  color:var(--yellow);margin-top:13px;
}
.cover .wa{
  font-family:'Montserrat',var(--sans);font-weight:700;text-transform:uppercase;color:#fff;
  text-align:center;margin-top:0;-webkit-font-smoothing:antialiased;
}
.cover .w1{font-size:44px;letter-spacing:.30em;text-indent:.30em;line-height:1;}
.cover .w2{font-size:27px;letter-spacing:.36em;text-indent:.36em;line-height:1;margin-top:12px;}
.cover .w3{
  font-family:'Bebas Neue',var(--sans);font-weight:400;font-size:128px;line-height:.86;
  letter-spacing:.09em;text-indent:.09em;margin-top:8px;
}
.cover .divider{
  display:flex;align-items:center;gap:16px;width:4.9in;margin:0;
}
.cover .divider i{flex:1 1 auto;height:1.1px;background:rgba(255,255,255,.82);}
.cover .divider img{width:38px;opacity:.96;}
.cover .subline{
  font:700 17px/1.4 'Montserrat',var(--sans);letter-spacing:.20em;text-transform:uppercase;
  text-align:center;margin-top:17px;color:#fff;
}
.pillars{display:flex;align-items:flex-end;gap:0;margin-top:0;}
.pillars .p{
  display:flex;flex-direction:column;align-items:center;gap:11px;
  padding:0 34px;
}
.pillars .p + .p{border-left:1px solid rgba(255,255,255,.34);}
.pillars .p span{
  font:700 13.5px/1 'Montserrat',var(--sans);letter-spacing:.20em;text-transform:uppercase;color:#fff;
}
.pillars svg{width:52px;height:52px;display:block;}
.pillars img.pi{width:64px;height:64px;display:block;object-fit:contain;}
.cover .claim{
  font:700 21px/1.38 'Montserrat',var(--sans);letter-spacing:.09em;text-transform:uppercase;
  text-align:center;margin-top:0;color:#fff;
}
.cover .claim .f{color:#5ad6e8;}
.cover .fine{
  font:700 11.6px/1.4 'Montserrat',var(--sans);letter-spacing:.10em;text-transform:uppercase;
  text-align:center;margin-top:14px;color:rgba(255,255,255,.92);
}
.cover .fine .m{color:#ff5fb0;} .cover .fine .b{color:#75eb63;} .cover .fine .c{color:#3fa9f5;}
.cover .pol{
  position:absolute;right:.42in;top:2.30in;width:1.66in;z-index:6;
  transform:rotate(4.2deg);
}
.cover .pol .washi{top:-13px;left:-16px;transform:rotate(-26deg);}
.cover .band{
  position:absolute;left:.34in;right:.34in;bottom:.34in;z-index:6;
  background:var(--rainbow);
  padding:13px 20px 15px;text-align:center;color:#14101a;
}
.cover .band .b1{
  font:900 19px/1.1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
}
.cover .band .b2{
  margin-top:4px;font:600 17px/1.15 var(--sans);letter-spacing:.05em;
  text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:10px;
}
.cover .band .b2 em{
  font-family:'Brittany Signature',var(--script);font-style:normal;font-size:27px;letter-spacing:0;
  text-transform:none;position:relative;top:0;color:#fff;line-height:1;
}

/* ============================================================
   BACK COVER
   ============================================================ */
.back{background:#000;color:#fff;}
.back .beam{position:absolute;inset:0;z-index:0;}
.back .beam::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(ellipse 40% 30% at 50% 38%, rgba(255,180,50,.62) 0%, rgba(255,150,25,0) 70%),
    radial-gradient(ellipse 34% 28% at 24% 40%, rgba(255,40,140,.60) 0%, rgba(236,30,120,0) 72%),
    radial-gradient(ellipse 34% 28% at 76% 40%, rgba(70,225,85,.55) 0%, rgba(60,210,80,0) 72%),
    radial-gradient(ellipse 54% 42% at 50% 66%, rgba(130,50,215,.45) 0%, rgba(130,50,215,0) 74%);
  filter:blur(10px);
}
.back .beam::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 52% at 50% 44%, rgba(0,0,0,0) 34%, rgba(0,0,0,.68) 72%, #000 100%);
}
.back .bin{
  position:absolute;inset:.34in;z-index:3;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:.80in .70in .80in;text-align:center;
}
.back .frame{
  position:absolute;inset:.34in;border:1.2px solid rgba(255,255,255,.55);z-index:4;pointer-events:none;
}
.back .bmark{width:236px;}
.back .btag{
  font-family:var(--serif);font-weight:300;font-size:27px;line-height:1.26;
  margin-top:30px;color:#fff;
}
.back .btag .s{font-family:var(--script);font-size:33px;color:var(--yellow);}
.back .bsub{
  font:600 13.4px/1.6 var(--body);color:rgba(255,255,255,.84);
  margin-top:14px;max-width:5.1in;
}
.back .bqr{
  margin-top:26px;background:#fff;padding:11px;border-radius:16px;
}
.back .bqr img{width:1.24in;height:1.24in;}
.back .bweb{
  margin-top:16px;padding:10px 24px;border-radius:999px;
  background:rgba(255,255,255,.13);
  box-shadow:inset 0 0 0 1.2px rgba(255,255,255,.42);
  font:800 12.6px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;
}
.back .bsoc{
  margin-top:12px;font:600 12px/1 var(--sans);letter-spacing:.13em;
  color:rgba(255,255,255,.80);
}
.pillars.bp{margin-top:34px;}
.pillars.bp .p{padding:0 24px;gap:8px;}
.pillars.bp svg{width:36px;height:36px;}
.pillars.bp .p span{font-size:11px;letter-spacing:.18em;}
.back .block{
  margin-top:52px;display:flex;align-items:center;justify-content:center;gap:18px;
}
.back .block img.sc{width:150px;filter:brightness(0) invert(1);}
.back .block img.tvp{width:92px;}
.back .block .x{font:600 12px/1 var(--sans);color:rgba(255,255,255,.7);}

/* ============================================================
   one off page furniture
   ============================================================ */
.stat-row{display:flex;gap:9px;}
.stat{
  flex:1 1 0;border-radius:16px;padding:11px 13px;
  background:color-mix(in srgb, var(--ac) 13%, #fff);
}
.stat .n{font:900 19px/1 var(--sans);color:var(--ac2,#2a2431);letter-spacing:-.02em;}
.stat .t{font:600 10.4px/1.35 var(--body);color:#4a4353;margin-top:4px;}

.founder{
  display:flex;gap:15px;align-items:flex-start;
  border-radius:20px;padding:15px 17px;background:#faf8fb;
  box-shadow:0 2px 14px rgba(23,19,29,.08);
}
.founder .fimg{flex:0 0 auto;border-radius:14px;overflow:hidden;}
.founder .fn{font-family:var(--serif);font-weight:500;font-size:17px;line-height:1.1;}
.founder .fr{font-size:11.6px;line-height:1.48;color:#4a4353;margin-top:6px;}

.weblink{
  display:inline-flex;align-items:center;gap:9px;
  padding:9px 20px;border-radius:999px;background:var(--ink);color:#fff;
  font:800 11.6px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;
}
.weblink .dot{width:7px;height:7px;border-radius:50%;background:var(--pink);}

.tipcard{
  border-radius:16px;padding:16px 18px;
  background:color-mix(in srgb, var(--ac) 12%, #fff);
  display:flex;gap:10px;align-items:flex-start;
}
.tipcard img{width:22px;height:22px;flex:0 0 auto;margin-top:1px;}
.tipcard .tc{font-size:12.2px;line-height:1.5;color:#3d3746;}
.tipcard .tc b{
  display:block;font:800 10.4px/1.3 var(--sans);letter-spacing:.05em;
  text-transform:uppercase;color:#241f2c;margin-bottom:2px;
}

.goal{
  display:flex;gap:12px;align-items:flex-start;
  border-radius:16px;padding:11px 15px;background:#fff;
  box-shadow:0 2px 12px rgba(23,19,29,.085);
}
.goal .gn{
  font-family:var(--script);font-size:24px;line-height:.9;color:var(--ac);
  flex:0 0 auto;width:22px;
}
.goal .gt{font-size:11.9px;line-height:1.45;color:#3a3442;}

.flow{display:grid;grid-template-columns:1fr 1fr;gap:11px 18px;}
.flow .fw{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;font-size:11px;line-height:1.32;align-items:start;}
.flow .fw .fn{
  font:800 9.6px/1 var(--sans);color:#fff;background:var(--ink);
  border-radius:999px;padding:4px 7px;grid-row:1 / span 2;align-self:start;
}
.flow .fw .ft{font-weight:600;color:#2f2938;}
.flow .fw .fm{font-size:9px;color:#8d8598;letter-spacing:.05em;text-transform:uppercase;font-weight:700;}


.offer{
  position:relative;border-radius:22px;overflow:hidden;background:#000;color:#fff;
  padding:22px 26px;
}
.offer .og{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 36% 70% at 14% 48%, rgba(255,45,150,.88), rgba(255,45,150,0) 72%),
    radial-gradient(ellipse 34% 66% at 48% 44%, rgba(255,175,40,.72), rgba(255,175,40,0) 72%),
    radial-gradient(ellipse 36% 70% at 86% 52%, rgba(70,228,110,.72), rgba(70,228,110,0) 72%),
    radial-gradient(ellipse 60% 60% at 50% 96%, rgba(140,50,215,.55), rgba(140,50,215,0) 74%);
  filter:blur(9px);
}
.offer > *{position:relative;z-index:1;}
.offer .eb{color:var(--yellow);}

.step{
  display:flex;align-items:center;gap:8px;padding:7px 15px;border-radius:999px;
  background:#fff;box-shadow:0 2px 10px rgba(23,19,29,.10);
  font:700 11px/1 var(--sans);letter-spacing:.04em;color:#2f2938;
}
.step .sn{
  width:18px;height:18px;border-radius:50%;background:var(--pink);color:#1b1220;
  display:flex;align-items:center;justify-content:center;font:900 10px/1 var(--sans);
}

.feat{
  border-radius:16px;padding:18px 18px;
  background:color-mix(in srgb, var(--ac) 12%, #fff);
}
.feat .fh{
  display:flex;align-items:center;gap:8px;
  font:800 11.4px/1.2 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:#241f2c;
}
.feat .fh img{width:21px;height:21px;}
.feat .fb{font-size:12.3px;line-height:1.48;color:#443d4f;margin-top:6px;}

#b03{height:var(--h03);}
#b04 .ph{height:var(--h04);}
#b06{height:var(--h06);}
#b07{height:auto;}
#b08{height:var(--h08);}
#b09{height:var(--h09);}
#b11 .ph{height:var(--h11);}
#b12{height:var(--h12);}
#b13{height:var(--h13);}
#b14 .ph{height:var(--h14);}
#b15p{height:var(--h15);}
#b10a{height:var(--h10a);}
#b10b{height:var(--h10b);}
#b02{height:var(--h02);}
#b03f{height:auto;}
#b04p{height:auto;}
#b04p{height:auto;}

/* automatic page numbers */
.sheet{counter-reset:pg;}
.page{counter-increment:pg;}
.foot .f-num::before{content:counter(pg);}


/* the pillar row on the app page uses the plain label, no icon */
.feat .fh:has(> img){gap:8px;}

/* cover polaroid caption: handwritten print on a paper label, like the tile */
.cover .pol .cap{
  font-family:'Kalam',var(--script);font-weight:700;font-size:13.5px;line-height:1.2;
  color:#17131d;background:#f6f3ec;padding:6px 10px 5px;border-radius:2px;
  box-shadow:0 2px 6px rgba(0,0,0,.25);transform:rotate(-2deg);display:inline-block;margin-top:6px;
}

/* ============================================================
   Elizabeth's Sep 11 review
   ============================================================ */

/* the eyebrow in ink rather than a brand colour (page 4) */
.eb.ink{color:var(--ink);}

/* a readable heading over the tips grid, replacing the rotated subline */
.grid-head{
  font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.28;
  color:var(--ink);margin:18px 0 0;
}

/* the tenth card: a bonus, yellow tinted, with a small script tag */
.tipcard.bonus{position:relative;}
.tipcard .bonus-tag{
  position:absolute;right:16px;top:11px;
  font-family:var(--script);font-size:19px;line-height:1;color:#a8790a;
}
.tipcard.bonus .tc{padding-right:56px;}

/* page 2 stat collage: four tiles, each with the bird mark tucked in a corner */
.collage{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;}
.tile{
  position:relative;overflow:hidden;border-radius:16px;padding:16px 15px;
  background:color-mix(in srgb, var(--ac) 13%, #fff);
}
.tile .tmark{
  position:absolute;right:-9px;bottom:-11px;width:54px;height:auto;opacity:.17;
}
.tile .n{font:900 18px/1.1 var(--sans);color:var(--ac2);letter-spacing:-.02em;}
.tile .t{font:600 10.9px/1.34 var(--body);color:#4a4353;margin-top:4px;}
.tile .s{font:500 10px/1.3 var(--body);color:#7b7387;margin-top:2px;}

/* the two round portraits beside the signature */
.faces{display:flex;align-items:center;}
.faces img{
  width:.70in;height:.70in;border-radius:50%;object-fit:cover;
  box-shadow:0 0 0 2.5px #fff, 0 2px 9px rgba(23,19,29,.20);
}
.faces img + img{margin-left:-.15in;}
.faces-cap{
  font:600 9.6px/1.25 var(--body);color:#7b7387;
  margin-top:7px;text-align:center;letter-spacing:.01em;
}

/* ============================================================
   Page 6 · the seat photo carries its own labels, and the
   giveaway moment takes the lower half of the page
   ============================================================ */

.seatshot{
  position:relative;margin:0;border-radius:20px;overflow:hidden;
  box-shadow:0 3px 16px rgba(23,19,29,.14);
}
.seatshot img{width:100%;height:auto;display:block;}

/* leader lines. The viewBox is stretched, so the stroke is pinned */
.seatshot .leads{
  position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
}
.seatshot .leads line{
  stroke:#fff;stroke-width:1.4;stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.55));
}
.seatshot .dot{
  position:absolute;width:9px;height:9px;border-radius:50%;
  background:#fff;transform:translate(-50%,-50%);
  box-shadow:0 0 0 2.5px rgba(23,19,29,.30), 0 1px 3px rgba(0,0,0,.45);
}
.seatshot .tag{
  position:absolute;display:inline-block;white-space:nowrap;
  padding:5.5px 12px;border-radius:999px;background:#fff;
  font:800 10px/1 var(--sans);letter-spacing:.03em;color:#241f2c;
  box-shadow:0 2px 9px rgba(0,0,0,.28);
}

.give-big{
  position:relative;overflow:hidden;border-radius:22px;padding:24px 26px;
  background:color-mix(in srgb, var(--pink) 13%, #fff);
}
.give-big .gg{
  position:absolute;right:-110px;top:-120px;width:360px;height:360px;
  background:conic-gradient(from 200deg,#ff7feb,#ae5fe0,#026cce,#33d6c8,#75eb63,#fae851,#ff7c44,#ff7feb);
  filter:blur(52px);opacity:.45;pointer-events:none;
}
.give-big > *{position:relative;z-index:1;}
.give-big .eb{color:#d13fae;}

.tag-pill{
  display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;
  background:#fff;box-shadow:0 2px 10px rgba(23,19,29,.11);
  font:800 11.5px/1 var(--sans);letter-spacing:.02em;color:#2f2938;
}
.tag-pill.hash{background:var(--ink);color:#fff;}

/* ============================================================
   Page 7 · the room plan, and what a membership includes
   ============================================================ */

.roomcard{
  margin:0;border-radius:16px;padding:34px 15px 26px;
  background:color-mix(in srgb, var(--blue) 7%, #fff);
}
.roomplan{display:block;width:100%;height:auto;}
.roomplan .wall{fill:#fff;stroke:#c9d6e6;stroke-width:1.6;}
.roomplan .screen{fill:var(--ink);}
.roomplan .tbl{fill:color-mix(in srgb, var(--pink) 26%, #fff);stroke:#e4a9d8;stroke-width:1.1;}
.roomplan .chr{fill:#fff;stroke:#8e86a0;stroke-width:1.6;}
.roomplan .facil{fill:var(--green);stroke:#3d8f2f;stroke-width:1.4;}
.roomplan .doorgap{stroke:#fff;stroke-width:4;}
.roomplan .doorswing{fill:none;stroke:#b9b2c6;stroke-width:1.4;stroke-dasharray:4 3;}
.roomplan .lbl{
  fill:var(--ink);font:800 13px var(--sans);letter-spacing:.16em;text-anchor:middle;
}
.roomcap{
  font-family:var(--script);font-size:16px;line-height:1.15;
  color:var(--blue);text-align:center;margin:8px 2px 0;
}

.qrnote{font:600 10.4px/1.3 var(--body);color:#5d5568;margin-top:8px;}


/* ============================================================
   Sep 11 · Elizabeth's review batch
   ============================================================ */

/* page 3 · the line that closes the founder story */
.closing-line{
  font-family:var(--serif);font-weight:600;font-size:16px;line-height:1.35;
  color:var(--ink);margin:14px 0 0;
}

/* page 3 · the two video cards */
.vidcard{
  position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;
  border-radius:18px;padding:15px 18px;background:#fff;
  box-shadow:0 3px 16px rgba(23,19,29,.12);
  text-decoration:none;color:inherit;
}
.vidcard .vg{
  position:absolute;right:-70px;top:-80px;width:210px;height:210px;
  background:conic-gradient(from 200deg,#ff7feb,#ae5fe0,#026cce,#33d6c8,#75eb63,#fae851,#ff7c44,#ff7feb);
  filter:blur(34px);opacity:.38;pointer-events:none;
}
.vidcard > *{position:relative;z-index:1;}
.vidcard .vbody{flex:1 1 auto;display:block;}
.veb{
  display:block;font-family:var(--script);font-size:18px;line-height:1;
  color:var(--pink);margin-bottom:5px;
}
.vtitle{
  display:block;font-family:var(--serif);font-weight:500;font-size:14.5px;
  line-height:1.26;color:var(--ink);
}
.vurl{
  display:inline-block;margin-top:9px;padding:5px 12px;border-radius:999px;
  background:var(--ink);color:#fff;
  font:800 9.4px/1 var(--sans);letter-spacing:.04em;
}
.vqr{position:relative;flex:0 0 auto;display:block;}
.vqr img{width:1.05in;height:1.05in;display:block;border-radius:8px;}
.vqr .play{
  position:absolute;right:-6px;bottom:-6px;width:23px;height:23px;border-radius:50%;
  background:var(--pink);box-shadow:0 2px 7px rgba(23,19,29,.30);
}
.vqr .play::after{
  content:"";position:absolute;left:9px;top:6.5px;
  border-left:8px solid #1b1220;border-top:5px solid transparent;border-bottom:5px solid transparent;
}

/* page 4 · heart shaped portraits from the paint shoot */
.faces img{
  width:1.15in;height:1.15in;border-radius:50%;object-fit:cover;
  box-shadow:0 0 0 3px #fff, 0 3px 12px rgba(23,19,29,.18);
}
.faces img + img{margin-left:-.22in;}

/* page 5 · the bonus card, rainbow edged and hard to miss */
.bonuswrap{
  border-radius:18px;padding:2px;
  background:linear-gradient(100deg,#ff7feb 0%,#ae5fe0 20%,#026cce 40%,
             #33d6c8 56%,#75eb63 70%,#fae851 85%,#ff7c44 100%);
}
.bonuswrap .tipcard.bonus{
  border-radius:16px;
  background:color-mix(in srgb, var(--yellow) 55%, #fff);
}
.tipcard.bonus .tc b{font-size:14px;letter-spacing:.02em;}
.tipcard .bonus-tag{font-size:25px;color:#f2600e;right:18px;top:12px;}
.tipcard.bonus .tc{padding-right:74px;}

/* the note strip Elizabeth wrote, used on pages 6 and 7 */
.notestrip{
  border-radius:14px;padding:12px 15px;
  background:color-mix(in srgb, var(--yellow) 30%, #fff);
}
.notestrip .lbl{
  display:block;font-family:var(--script);font-size:18px;line-height:1;
  color:#a8790a;margin-bottom:4px;
}
.notestrip p{font-size:11.4px;line-height:1.46;color:#3d3746;margin:0;}

/* page 7 · the QR sits in one centred row under the note */
.qrrow{
  display:flex;align-items:center;gap:20px;
  width:fit-content;margin:20px auto 0;
  border-radius:18px;padding:16px 24px 16px 16px;
  background:color-mix(in srgb, var(--green) 11%, #fff);
}
.qrrow .qrtext{display:flex;flex-direction:column;gap:9px;}
.qrrow img{width:1.34in;height:1.34in;border-radius:9px;background:#fff;flex:0 0 auto;}
.qrnote{font:600 11px/1.3 var(--body);color:#5d5568;}

/* page 8 · the offer's feature pills */
.offer-pill{
  display:flex;align-items:center;gap:9px;
  padding:11px 16px;border-radius:999px;background:#fff;
  font:800 12px/1.2 var(--sans);letter-spacing:.02em;color:#1b1220;
}
.offer-pill::before{
  content:"";width:7px;height:7px;border-radius:50%;flex:0 0 auto;
  background:var(--pink);
}

/* page 7 · what the green dot on each plan means */
.planlegend{
  display:flex;align-items:center;gap:9px;margin:14px 2px 0;
  font:600 11px/1.3 var(--body);color:#5d5568;
}
.planlegend .pl-dot{
  width:11px;height:11px;border-radius:50%;flex:0 0 auto;
  background:var(--green);box-shadow:0 0 0 1.4px #3d8f2f inset;
}

/* ============================================================
   Sep 11 · the premium offer page
   ============================================================ */

/* a thin gold to rainbow edge around the black card */
.offerwrap{
  flex:1 1 auto;border-radius:24px;padding:2px;
  background:linear-gradient(140deg,#e7c66a 0%,#f6e3a4 14%,#ff7feb 36%,
             #ae5fe0 52%,#026cce 66%,#75eb63 80%,#fae851 92%,#e7c66a 100%);
  box-shadow:0 10px 34px rgba(23,19,29,.22);
}
.offerwrap .offer{border-radius:22px;}

.offer-cta{
  display:inline-flex;align-items:center;justify-content:center;
  padding:15px 32px;border-radius:999px;background:#fff;color:#14101a;
  font:900 15px/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
}
.qr-cap{
  font:600 12.5px/1.4 var(--body);color:rgba(255,255,255,.82);margin-top:14px;
}
.offer-fine{
  font:400 12.5px/1.5 var(--body);color:rgba(255,255,255,.80);
  margin:0;padding-top:6px;
}

/* page 8 · the logo on the card and the bird bleeding off the corner */
.offer-logo{width:1.95in;height:auto;display:block;}
.offer-bird{
  position:absolute;right:-0.55in;bottom:-0.55in;width:2.60in;height:auto;
  opacity:.35;z-index:0;pointer-events:none;
}

/* page 9 · the class flyer, pinned like a polaroid */
.flyer{
  margin:26px auto 0;width:5.80in;
  background:#fff;padding:12px 12px 0;border-radius:4px;
  box-shadow:0 10px 26px rgba(23,19,29,.22);
  transform:rotate(-1.5deg);
}
.flyer img{width:100%;height:auto;display:block;border-radius:2px;}
.flyer figcaption{
  font-family:'Kalam',var(--script);font-weight:700;font-size:13px;line-height:1.2;
  color:#4a4353;text-align:center;padding:10px 4px 12px;
}

/* a badge that marks a materials moment inside a section box */
.spray-badge{
  position:absolute;top:14px;right:16px;z-index:2;
  display:flex;align-items:center;gap:8px;
}
.spray-badge .sb-ic{
  width:34px;height:34px;border-radius:50%;flex:0 0 auto;
  background:#fff;box-shadow:0 2px 8px rgba(23,19,29,.16);
  display:flex;align-items:center;justify-content:center;
}
.spray-badge svg{width:24px;height:24px;}
.spray-badge svg rect,
.spray-badge svg path{fill:none;stroke:#3d8f2f;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.spray-badge svg .mist{fill:var(--green);stroke:none;}
.spray-badge .sb-lbl{
  font:700 9.5px/1.25 var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:#5d5568;text-align:left;
}
.sec{position:relative;}

/* the copyright line under the running footer */
.foot{flex-wrap:wrap;}
.foot .f-copy{
  flex:0 0 100%;order:9;text-align:center;
  font:400 7.8px/1.25 var(--body);letter-spacing:.02em;text-transform:none;
  color:#a9a2b2;padding-top:3px;
}
.back .back-notice{
  font:400 9px/1.5 var(--body);color:rgba(255,255,255,.65);
  margin:26px auto 0;max-width:5.4in;text-align:center;
}

/* the Reset Activity band: clouds carrying the breath copy and the lettering art */
.cloudband{position:relative;overflow:hidden;border-radius:20px;}
.cloudband .cb-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cloudband .cb-tint{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(60,40,90,.22) 0%, rgba(60,40,90,.34) 100%);
}
.cloudband .cb-script{
  position:absolute;left:38px;top:50%;transform:translateY(-50%);
  font-family:var(--script);font-size:44px;line-height:1.06;color:#fff;
  text-shadow:0 2px 12px rgba(40,25,60,.60), 0 1px 3px rgba(40,25,60,.45);
}
.cloudband .cb-art{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  height:2.20in;width:auto;
  filter:drop-shadow(0 2px 10px rgba(40,25,60,.40));
}

/* the email pill on the feature page */
.tag-pill.mail{text-decoration:none;}

/* the giveaway entry strip */
.entrystrip{
  border-radius:14px;padding:10px 18px;margin-top:12px;
  background:color-mix(in srgb, var(--yellow) 32%, #fff);
  font:700 12px/1.4 var(--body);color:#3d3746;text-align:center;
}

/* page 10 · the tag row and the polaroid strip */
.tagrow{
  display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:10px;
}
.tagrow .eb{font-size:22px;color:var(--pink);margin:0;}
.tag-pill.handle{
  background:#fff;color:#2f2938;text-decoration:none;
  box-shadow:0 0 0 1.6px var(--pink), 0 2px 8px rgba(23,19,29,.10);
}

.polrow{display:flex;gap:9px;margin-top:10px;justify-content:space-between;}
.polaroid.nocap{
  flex:0 0 auto;width:1.20in;padding:6px 6px 8px;border-radius:5px;
  box-shadow:0 7px 18px rgba(23,19,29,.22);
}
.polaroid.nocap img{width:100%;height:auto;border-radius:2px;}
.polrow .polaroid:nth-child(1){transform:rotate(-2.2deg);}
.polrow .polaroid:nth-child(2){transform:rotate(1.6deg);}
.polrow .polaroid:nth-child(3){transform:rotate(-1.4deg);}
.polrow .polaroid:nth-child(4){transform:rotate(2deg);}

/* page 10 · a tighter capture grid, and three polaroids centred */
.tight-grid .feat{padding:12px 14px;}
.polrow{justify-content:center;gap:.18in;}
.polaroid.nocap{width:1.48in;padding:7px 7px 9px;}
.polrow .polaroid:nth-child(3){transform:rotate(2deg);}

/* Fit the print layout to phones while keeping the downloadable PDF unchanged. */
@media screen and (max-width: 840px) { .sheet { zoom: calc((100vw - 24px) / 816px); padding-top: 140px; } }
