/*
Theme Name: Sagi Yaari — Warm Integrative Counselling
Theme URI: https://sagiyaari.co.uk
Author: Sagi Yaari
Description: Warm, creative and welcoming WordPress theme for Sagi Yaari Integrative Counselling.
Version: 2.0
Text Domain: sagi-yaari
*/
:root{
  --cream:#FFF3E6;
  --paper:#FFFDF9;
  --sand:#E6C09F;
  --terracotta:#B85B46;
  --rose:#D88983;
  --peach:#F2B58F;
  --sage:#7D8B67;
  --forest:#394A40;
  --ink:#39322E;
  --muted:#756B65;
  --line:#E6D0BD;
  --white:#fff;
  --shadow:0 18px 50px rgba(73,53,43,.10);
  --radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.7}
a{color:inherit}
img{max-width:100%;height:auto}
.site{overflow:hidden}
.container{width:min(1160px,calc(100% - 40px));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(251,245,236,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(228,217,204,.8)}
.header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{font-family:Georgia,"Times New Roman",serif;text-decoration:none;font-size:1.45rem;color:var(--forest);letter-spacing:.01em}
.brand span{display:block;font:500 .68rem Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--terracotta);margin-top:-4px}
.nav{display:flex;gap:25px;align-items:center}
.nav a{text-decoration:none;font-size:.92rem;color:var(--ink)}
.nav a:hover{color:var(--terracotta)}
.nav .cta{background:var(--terracotta);color:white;padding:10px 17px;border-radius:999px}
.menu-toggle{display:none;border:0;background:none;font-size:1.5rem;color:var(--forest)}
.hero{padding:86px 0 70px;position:relative}
.hero:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:var(--peach);opacity:.38;right:-180px;top:-100px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center;position:relative}
.kicker{text-transform:uppercase;letter-spacing:.18em;font-size:.76rem;color:var(--terracotta);font-weight:700}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1.15;color:var(--forest)}
h1{font-size:clamp(3rem,6vw,5.3rem);margin:14px 0 22px}
h2{font-size:clamp(2.2rem,4vw,3.5rem);margin:0 0 18px}
h3{font-size:1.65rem;margin:0 0 10px}
.lead{font-size:1.17rem;color:#4e5b56;max-width:650px}
.buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{display:inline-block;text-decoration:none;padding:13px 21px;border-radius:999px;font-weight:650}
.btn-primary{background:var(--terracotta);color:#fff}
.btn-secondary{border:1px solid var(--terracotta);color:var(--terracotta);background:transparent}
.hero-photo{position:relative}
.hero-photo:after{content:"";position:absolute;inset:22px -20px -20px 22px;border:1px solid var(--rose);border-radius:46% 54% 55% 45% / 45% 42% 58% 55%;z-index:-1}
.hero-photo img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:48% 48% 22% 22%;box-shadow:var(--shadow)}
.section{padding:90px 0}
.section.alt{background:var(--paper)}
.section-head{max-width:760px;margin-bottom:42px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--paper);padding:30px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:0 8px 25px rgba(73,53,43,.04)}
.card.accent{background:#F4E3D8}
.card.sage{background:#E9EEE5}
.quote{padding:38px 42px;background:var(--forest);color:white;border-radius:var(--radius);font-family:Georgia,serif;font-size:1.45rem;line-height:1.5}
.quote small{display:block;font-family:Inter,sans-serif;font-size:.8rem;color:#D9E2D8;margin-top:15px}
.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}
.portrait img{border-radius:30px;box-shadow:var(--shadow)}
.list{padding-left:1.1rem}.list li{margin:11px 0}
.page-hero{padding:70px 0 55px;background:linear-gradient(135deg,#F4E4D9 0%,#FBF5EC 62%)}
.page-hero p{max-width:760px;font-size:1.12rem}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.notice{padding:25px 28px;background:#E9EEE5;border-radius:22px}
.contact-box{background:var(--paper);padding:40px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow)}
label{display:block;font-weight:650;margin:16px 0 7px}
input,textarea,select{width:100%;padding:13px 14px;border:1px solid #D8CABC;border-radius:13px;background:#fff;color:var(--ink);font:inherit}
textarea{min-height:150px;resize:vertical}
button.btn{border:0;cursor:pointer;font:inherit}
.footer{background:var(--forest);color:#F6F1E8;padding:55px 0 25px}
.footer a{color:#F6F1E8}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:50px}
.footer small{display:block;margin-top:35px;color:#C9D4CC}
.decor{font-family:Georgia,serif;color:var(--rose);font-size:4rem;line-height:.5}
@media(max-width:820px){
  .nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--cream);padding:20px;flex-direction:column;border-bottom:1px solid var(--line)}
  .nav.open{display:flex}.menu-toggle{display:block}.hero-grid,.split{grid-template-columns:1fr}.hero{padding-top:55px}.hero-photo{max-width:520px;margin:auto}.cards,.info-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}
}

/* Extra warmth — organic editorial treatment */
body{background:
 radial-gradient(circle at 8% 8%,rgba(240,185,151,.24),transparent 24rem),
 radial-gradient(circle at 94% 34%,rgba(213,139,126,.13),transparent 22rem),
 var(--cream);}
.site-header{background:rgba(255,244,232,.94)}
.hero{background:linear-gradient(180deg,rgba(240,185,151,.18),transparent 70%);border-radius:0 0 70px 70px}
.hero:before{background:#F0B997;opacity:.30}
.hero-photo:after{border-color:#D58B7E}
.card{background:rgba(255,251,246,.94);border-color:#E7D3C1}
.card.accent{background:#F6D8C5}
.card.sage{background:#E8EDDF}
.page-hero{background:linear-gradient(135deg,#F6D8C5 0%,#FFF4E8 62%,#F3E5D6 100%)}
.section.alt{background:#FFF9F2}
.quote{background:#3E4A3D;box-shadow:0 18px 45px rgba(62,74,61,.16)}
.btn-primary{background:#B85C45;box-shadow:0 8px 20px rgba(184,92,69,.18)}
.btn-secondary{border-color:#B85C45;color:#A74F3B}
.brand span,.kicker{color:#B85C45}
a:hover{color:#B85C45}
.footer{background:#3E4A3D}
.decor{color:#D58B7E}

/* Creative color system */
:root{
 --coral:#D96F5D;
 --ochre:#D5A04B;
 --plum:#76546A;
 --olive:#71805C;
 --lavender:#B59AAE;
}
body{
 background:
 radial-gradient(circle at 7% 12%,rgba(242,181,143,.28),transparent 23rem),
 radial-gradient(circle at 92% 20%,rgba(213,160,75,.16),transparent 20rem),
 radial-gradient(circle at 78% 78%,rgba(181,154,174,.12),transparent 24rem),
 var(--cream);
}
.hero{
 background:
 radial-gradient(circle at 82% 25%,rgba(217,111,93,.12),transparent 16rem),
 linear-gradient(180deg,rgba(242,181,143,.16),transparent 72%);
}
.hero:before{background:#D88983;opacity:.24}
.hero:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:#D5A04B;opacity:.45;left:4%;bottom:3%;z-index:0}
.hero-grid>*{z-index:1}
.kicker{color:var(--coral)}
.brand span{color:var(--coral)}
h1{letter-spacing:-.025em}
h2{letter-spacing:-.015em}
.btn-primary{background:var(--coral);box-shadow:0 10px 25px rgba(217,111,93,.20)}
.btn-secondary{border-color:var(--coral);color:#A94D3D}
.card{
 transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.card:hover{
 transform:translateY(-5px) rotate(-.25deg);
 box-shadow:0 16px 35px rgba(73,53,43,.10);
 border-color:#DDB9A1;
}
.card.accent{background:#F7D5C2}
.card.sage{background:#E8EDDE}
.card:nth-child(3n){background:#F0E6ED}
.card:nth-child(4n){background:#F6E8C9}
.section:nth-of-type(3) .section-head h2:after{
 content:"";
 display:block;width:65px;height:4px;border-radius:10px;
 background:linear-gradient(90deg,var(--coral),var(--ochre),var(--plum));
 margin-top:17px;
}
.page-hero{
 position:relative;
 background:
 radial-gradient(circle at 86% 20%,rgba(213,160,75,.18),transparent 17rem),
 linear-gradient(135deg,#F7D5C2 0%,#FFF3E6 58%,#EEE1E8 100%);
}
.page-hero:after{
 content:"";position:absolute;width:110px;height:110px;border:18px solid rgba(125,139,103,.18);
 border-radius:50%;right:6%;bottom:-42px;
}
.quote{
 background:linear-gradient(135deg,#394A40 0%,#4E5B48 100%);
 position:relative;overflow:hidden;
}
.quote:after{
 content:"";position:absolute;width:170px;height:170px;border-radius:50%;
 right:-45px;top:-55px;background:rgba(216,137,131,.22);
}
.quote small{color:#F1D5C7}
.contact-box{position:relative}
.contact-box:before{
 content:"";position:absolute;width:70px;height:70px;border-radius:22px;
 background:#D5A04B;opacity:.18;right:-15px;top:-15px;transform:rotate(15deg);
}
input:focus,textarea:focus,select:focus{outline:3px solid rgba(217,111,93,.16);border-color:var(--coral)}
.footer{
 background:linear-gradient(135deg,#394A40 0%,#4B5542 60%,#5D4B56 100%);
}
.decor{color:#D88983}

.color-ribbon{height:5px;background:linear-gradient(90deg,#D96F5D 0%,#F2B58F 25%,#D5A04B 50%,#7D8B67 72%,#76546A 100%);}

/* Brighter, more playful color direction */
:root{
 --sun:#F4B942;
 --tangerine:#EE7B4F;
 --coral-bright:#E96861;
 --pink:#E99AA7;
 --lilac:#B89AD2;
 --aqua:#78BFC0;
 --leaf:#7FA45B;
}
body{
 background:
 radial-gradient(circle at 5% 10%,rgba(244,185,66,.22),transparent 20rem),
 radial-gradient(circle at 96% 25%,rgba(233,154,167,.20),transparent 21rem),
 radial-gradient(circle at 82% 82%,rgba(120,191,192,.15),transparent 23rem),
 var(--cream);
}
.hero{
 background:
 radial-gradient(circle at 88% 18%,rgba(238,123,79,.20),transparent 16rem),
 radial-gradient(circle at 12% 85%,rgba(244,185,66,.13),transparent 14rem),
 linear-gradient(180deg,#FFF0DE,transparent 75%);
}
.hero:before{background:var(--pink);opacity:.25}
.hero:after{background:var(--sun);opacity:.65}
.kicker,.brand span{color:var(--tangerine)}
.btn-primary{background:var(--tangerine);box-shadow:0 10px 25px rgba(238,123,79,.25)}
.btn-secondary{border-color:var(--tangerine);color:#C9573C}
.card:nth-child(3n){background:#F4E7F3}
.card:nth-child(4n){background:#FFF0C9}
.card:nth-child(5n){background:#E4F2EE}
.card.accent{background:#FFE0D2}
.card.sage{background:#E7F0D8}
.card:hover{transform:translateY(-7px) rotate(-.4deg);box-shadow:0 20px 38px rgba(73,53,43,.13)}
.page-hero{
 background:
 radial-gradient(circle at 82% 20%,rgba(244,185,66,.24),transparent 15rem),
 radial-gradient(circle at 15% 80%,rgba(184,154,210,.16),transparent 17rem),
 linear-gradient(135deg,#FFE0D2 0%,#FFF3E6 52%,#F0E6F2 100%);
}
.quote{background:linear-gradient(135deg,#3D5547 0%,#596C4E 100%)}
.quote:after{background:rgba(244,185,66,.30)}
.contact-box:before{background:var(--pink);opacity:.30}
input:focus,textarea:focus,select:focus{outline:3px solid rgba(238,123,79,.17);border-color:var(--tangerine)}
.footer{background:linear-gradient(135deg,#3D5547 0%,#596C4E 55%,#6C526C 100%)}
.color-ribbon{height:7px;background:linear-gradient(90deg,#EE7B4F 0%,#F4B942 22%,#E99AA7 43%,#78BFC0 65%,#7FA45B 82%,#B89AD2 100%)}


/* BACP accreditation mark in the home-page footer */
.footer-contact-row{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;flex-wrap:wrap}
.bacp-mark{background:#fff;border-radius:18px;padding:12px 14px;max-width:300px;box-shadow:0 10px 25px rgba(0,0,0,.08)}
.bacp-mark img{display:block;width:100%;height:auto}
@media (max-width:700px){.footer-contact-row{display:grid;grid-template-columns:1fr}.bacp-mark{max-width:260px}}


/* v1.7 refinements */
.hero-quote{font-family:Georgia,"Times New Roman",serif;font-size:2.15rem;line-height:1.15;font-weight:700;color:#fff;margin:0 0 18px}
.hero-support{font-size:1.12rem;line-height:1.65;color:#F6F1E8;margin:0 0 24px;max-width:720px}
.hero{background:linear-gradient(135deg,#3D5547 0%,#596C4E 100%);color:#fff}
.hero .kicker{color:#F4B942}
.therapy-image{margin:42px 0 0;position:relative}
.therapy-image img{display:block;width:100%;max-height:680px;object-fit:cover;object-position:center 48%;border-radius:34px;box-shadow:var(--shadow)}
@media (max-width:700px){.hero-quote{font-size:1.75rem}.therapy-image img{max-height:520px}}

/* v1.8: restore the warm/light home-page hero palette from v1.6 */
.hero{
  background:linear-gradient(180deg,rgba(240,185,151,.18),transparent 70%);
  border-radius:0 0 70px 70px;
  color:var(--ink);
}
.hero-quote{color:var(--forest)}
.hero-support{color:#4e5b56}