.ccw-root{--ivory:#FAF6EF;--blush:#F3DFDC;--dusty:#D9A5A0;--rose:#B76E79;--forest:#24513B;--ink:#141414;max-width:1060px;margin:0 auto;padding:24px 20px 64px;font-family:Jost,sans-serif;color:var(--ink);background:var(--ivory)}
.ccw-root h1,.ccw-root h2,.ccw-root h3{font-family:"Playfair Display",serif;font-weight:400;color:var(--ink)}
.ccw-root em{font-style:italic;color:var(--rose)}
.ccw-script{font-family:"Alex Brush",cursive;font-size:2rem;color:var(--rose);text-align:center;margin:0 0 6px}
.ccw-hero{text-align:center;padding:24px 0 8px}
.ccw-h1{font-size:clamp(2.6rem,6vw,4.4rem);line-height:1.05;margin:0 0 14px}
.ccw-sub{font-size:1.25rem;line-height:1.5;margin:0 0 26px}
.ccw-hero-img{width:min(560px,92%);border-radius:14px;box-shadow:0 18px 44px rgba(183,110,121,.22)}
.ccw-ask{padding:44px 0 8px}
.ccw-card{background:#fff;border:1.5px solid var(--dusty);border-radius:16px;padding:22px 26px;margin:0 auto 18px;max-width:860px}
.ccw-card h3{font-size:1.45rem;margin:0 0 8px;line-height:1.3}
.ccw-card p{font-size:1.08rem;line-height:1.55;color:#4d423c;margin:0}
.ccw-nod{text-align:center;font-family:"Playfair Display",serif;font-style:italic;color:var(--rose);font-size:1.35rem;margin:22px 0 8px}
.ccw-router{background:var(--blush);border-radius:20px;padding:40px 26px;margin:44px 0;text-align:center}
.ccw-router h2{font-size:2rem;margin:0 0 8px}
.ccw-lede{font-size:1.12rem;margin:0 0 22px}
.ccw-q{background:#fff;border-radius:16px;padding:24px;max-width:760px;margin:0 auto;text-align:left}
.ccw-qnum{font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;color:var(--rose);margin:0 0 6px}
.ccw-q h3{font-size:1.35rem;margin:0 0 16px}
.ccw-opt{display:block;width:100%;text-align:left;background:var(--ivory);border:1.5px solid var(--dusty);border-radius:12px;padding:14px 16px;font-family:Jost,sans-serif;font-size:1.08rem;margin:0 0 10px;cursor:pointer;color:var(--ink)}
.ccw-opt:hover{background:var(--blush)}
.ccw-hidden{display:none!important}
.ccw-result{max-width:760px;margin:0 auto;text-align:center}
.ccw-result-h{font-size:2rem;margin:0 0 10px}
.ccw-next{background:#fff;border-radius:12px;padding:16px 18px;font-size:1.05rem;line-height:1.5}
.ccw-switch{font-size:.98rem;color:#5f544e}
.ccw-switch button{background:none;border:none;color:var(--rose);font:inherit;cursor:pointer;text-decoration:underline;padding:0}
.ccw-btn{display:inline-block;background:var(--rose);color:#141414;font-family:Jost,sans-serif;font-size:1.15rem;border:none;border-radius:999px;padding:15px 38px;cursor:pointer;text-decoration:none;margin-top:14px}
.ccw-btn:hover{background:var(--blush)}
.ccw-how{padding:16px 0}
.ccw-how h2,.ccw-decks h2,.ccw-join h2{text-align:center;font-size:2rem;margin:0 0 18px}
.ccw-wide-img{width:min(680px,100%);display:block;margin:0 auto 26px;border-radius:14px}
.ccw-step{max-width:860px;margin:0 auto 16px}
.ccw-step h3{font-size:1.35rem;margin:0 0 4px}
.ccw-step h3 span{color:var(--rose)}
.ccw-step p{font-size:1.1rem;line-height:1.55;margin:0}
.ccw-story{background:var(--forest);border-radius:20px;padding:42px 30px;margin:44px 0;text-align:center}
.ccw-script-blush{color:var(--blush)}
.ccw-story-text{font-family:"Playfair Display",serif;font-style:italic;color:#fff;font-size:1.3rem;line-height:1.6;max-width:820px;margin:0 auto}
.ccw-deck-row{display:flex;gap:28px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}
.ccw-deck{width:min(300px,86vw);text-align:center}
.ccw-deck img{width:100%;border-radius:10px;box-shadow:0 10px 26px rgba(20,20,20,.14)}
.ccw-deck h3{font-size:1.3rem;margin:12px 0 2px}
.ccw-deck p{margin:0;color:#5f544e;font-size:1.02rem}
.ccw-join{text-align:center;padding:8px 0 0}
.ccw-tiers{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin:6px 0 18px}
.ccw-tier{background:#fff;border:1.5px solid var(--dusty);border-radius:16px;padding:20px 26px;cursor:pointer;font-family:Jost,sans-serif;color:var(--ink);min-width:170px}
.ccw-tier span{display:block;font-size:1.02rem}
.ccw-tier .ccw-amt{font-family:"Playfair Display",serif;font-size:2.1rem;color:var(--rose);margin-bottom:4px}
.ccw-tier-sel{background:var(--blush);border-color:var(--rose);border-width:2.5px}
.ccw-journey-line{font-size:1.1rem;margin:0 0 6px}
.ccw-journey-hint{color:#5f544e;font-size:.95rem}
.ccw-fine{color:#5f544e;font-size:1rem;margin-top:16px}
@media (max-width:640px){.ccw-card{padding:18px}.ccw-router{padding:30px 16px}.ccw-story{padding:32px 20px}}

/* v1.1.0 (Oct 18): fuller story + real-cards peek, from the approved page concept */
.ccw-story-lead{font-family:var(--serif);font-weight:400;font-size:1.7rem;line-height:1.3;color:var(--black);margin:0 0 18px}
.ccw-story .ccw-story-text{margin:0 0 18px}
.ccw-peek{text-align:center;padding:10px 0 6px}
.ccw-peek-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:26px 0 20px}
.ccw-peek-row img{width:100%;height:auto;border-radius:16px;display:block;box-shadow:0 10px 26px rgba(20,20,20,.10)}
@media(max-width:640px){.ccw-peek-row{gap:10px}}

/* v1.1.1 (Oct 18): save-the-number instruction in the join section (her ask) */
.ccw-save-note{max-width:34rem;margin:20px auto 0;font-weight:300;color:var(--ink-soft);font-size:1rem;line-height:1.6}
.ccw-save-note strong{color:var(--rose);font-weight:600}

/* v1.1.2 (Oct 18): DESKTOP WIDTH (her direction from her desk screen).
   The theme's page column is a narrow reading column; break the component
   out to a true wide layout on desktop and give the hero two columns. */
@media (min-width: 1024px) {
  .ccw-root { max-width: 1200px; width: min(1200px, 96vw); margin-left: calc(50% - min(600px, 48vw)); padding: 40px 44px 80px; }
  .ccw-hero { display: grid; grid-template-columns: 1.02fr 0.98fr; column-gap: 54px; align-items: center; text-align: left; padding: 30px 0 20px; }
  .ccw-hero .ccw-script { grid-column: 1; text-align: left; }
  .ccw-hero .ccw-h1 { grid-column: 1; }
  .ccw-hero .ccw-sub { grid-column: 1; font-size: 1.32rem; }
  .ccw-hero .ccw-hero-img { grid-column: 2; grid-row: 1 / 5; width: 100%; }
  .ccw-card { max-width: 1020px; }
  .ccw-q, .ccw-result { max-width: 860px; }
  .ccw-wide-img { width: min(900px, 100%); }
  .ccw-step { max-width: 940px; }
  .ccw-deck { width: min(360px, 40vw); }
}

/* v1.1.4 (Oct 18): hero photo height capped on desktop (her direction:
   the photo ran the full column height and dragged the banner down;
   its bottom needed to come up). Banner-height panel beside the words. */
@media (min-width: 1024px) {
  .ccw-hero .ccw-hero-img { height: 540px; max-height: 540px; object-fit: cover; object-position: center 22%; }
}

/* v1.1.5 (Oct 18): FULL-WIDTH desktop (her follow-up: still reads narrow).
   Every section opens out on desktop: wider root, question cards 3-across,
   how-it-goes steps 3-across, larger decks, wider router and story measure. */
@media (min-width: 1024px) {
  .ccw-root { max-width: 1360px; width: min(1360px, 96vw); margin-left: calc(50% - min(680px, 48vw)); }
  .ccw-ask { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; }
  .ccw-ask .ccw-script { flex: 1 1 100%; }
  .ccw-ask .ccw-card { flex: 1 1 300px; max-width: none; margin: 0; }
  .ccw-ask .ccw-nod { flex: 1 1 100%; }
  .ccw-how { display: flex; flex-wrap: wrap; gap: 24px; }
  .ccw-how h2 { flex: 1 1 100%; }
  .ccw-how .ccw-wide-img { flex: 1 1 100%; }
  .ccw-how .ccw-step { flex: 1 1 280px; max-width: none; margin: 0; }
  .ccw-deck { width: min(430px, 44vw); }
  .ccw-q, .ccw-result { max-width: 920px; }
  .ccw-story-text { max-width: 920px; }
  .ccw-save-note { max-width: 44rem; }
}
