/* =============================================================
   confidence-hypnotherapy.css
   Page: Confidence Hypnotherapy (educational)
   Extends base.css — all custom classes namespaced "ch-".
   Author: Creaa Designs | https://www.creaadesigns.com
   ============================================================= */

.ch-accent{color:var(--champagne-soft);font-style:italic}

/* =============================================================
   1. HERO
   ============================================================= */
.ch-hero{position:relative;overflow:hidden;padding-block:clamp(140px,17vw,220px) clamp(70px,9vw,120px);
  background:linear-gradient(160deg,#0f1c2c 0%,#16263A 50%,#22384F 100%)}
.ch-hero-inner{position:relative;z-index:2;max-width:920px;margin-inline:auto;text-align:center}
.ch-hero h1{margin-top:18px;color:#fff}
.ch-hero .lead{margin:22px auto 0;color:rgba(234,240,244,.86)}
.ch-hero-actions{display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:center;margin-top:34px}
.ch-hero-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:42px}
.ch-hero-chips li{font-size:.78rem;font-weight:600;letter-spacing:.04em;padding:.5em 1.05em;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.06);border:1px solid rgba(201,162,75,.32);color:#e7d9b6}

.ch-hero-orb{position:absolute;border-radius:50%;filter:blur(8px);pointer-events:none;z-index:1}
.ch-hero-orb.o1{width:48vmax;height:48vmax;top:-22%;left:-14%;
  background:radial-gradient(circle,rgba(201,162,75,.16),transparent 62%);animation:ch-float 20s ease-in-out infinite}
.ch-hero-orb.o2{width:38vmax;height:38vmax;bottom:-26%;right:-12%;
  background:radial-gradient(circle,rgba(110,139,163,.22),transparent 62%);animation:ch-float 26s ease-in-out infinite reverse}
@keyframes ch-float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(3%,-4%) scale(1.07)}}
.ch-hero-grid-lines{position:absolute;inset:0;z-index:1;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:64px 64px;mask-image:radial-gradient(circle at 50% 35%,#000,transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 50% 35%,#000,transparent 72%)}
@media (prefers-reduced-motion:reduce){.ch-hero-orb{animation:none}}

/* =============================================================
   2. WHAT IS
   ============================================================= */
.ch-what-grid{display:grid;grid-template-columns:0.82fr 1.18fr;gap:clamp(34px,5vw,80px);align-items:center}
.ch-what-figure{max-width:420px;width:100%;aspect-ratio:731/1000;justify-self:center}
.ch-what-figure img{height:100%;object-position:top center}
.ch-what-cap{position:absolute;left:14px;bottom:14px;right:14px;display:flex;align-items:center;gap:8px;
  background:rgba(15,28,44,.66);backdrop-filter:blur(8px);color:#fff;font-size:.82rem;font-weight:500;
  padding:.7em 1em;border-radius:14px}
.ch-dot{width:8px;height:8px;border-radius:50%;background:var(--champagne-soft);flex:none;box-shadow:0 0 0 4px rgba(201,162,75,.22)}
.ch-what-copy h2{margin-top:16px}
.ch-what-copy p{margin-top:18px}
.ch-what-points{margin-top:26px;display:grid;gap:14px}
.ch-what-points li{display:flex;align-items:flex-start;gap:14px;font-weight:500;color:var(--ink)}
.ch-tick{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  background:rgba(201,162,75,.14);color:#9a7825}
.ch-tick svg{width:16px;height:16px}

/* =============================================================
   3. SUBCONSCIOUS / ICEBERG
   ============================================================= */
.ch-sub .lead,.ch-sub .section-head p{color:rgba(234,240,244,.82)}
.ch-iceberg-wrap{display:grid;grid-template-columns:0.9fr 1.1fr;gap:clamp(34px,5vw,72px);align-items:center}
.ch-iceberg{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(255,255,255,.1);
  box-shadow:var(--shadow-lg)}
.ch-ice-top{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));padding:clamp(26px,4vw,42px)}
.ch-ice-bottom{background:linear-gradient(180deg,rgba(34,56,79,.55),rgba(15,28,44,.85));padding:clamp(30px,4.5vw,52px)}
.ch-ice-label{display:inline-block;font-family:var(--font-body);font-weight:700;letter-spacing:.04em;
  font-size:.74rem;text-transform:uppercase;color:var(--champagne-soft);margin-bottom:10px}
.ch-iceberg p{color:rgba(234,240,244,.84);font-size:.98rem;max-width:46ch}
.ch-ice-line{position:relative;height:2px;background:linear-gradient(90deg,transparent,var(--champagne),transparent)}
.ch-ice-line span{position:absolute;right:16px;top:-9px;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(201,162,75,.7);background:#16263A;padding:0 8px}
.ch-sub-notes{display:grid;gap:18px}
.ch-sub-note{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);
  padding:clamp(20px,2.6vw,28px);transition:transform .5s var(--ease-out),background .4s}
.ch-sub-note:hover{transform:translateY(-5px);background:rgba(255,255,255,.08)}
.ch-sub-note h4{color:#fff;margin-bottom:6px}
.ch-sub-note p{color:rgba(234,240,244,.78);font-size:.96rem}
.ch-sub-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;margin-bottom:14px;
  background:rgba(201,162,75,.16);color:var(--champagne-soft)}
.ch-sub-ic svg{width:22px;height:22px}

/* =============================================================
   4 & 5. FEATURE BLOCKS
   ============================================================= */
.ch-feature-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(34px,5vw,80px);align-items:center}
.ch-feature-grid.ch-reverse .ch-feature-copy{order:2}
.ch-step-tag{display:inline-block;font-family:var(--font-body);font-weight:700;letter-spacing:.16em;
  font-size:.72rem;text-transform:uppercase;color:var(--champagne);margin-bottom:16px}
