/*
Theme Name:  Calm Clarity Psychology
Theme URI:   https://calmclaritypsychology.com
Description: Child theme of Astra carrying the 2026 Calm Clarity Psychology design. All page layouts live in this theme's templates; no page builder is required.
Author:      Calm Clarity Psychology
Template:    astra
Version:     1.0.3
Text Domain: calm-clarity
*/

  :root{
    --neutral:#EFECEA;
    --paper:#F6F4F2;
    --jade:#3F6B68;
    --jade-deep:#2F5250;
    --jade-tint:#DCE5E2;
    --eggplant:#603446;
    --eggplant-light:#97607C;
    --eggplant-tint:#EDE3E7;
    --grapefruit:#D25F68;
    --grapefruit-deep:#B84C56;
    --ink:#22302F;
    --ink-soft:#5B6B69;
    --rule:#D6D0CC;
    --focus:#5CDAC4;
    --measure:62ch;
  }
  :root:not([data-theme="light"]){ color-scheme: light; }
  *{box-sizing:border-box;margin:0;padding:0}
  html{-webkit-text-size-adjust:100%}
  body{
    font-family:"Figtree","Adelphi PE Variable","Helvetica Neue",Arial,sans-serif;
    font-weight:400;
    color:var(--ink);
    background:var(--neutral);
    line-height:1.6;
    font-size:clamp(1.0rem, 0.95rem + 0.25vw, 1.125rem);
  }
  a{color:var(--jade);text-decoration:none}
  a:hover{color:var(--jade-deep);text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
  :focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}
  img{max-width:100%;display:block}
  .wrap{width:min(1120px, 100% - 3rem);margin-inline:auto}
  .skip{position:absolute;left:-999px;top:0;background:var(--jade);color:#fff;padding:.5rem 1rem}
  .skip:focus{left:1rem;top:1rem;z-index:99}

  /* ---------- Header ---------- */
  header{position:sticky;top:0;z-index:20;background:rgba(239,236,234,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
  .bar{display:flex;align-items:center;justify-content:space-between;gap:2rem;height:80px}
  .logo{display:flex;align-items:center;gap:.75rem;color:var(--jade)}
  .logo:hover{text-decoration:none}
  .logo img{height:40px;width:auto;display:block}
  nav ul{display:flex;gap:2.1rem;list-style:none}
  nav a{color:var(--ink);font-weight:400;font-size:.98rem;padding:.3rem 0;border-bottom:1px solid transparent}
  nav a:hover{text-decoration:none;color:var(--jade);border-bottom-color:var(--jade)}
  nav a[aria-current]{color:var(--jade);border-bottom-color:var(--jade)}
  .menu-btn{display:none;background:none;border:1px solid var(--rule);border-radius:999px;padding:.55rem .9rem;font:inherit;color:var(--ink);cursor:pointer}

  /* ---------- Buttons ---------- */
  .btn{display:inline-flex;align-items:center;gap:.6rem;background:var(--grapefruit);color:#fff;border-radius:999px;padding:.85rem 1.5rem;font-weight:400;line-height:1;transition:background .15s}
  .btn:hover{background:var(--grapefruit-deep);color:#fff;text-decoration:none}
  .btn-quiet{background:transparent;color:var(--eggplant);border:1px solid var(--eggplant)}
  .btn-quiet:hover{background:var(--eggplant);color:#fff}
  .link{color:var(--jade);border-bottom:1px solid var(--jade-tint)}
  .link:hover{text-decoration:none;border-bottom-color:var(--jade)}

  /* ---------- Type ---------- */
  h1,h2,h3{font-weight:300;line-height:1.15;letter-spacing:-.01em}
  h1{font-size:clamp(2.2rem, 1.4rem + 3.4vw, 4.1rem);color:var(--eggplant);max-width:16ch}
  h2{font-size:clamp(1.7rem, 1.2rem + 1.8vw, 2.5rem);color:var(--eggplant)}
  h3{font-size:clamp(1.2rem, 1.05rem + .6vw, 1.5rem);color:var(--jade);font-weight:400}
  p{max-width:var(--measure)}
  .lead{font-size:clamp(1.1rem, 1rem + .5vw, 1.3rem);font-weight:300;color:var(--jade-deep);line-height:1.55}
  .muted{color:var(--ink-soft)}

  section{padding-block:clamp(4rem, 3rem + 4vw, 7.5rem)}

  /* ---------- Hero ---------- */
  .hero{padding-block:clamp(3.5rem, 2rem + 6vw, 8rem) clamp(4rem,3rem+5vw,7rem);position:relative;overflow:hidden}
  .hero .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:3rem;align-items:center}
  .hero-copy p{margin-top:1.5rem}
  .hero-copy .lead{margin-top:1.75rem}
  .hero-actions{margin-top:2.25rem;display:flex;gap:1.25rem;align-items:center;flex-wrap:wrap}
  .hero-actions .muted{font-size:.95rem;color:var(--eggplant-light)}
  .photo{aspect-ratio:4/5;border-radius:2px;object-fit:cover;height:auto}
  .hero-art{width:100%;max-width:440px;justify-self:end}
  .photo{width:100%}

  /* ---------- About ---------- */
  .about{background:var(--paper);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
  .about .wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start}
  .portrait{aspect-ratio:4/5;border-radius:2px;object-fit:cover;width:100%;height:auto}
  .about h2{margin-bottom:1.25rem}
  .about p + p{margin-top:1rem}
  .about .link{display:inline-block;margin-top:1.5rem;color:var(--eggplant);border-bottom-color:var(--eggplant-light)}
  .about .link:hover{color:var(--eggplant);border-bottom-color:var(--eggplant)}

  /* ---------- Areas of support ---------- */
  .areas h2{max-width:20ch}
  .areas .intro{margin-top:1.25rem}
  .area-list{list-style:none;margin-top:3rem;border-top:1px solid var(--eggplant-light)}
  .area{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:1.5rem 3rem;padding:2.25rem 0;border-bottom:1px solid var(--rule);align-items:start}
  .area p{margin-top:0}
  .area h3{padding-top:.1em}
  .areas .btn-quiet{margin-top:2.5rem}

  /* ---------- Practical ---------- */
  .practical{background:var(--jade-tint);border-top:1px solid var(--rule)}
  .practical .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5rem}
  .fact{border-left:2px solid var(--eggplant-light);padding-left:1.25rem}
  .fact strong{display:block;font-weight:400;font-size:1.15rem;color:var(--eggplant);margin-bottom:.35rem}
  .fact p{font-size:.98rem;color:var(--ink)}

  /* ---------- Enquiry ---------- */
  .enquiry{background:var(--jade);color:#fff}
  .enquiry .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:3rem;align-items:end}
  .enquiry h2{color:#fff}
  .enquiry p{margin-top:1.25rem;color:rgba(255,255,255,.86)}
  .enquiry .contact{justify-self:end;text-align:right}
  .enquiry .contact a.mail{color:#fff;font-size:1.1rem;border-bottom:1px solid rgba(255,255,255,.45)}
  .enquiry .contact a.mail:hover{text-decoration:none;border-bottom-color:#fff}
  .enquiry .contact .btn{background:var(--neutral);color:var(--jade-deep)}
  .enquiry .contact .btn:hover{background:#fff;color:var(--jade-deep)}
  .enquiry .contact small{display:block;margin-top:1.1rem;color:rgba(255,255,255,.8);font-size:.95rem;line-height:1.6}

  /* ---------- Footer ---------- */
  footer{padding:3.5rem 0 2.5rem;color:var(--ink-soft);font-size:.95rem}
  .foot{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,4fr);gap:2.5rem;align-items:start}
  .foot .logo img{height:36px}
  .foot ul{list-style:none;display:grid;gap:.5rem}
  .foot a{color:var(--ink)}
  .foot a:hover{color:var(--jade)}
  .foot .addr{line-height:1.7}
  .legal{margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--eggplant-light);color:var(--eggplant);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.88rem}

  /* ---------- Responsive ---------- */
  @media (max-width: 900px){
    .hero .wrap,.about .wrap,.enquiry .wrap{grid-template-columns:1fr}
    .hero .wrap{gap:2.5rem}
    .hero-art{order:-1;max-width:360px;justify-self:start}
    .portrait{max-width:360px}
    .practical .wrap{grid-template-columns:1fr;gap:1.75rem}
    .enquiry .contact{justify-self:start;text-align:left}
    .foot{grid-template-columns:1fr 1fr}
    .foot > :first-child{grid-column:1/-1}
  }
  @media (max-width: 720px){
    .wrap{width:min(1120px, 100% - 2.5rem)}
    nav{display:none;position:absolute;left:0;right:0;top:80px;background:var(--neutral);border-bottom:1px solid var(--rule);padding:1rem 1.25rem 1.5rem}
    nav.open{display:block}
    nav ul{flex-direction:column;gap:.25rem}
    nav a{display:block;padding:.75rem 0;font-size:1.1rem;border-bottom:1px solid var(--rule)}
    nav a[aria-current]{border-bottom-color:var(--rule)}
    .menu-btn{display:inline-block}
    .area{grid-template-columns:1fr;gap:.75rem;padding:1.75rem 0}
    .foot{grid-template-columns:1fr}
  }

  /* ---------- Inner pages ---------- */
  .page-head{padding-block:clamp(3.5rem,2rem + 5vw,6.5rem) clamp(2.5rem,2rem + 2vw,4rem)}
  .page-head h1{max-width:20ch}
  .page-head .lead{margin-top:1.5rem;max-width:58ch}
  .page-head .note{margin-top:1.5rem;display:inline-block;color:var(--jade-deep);border-left:2px solid var(--eggplant-light);padding-left:1rem;font-size:.98rem}
  .prose h2{margin-top:clamp(3rem,2rem + 3vw,5rem);margin-bottom:1.25rem}
  .prose h2:first-child{margin-top:0}
  .prose h3{margin-top:2.25rem;margin-bottom:.6rem}
  .prose p + p,.prose ul + p,.prose ol + p{margin-top:1rem}
  .prose ul{margin:1rem 0 0 1.1rem;max-width:var(--measure)}
  .prose li{margin:.35rem 0}
  .prose li::marker{color:var(--eggplant-light)}
  .prose ul.area-list{max-width:none;margin:2.5rem 0 0}
  .prose .area h3{margin-top:0}
  .prose .area p + p{margin-top:.9rem}
  .prose .area ul{margin:.9rem 0 0 1.1rem}
  .prose strong{font-weight:500}
  .split{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:clamp(2rem,5vw,5rem);align-items:start}
  .split .aside{position:sticky;top:104px}
  .split .aside img{aspect-ratio:4/5;object-fit:cover;width:100%;max-width:300px;border-radius:2px}
  .split .aside .quals{max-width:300px}
  .quals{list-style:none;margin:1rem 0 0!important;border-top:1px solid var(--rule)}
  .quals li{padding:.85rem 0;border-bottom:1px solid var(--rule);margin:0!important}
  .band{background:var(--paper);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
  .band-jade{background:var(--jade-tint);border-top:1px solid var(--rule)}
  .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,4vw,4rem)}
  .steps{list-style:none;counter-reset:s;margin:2rem 0 0!important;max-width:none!important}
  .steps li{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:1rem;padding:1.25rem 0;border-top:1px solid var(--rule);margin:0!important}
  .steps li:last-child{border-bottom:1px solid var(--rule)}
  .steps li::before{counter-increment:s;content:counter(s,decimal-leading-zero);font-weight:300;font-size:1.4rem;color:var(--eggplant);line-height:1.2}
  .fee{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;padding:1.1rem 0;border-top:1px solid var(--rule);align-items:baseline}
  .fee:last-of-type{border-bottom:1px solid var(--rule)}
  .fee b{font-weight:400;color:var(--eggplant);font-size:1.15rem;white-space:nowrap}
  .fee span{color:var(--ink-soft);font-size:.98rem}
  /* FAQ accordion */
  .faq{border-top:1px solid var(--eggplant-light);max-width:820px}
  .faq details{border-bottom:1px solid var(--rule)}
  .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.4rem 0;font-size:clamp(1.1rem,1rem + .4vw,1.3rem);font-weight:400;color:var(--jade-deep)}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"+";flex:none;font-weight:300;font-size:1.6rem;line-height:1;color:var(--eggplant);transition:transform .2s}
  .faq details[open] summary::after{transform:rotate(45deg)}
  .faq summary:hover{color:var(--jade)}
  .faq .a{padding:0 0 1.6rem;max-width:62ch}
  .faq .a p + p{margin-top:.8rem}
  /* Contact */
  .contact-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(2rem,5vw,5rem);align-items:start}
  .email-big{display:inline-block;margin-top:1.5rem;font-size:clamp(1.15rem,1rem + .8vw,1.6rem);font-weight:300;color:var(--eggplant);border-bottom:1px solid var(--eggplant-light);word-break:break-all}
  .email-big:hover{color:var(--eggplant);border-bottom-color:var(--eggplant);text-decoration:none}
  .where{border-left:2px solid var(--eggplant-light);padding-left:1.25rem;margin-top:2.5rem}
  .where strong{display:block;font-weight:400;color:var(--eggplant);font-size:1.15rem;margin-bottom:.35rem}
  .crisis{background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:clamp(1.5rem,1rem + 2vw,2.5rem)}
  .crisis h2{font-size:1.35rem;margin-bottom:.75rem}
  .crisis ul{list-style:none;margin:1.25rem 0 0!important;border-top:1px solid var(--rule)}
  .crisis li{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--rule);margin:0!important}
  .crisis li b{font-weight:400;color:var(--jade-deep);white-space:nowrap}
  @media (max-width:900px){
    .split,.two,.contact-grid{grid-template-columns:1fr}
    .split .aside{position:static;max-width:260px}
  }

  /* WordPress admin bar offset */
  body.admin-bar header{top:32px}
  @media (max-width:782px){ body.admin-bar header{top:46px} }