.ch-feature-copy h2{margin-bottom:18px}
.ch-feature-copy p+p{margin-top:14px}
.ch-pillbar{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.ch-pill{font-size:.8rem;font-weight:600;padding:.5em 1.05em;border-radius:var(--radius-pill);
  background:rgba(201,162,75,.12);color:#9a7825}

/* 4 — doubt before/after */
.ch-feature-visual{display:grid;gap:16px;justify-items:center}
.ch-doubt-card{width:100%;border-radius:var(--radius);padding:clamp(22px,3vw,30px);box-shadow:var(--shadow-sm)}
.ch-doubt-card p{font-family:var(--font-display);font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.3}
.ch-doubt-tag{display:inline-block;font-family:var(--font-body);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  font-weight:700;margin-bottom:12px}
.ch-doubt-old{background:#fff;border:1px solid rgba(22,38,58,.08)}
.ch-doubt-old .ch-doubt-tag{color:var(--warm-grey)}
.ch-doubt-old p{color:var(--ink-soft)}
.ch-doubt-new{background:linear-gradient(135deg,#16263A,#22384F);color:#fff}
.ch-doubt-new .ch-doubt-tag{color:var(--champagne-soft)}
.ch-doubt-new p{color:#fff}
.ch-doubt-arrow{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--champagne),var(--champagne-soft));color:#1c1304;box-shadow:0 14px 30px -14px rgba(201,162,75,.7)}
.ch-doubt-arrow svg{width:22px;height:22px}

/* 5 — esteem bars + quote */
.ch-esteem-bars{display:flex;align-items:flex-end;gap:clamp(12px,2.4vw,26px);margin-top:34px;height:150px}
.ch-bar{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;height:100%;justify-content:flex-end}
.ch-bar span{display:block;width:100%;max-width:54px;height:var(--h);border-radius:10px 10px 4px 4px;
  background:linear-gradient(180deg,var(--champagne-soft),var(--champagne));box-shadow:var(--shadow-sm)}
.ch-bar b{font-family:var(--font-body);font-size:.72rem;font-weight:600;color:var(--ink-soft);letter-spacing:.02em}
.ch-esteem-quote{position:relative;background:#fff;border-radius:var(--radius-lg);padding:clamp(34px,5vw,56px);
  box-shadow:var(--shadow);border:1px solid rgba(22,38,58,.05);align-items:flex-start;justify-items:flex-start}
.ch-quote-mark{font-family:var(--font-display);font-size:5rem;line-height:.6;color:var(--gold-line)}
.ch-esteem-quote blockquote{font-family:var(--font-display);font-size:clamp(1.4rem,2.5vw,2rem);line-height:1.25;
  color:var(--heading);margin-top:8px}
.ch-quote-by{margin-top:20px;font-size:.9rem;color:var(--warm-grey)}

/* =============================================================
   6. POSITIVE SELF-IMAGE PANEL
   ============================================================= */
.ch-image-panel{background:linear-gradient(180deg,var(--warm-white),var(--ivory))}
.ch-image-card{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(30px,4vw,60px);align-items:center;
  border-radius:var(--radius-lg);padding:clamp(34px,5vw,72px);box-shadow:var(--shadow)}
.ch-image-card-text h2{margin-top:14px}
.ch-image-card-text p{margin-top:18px}
.ch-image-card-visual{position:relative;display:grid;place-items:center;min-height:220px}
.ch-portrait-ring{position:absolute;width:170px;height:170px;border-radius:50%;border:1px solid var(--gold-line);animation:ch-spin 24s linear infinite}
.ch-portrait-ring.r2{width:230px;height:230px;border-style:dashed;border-color:rgba(201,162,75,.3);animation-duration:36s;animation-direction:reverse}
@keyframes ch-spin{to{transform:rotate(360deg)}}
.ch-portrait-core{width:108px;height:108px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 30% 25%,var(--champagne-soft),var(--champagne) 60%,#a07e2f);color:#fff;
  box-shadow:0 22px 46px -18px rgba(201,162,75,.7)}
.ch-portrait-core svg{width:48px;height:48px}
@media (prefers-reduced-motion:reduce){.ch-portrait-ring{animation:none}}

/* =============================================================
   7. EMOTIONAL REPROGRAMMING
   ============================================================= */
.ch-reprog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,28px)}
.ch-reprog-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);
  padding:clamp(24px,3vw,32px);transition:transform .5s var(--ease-out),background .4s}
.ch-reprog-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.1)}
.ch-reprog-card h4{color:#fff;margin-bottom:8px}
.ch-reprog-card p{color:#cfe0d4;font-size:.95rem}
.ch-reprog-ic{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;margin-bottom:16px;
  background:rgba(201,162,75,.18);color:var(--champagne-soft)}
.ch-reprog-ic svg{width:24px;height:24px}

/* =============================================================
   8. VISUALIZATION
   ============================================================= */
.ch-visual-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(34px,5vw,80px);align-items:center}
.ch-visual-figure{max-width:380px;width:100%;aspect-ratio:614/980;justify-self:center}
.ch-visual-figure img{height:100%;object-position:top center}
.ch-visual-cap{position:absolute;left:14px;bottom:14px;right:14px;background:rgba(15,28,44,.66);backdrop-filter:blur(8px);
  color:#fff;font-size:.82rem;padding:.7em 1em;border-radius:14px;text-align:center}
.ch-visual-copy h2{margin-top:16px;margin-bottom:18px}
.ch-vis-list{margin-top:28px;display:grid;gap:16px;counter-reset:none}
.ch-vis-list li{display:flex;align-items:flex-start;gap:16px}
.ch-vis-n{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-display);
  font-weight:600;color:#1c1304;background:linear-gradient(135deg,var(--champagne-soft),var(--champagne))}
.ch-vis-list b{display:block;color:var(--heading);font-size:1.02rem}
.ch-vis-list span{display:block;color:var(--text-soft);font-size:.95rem}

/* =============================================================
   9. PROCESS STEPS
   ============================================================= */
.ch-proc-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(16px,2vw,24px);counter-reset:none}
.ch-proc-step{position:relative;background:#fff;border-radius:var(--radius);padding:clamp(24px,2.8vw,32px) clamp(20px,2.4vw,26px);
  box-shadow:var(--shadow-sm);border:1px solid rgba(22,38,58,.05);transition:transform .5s var(--ease-out),box-shadow .5s}
.ch-proc-step:hover{transform:translateY(-7px);box-shadow:var(--shadow)}
.ch-proc-step::after{content:"";position:absolute;top:50%;right:-12px;width:14px;height:1px;background:var(--gold-line)}
.ch-proc-step:last-child::after{display:none}
.ch-proc-num{font-family:var(--font-display);font-size:2.1rem;font-weight:600;color:var(--champagne);
  display:block;line-height:1;opacity:.9}
.ch-proc-step h4{margin:14px 0 8px}
.ch-proc-step p{font-size:.92rem;color:var(--text-soft)}

/* =============================================================
   10. OUTCOMES
   ============================================================= */
.ch-out-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 30px}
.ch-out-item{display:flex;align-items:center;gap:16px;padding:20px 22px;border-radius:var(--radius);
  background:var(--surface);border:1px solid rgba(22,38,58,.05);box-shadow:var(--shadow-sm);font-weight:500;
  transition:transform .4s var(--ease-out),border-color .4s}
.ch-out-item:hover{transform:translateX(5px);border-color:var(--gold-line)}
.ch-out-tick{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--champagne),var(--champagne-soft));color:#1c1304}
.ch-out-tick svg{width:17px;height:17px}

/* =============================================================
   11. WHO CAN BENEFIT
   ============================================================= */
.ch-ben-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,28px)}
.ch-ben-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);
  padding:clamp(26px,3vw,34px);transition:transform .5s var(--ease-out),background .4s}
.ch-ben-card:hover{transform:translateY(-7px);background:rgba(255,255,255,.09)}
.ch-ben-card h4{color:#fff;margin-bottom:8px}
.ch-ben-card p{color:rgba(234,240,244,.78);font-size:.94rem}
.ch-ben-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;margin-bottom:18px;
  background:rgba(201,162,75,.16);color:var(--champagne-soft)}
.ch-ben-ic svg{width:24px;height:24px}

/* =============================================================
   12. SESSION EXPECTATIONS
   ============================================================= */
.ch-expect-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,72px);align-items:center}
.ch-expect-copy h2{margin-top:16px;margin-bottom:18px}
.ch-expect-copy p+p{margin-top:14px}
.ch-expect-list{display:grid;gap:16px}
.ch-expect-item{display:flex;align-items:center;gap:18px;background:var(--ivory);border-radius:var(--radius);
  padding:20px 24px;border:1px solid rgba(22,38,58,.05);transition:transform .4s var(--ease-out)}
.ch-expect-item:hover{transform:translateX(5px)}
.ch-expect-item b{display:block;color:var(--heading);font-size:1.02rem;font-family:var(--font-display)}
.ch-expect-item span{display:block;color:var(--text-soft);font-size:.93rem}
.ch-exp-ic{flex:none;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;
  background:#fff;color:var(--champagne);box-shadow:var(--shadow-sm)}
.ch-exp-ic svg{width:24px;height:24px}

/* =============================================================
   13. LONG-TERM
   ============================================================= */
.ch-longterm-inner{max-width:880px;margin-inline:auto;text-align:center}
.ch-longterm-inner h2{margin-top:14px}
.ch-longterm-inner>p{margin:20px auto 0}
.ch-longterm-row{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,30px);margin-top:clamp(36px,5vw,56px);text-align:left}
.ch-long-stat{background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.7);border-radius:var(--radius);
  padding:clamp(24px,3vw,32px)}
.ch-long-stat b{display:block;font-family:var(--font-display);font-size:1.5rem;color:var(--champagne);margin-bottom:8px}
.ch-long-stat span{color:var(--ink-soft);font-size:.95rem}

/* =============================================================
   14. FAQ (uses base .acc; navy background handled by base)
   ============================================================= */
.ch-faq .acc-body p{color:rgba(234,240,244,.8)}

/* =============================================================
   15. CTA
   ============================================================= */
.ch-cta{background:linear-gradient(160deg,#0f1c2c,#16263A 55%,#2C4A3B);position:relative;overflow:hidden}
.ch-cta::before{content:"";position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:80vmax;height:80vmax;
  background:radial-gradient(circle,rgba(201,162,75,.14),transparent 60%);pointer-events:none}
.ch-cta-inner{position:relative;z-index:2;max-width:760px;margin-inline:auto;text-align:center}
.ch-cta-inner h2{color:#fff;margin-top:18px}
.ch-cta-inner p{color:rgba(234,240,244,.84);margin:18px auto 0}
.ch-cta-actions{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin-top:36px}

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width:1024px){
  .ch-reprog-grid,.ch-ben-grid{grid-template-columns:repeat(2,1fr)}
  .ch-proc-steps{grid-template-columns:repeat(2,1fr)}
  .ch-proc-step::after{display:none}
}
@media (max-width:900px){
  .ch-what-grid,.ch-iceberg-wrap,.ch-feature-grid,.ch-visual-grid,.ch-expect-grid,.ch-image-card{grid-template-columns:1fr}
  .ch-feature-grid.ch-reverse .ch-feature-copy{order:0}
  .ch-image-card-visual{order:-1;min-height:200px}
  .ch-what-figure,.ch-visual-figure{max-width:380px}
  .ch-longterm-row{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ch-reprog-grid,.ch-ben-grid,.ch-proc-steps,.ch-out-grid{grid-template-columns:1fr}
  .ch-hero-chips{gap:8px}
  .ch-esteem-bars{height:130px}
  .ch-cta-actions,.ch-hero-actions{flex-direction:column;align-items:stretch}
  .ch-cta-actions .btn,.ch-hero-actions .btn{width:100%}
}
@media (max-width:380px){
  .ch-what-cap,.ch-visual-cap{font-size:.74rem}
}