:root{--yellow:#fee76c;--teal:#41c2c8;--purple:#c3a0fc;--green:#9dd5a6;--pink:#fbd89b;--orange:#ff9c13;--grey:#7f7b66;--ink:#444137;--cream:#fffef3;--white:#fff;--shadow:0 18px 45px rgba(68,65,55,.14);--radius:28px;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--grey);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.65;font-size:16px}img{max-width:100%;display:block}a{color:inherit}.skip-link{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 12px;z-index:999}.skip-link:focus{left:8px}.serif,h1,h2{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);font-weight:800;line-height:.98}h1{font-size:clamp(3rem,7.2vw,6.4rem);margin:0 0 22px;letter-spacing:-.06em}h2{font-size:clamp(2.1rem,4.5vw,3.9rem);margin:0 0 22px;letter-spacing:-.055em}h3{color:var(--ink);font-size:1.16rem;margin:0 0 10px}.lead{font-size:1.2rem;max-width:760px}.small{font-size:.95rem}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:800;color:var(--orange);margin:0 0 14px}.container{max-width:var(--max);margin:0 auto;padding:0 28px}.center{text-align:center}.site-header{position:fixed;left:0;right:0;top:0;z-index:50;transition:background .35s,box-shadow .35s,color .35s}.site-header.scrolled{background:rgba(254,231,108,.96);box-shadow:0 8px 28px rgba(68,65,55,.12);backdrop-filter:blur(14px)}.nav-wrap{height:96px;max-width:1380px;margin:auto;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;color:#fff;display:flex;align-items:center;gap:14px;min-width:225px}.brand-mark{width:52px;height:52px;display:block;object-fit:contain;filter:brightness(0) invert(1);opacity:.96;transition:filter .35s,opacity .35s}.brand-words{display:flex;flex-direction:column;align-items:flex-start;line-height:1}.brand-title{font-weight:800;letter-spacing:.18em;font-size:1.55rem;line-height:.95}.brand-sub{display:block;margin-top:9px;font-size:.68rem;font-weight:800;letter-spacing:.24em;white-space:nowrap}.site-header.scrolled .brand{color:var(--grey)}.site-header.scrolled .brand-mark{filter:none}.site-nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(8px,1.1vw,18px);flex-wrap:nowrap}.site-nav a{color:#fff;text-decoration:none;font-size:.76rem;text-transform:uppercase;font-weight:900;letter-spacing:.055em;position:relative;text-align:center;line-height:1.15;white-space:nowrap}.site-nav a:not(.btn)::after{content:"";position:absolute;left:0;right:100%;bottom:-9px;height:3px;background:var(--yellow);transition:right .25s}.site-nav a.active::after,.site-nav a:hover::after{right:0}.site-header.scrolled .site-nav a{color:var(--grey)}.site-header.scrolled .site-nav a:not(.btn)::after{background:var(--teal)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;background:var(--yellow);color:var(--ink)!important;border:none;border-radius:8px;padding:14px 20px;text-transform:uppercase;text-decoration:none;font-weight:900;letter-spacing:.08em;box-shadow:0 10px 22px rgba(68,65,55,.13);transition:transform .2s,background .2s,color .2s}.btn:hover{transform:translateY(-2px);background:var(--orange);color:#fff!important}.btn.secondary,.site-header.scrolled .btn{background:var(--teal);color:#fff!important}.btn.secondary:hover,.site-header.scrolled .btn:hover{background:var(--orange)}.menu-toggle{display:none}.hero{min-height:740px;background:linear-gradient(90deg,rgba(20,25,30,.72),rgba(20,25,30,.18)),url('../assets/city-scape-portrait.jpg') center right/cover no-repeat;display:flex;align-items:center;position:relative;color:#fff;overflow:hidden}.hero:after{content:"";position:absolute;left:-5%;right:-5%;bottom:-65px;height:170px;background:var(--teal);border-radius:50% 50% 0 0/55% 55% 0 0}.hero-inner{position:relative;z-index:2;max-width:900px;margin-left:clamp(28px,8vw,120px);padding-top:90px}.hero h1,.hero h2{color:#fff}.hero h1 span{color:var(--yellow)}.hero p{font-size:1.35rem;max-width:560px;margin:0 0 28px}.quick-values{position:relative;background:var(--teal);color:#fff;padding:54px 0 60px}.quick-values .inner{max-width:var(--max);margin:auto;padding:0 28px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.value{text-align:center;padding:20px 24px;border-right:1px solid rgba(255,255,255,.42)}.value:last-child{border-right:0}.icon{font-size:2.8rem;line-height:1;color:var(--yellow)}.value h3{color:#fff;font-size:1.35rem;font-weight:800;letter-spacing:-.03em}.section{padding:92px 0}.section.alt{background:#fffaf0}.split{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center}.photo-card{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#fff}.photo-card img{width:100%;height:100%;object-fit:cover}.ticks{list-style:none;padding:0;margin:24px 0}.ticks li{margin:8px 0;padding-left:30px;position:relative}.ticks li:before{content:"✓";position:absolute;left:0;top:0;background:var(--teal);color:#fff;border-radius:50%;width:21px;height:21px;line-height:21px;text-align:center;font-size:.8rem;font-weight:900}.testimonial-band{background:linear-gradient(90deg,rgba(195,160,252,.28),rgba(251,216,155,.35),rgba(65,194,200,.18));padding:78px 0}.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;text-align:left;margin-top:28px}.quote{background:rgba(255,255,255,.74);border-radius:20px;padding:28px;margin:0;box-shadow:0 10px 28px rgba(68,65,55,.08);position:relative}.quote:before{content:"“";font-family:Georgia,serif;color:var(--orange);font-size:5rem;line-height:0;display:block;margin-top:18px}.quote cite{color:var(--orange);font-style:normal;font-weight:700}.teal{background:var(--teal);color:#fff}.teal h2{color:#fff}.mini-cta{display:flex;align-items:center;justify-content:space-between;gap:30px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{background:#fff;border-radius:22px;padding:32px;box-shadow:var(--shadow)}.wash{background:#fffaf0}.class-list{display:grid;gap:14px}.class-row{background:#fff;border-left:6px solid var(--teal);padding:18px 20px;border-radius:14px;box-shadow:0 10px 24px rgba(68,65,55,.08);display:grid;grid-template-columns:180px 1fr auto;gap:16px;align-items:center}.class-row strong{color:var(--ink)}.pill{background:rgba(255,156,19,.12);color:var(--orange);border-radius:999px;padding:5px 10px;font-size:.75rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.footer{background:#47443a;color:#fff;padding:70px 28px 28px}.footer-grid{max-width:var(--max);margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:34px}.footer h2,.footer h3{color:#fff}.footer a{text-decoration:none}.copyright{max-width:var(--max);margin:50px auto 0;font-size:.85rem;color:rgba(255,255,255,.7)}.page-hero{min-height:520px;background:linear-gradient(90deg,rgba(20,25,30,.72),rgba(20,25,30,.18)),url('../assets/bg.gif') center/cover no-repeat;display:flex;align-items:flex-start;color:#fff;padding:160px 0 90px}.page-hero h1{color:#fff}.page-hero p{font-size:1.25rem;max-width:760px}.contact-box{background:#fff;border-radius:28px;padding:40px;box-shadow:var(--shadow)}.image-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.image-strip img{border-radius:22px;aspect-ratio:1.15;object-fit:cover}@media(max-width:1120px){.site-nav a{font-size:.70rem;white-space:normal;min-width:54px}.site-nav .btn{display:none}}@media(max-width:1000px){.site-nav{position:fixed;inset:96px 0 auto 0;background:rgba(254,231,108,.98);padding:26px;display:none;flex-direction:column;align-items:flex-start}.site-nav.open{display:flex}.site-nav a{color:var(--grey)!important;white-space:nowrap;min-width:0}.menu-toggle{display:block;background:transparent;color:#fff;border:2px solid currentColor;border-radius:999px;padding:9px 14px;text-transform:uppercase;font-weight:900}.site-header.scrolled .menu-toggle{color:var(--grey)}.quick-values .inner,.quotes,.cards,.footer-grid{grid-template-columns:1fr 1fr}.value:nth-child(2){border-right:0}.split{grid-template-columns:1fr}.hero{background-position:center}.hero:after{height:130px}.hero-inner{margin:0 auto;padding:150px 28px 80px}.nav-wrap{height:90px}.brand-title{font-size:1.25rem}.brand-mark{width:42px;height:42px}.brand-sub{font-size:.58rem}.page-hero{padding-top:140px}.class-row{grid-template-columns:1fr;gap:4px}}@media(max-width:640px){.nav-wrap{padding:0 18px}.brand{gap:10px;min-width:0}.brand-mark{display:none}.brand-title{font-size:1.08rem}.brand-sub{font-size:.5rem;letter-spacing:.16em}.hero{min-height:680px}.quick-values .inner,.quotes,.cards,.footer-grid,.image-strip{grid-template-columns:1fr}.value{border-right:0;border-bottom:1px solid rgba(255,255,255,.35)}.value:last-child{border-bottom:0}.section{padding:70px 0}.mini-cta{display:block}.mini-cta .btn{margin-top:20px}h1{font-size:3.1rem}.page-hero{min-height:430px}}

/* Final JYOGA refinements */
.brand-jyoga{gap:12px;min-width:250px;color:inherit}
.brand-logo{width:150px;height:auto;display:block;object-fit:contain;filter:none!important;transition:opacity .25s}
.brand-tattoo{width:42px;height:42px;display:block;object-fit:contain;filter:brightness(0) invert(1);opacity:.92;transition:filter .35s,opacity .35s}
.site-header.scrolled .brand-tattoo{filter:none;opacity:.9}
.site-header.scrolled .brand-logo{filter:none!important}
.site-nav a{text-align:center;align-self:center}
@media(max-width:1120px){.site-nav a{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:28px}.site-nav{align-items:center}.site-nav a:not(.btn){max-width:88px}}
@media(max-width:1000px){.site-nav{align-items:flex-start}.site-nav a{max-width:none;text-align:left}.brand-logo{width:132px}.brand-tattoo{width:36px;height:36px}}
@media(max-width:640px){.brand-logo{width:120px}.brand-tattoo{display:block;width:32px;height:32px}.brand-mark{display:none}}

/* JYOGA logo state: solid yellow over transparent header, grey outline after scroll */
.brand-logo-yellow{display:block}
.brand-logo-cloud{display:none}
.site-header.scrolled .brand-logo-yellow{display:none}
.site-header.scrolled .brand-logo-cloud{display:block}


/* Rebuild 7: crisp editorial edges + compact class timetable */
.photo-card,
.image-strip img{
    border-radius:0;
}

/* Keep content panels crisp rather than pill-like */
.card,
.contact-box,
.quote{
    border-radius:0;
}

.class-days{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    margin-top:34px;
}
.class-day{
    background:#fff;
    border-top:6px solid var(--teal);
    padding:22px 20px 18px;
    box-shadow:0 10px 24px rgba(68,65,55,.08);
}
.class-day h3{
    margin:0 0 14px;
    font-size:1.25rem;
    letter-spacing:-.025em;
}
.day-class{
    padding:12px 0;
    border-top:1px solid rgba(127,123,102,.22);
    font-size:.84rem;
    line-height:1.4;
}
.day-class:first-of-type{
    border-top:0;
    padding-top:0;
}
.day-class strong{
    display:block;
    color:var(--ink);
    font-size:.86rem;
    line-height:1.35;
}
.day-class span{
    display:block;
    margin-top:3px;
    color:var(--grey);
    font-size:.78rem;
}
@media(max-width:1000px){
    .class-days{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:640px){
    .class-days{grid-template-columns:1fr;gap:14px;}
}


/* Rebuild 8: compact reflection quotes + online split layout */
.day-quote,
.card-quote,
.inline-quote{
    margin:18px 0 0;
    padding:16px 0 0;
    border-top:1px solid rgba(127,123,102,.25);
    background:transparent;
    box-shadow:none;
}
.day-quote p,
.card-quote p,
.inline-quote p{
    margin:0 0 8px;
    color:var(--ink);
    font-size:.82rem;
    line-height:1.5;
    font-style:italic;
}
.day-quote cite,
.card-quote cite,
.inline-quote cite{
    display:block;
    color:var(--orange);
    font-size:.72rem;
    line-height:1.35;
    font-style:normal;
    font-weight:800;
}
.inline-quote{
    margin:24px 0 28px;
    padding:20px 22px;
    border-top:5px solid var(--teal);
    background:#fff;
}
.inline-quote p{font-size:.95rem;}
.card-quote{margin-top:24px;}

.online-layout{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);
    gap:0;
    align-items:stretch;
    background:#fff;
}
.online-copy{padding:48px 44px;}
.online-days{display:grid;grid-template-columns:1fr;gap:12px;margin:28px 0;}
.online-days .class-day{box-shadow:none;background:var(--cream);}
.online-image{min-height:620px;overflow:hidden;}
.online-image img{width:100%;height:100%;object-fit:cover;object-position:center;}
.online-note{margin-top:28px;}

.retreat-quotes{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-top:24px;
}
.retreat-quotes .quote{
    padding:22px;
    box-shadow:none;
    background:#fff;
    border-top:5px solid var(--teal);
}
.retreat-quotes .quote:before{font-size:3.5rem;margin-top:12px;}
.retreat-quotes .quote p{font-size:.88rem;line-height:1.5;}
.retreat-quotes .quote cite{font-size:.75rem;}

@media(max-width:900px){
    .online-layout{grid-template-columns:1fr;}
    .online-image{min-height:420px;}
}
@media(max-width:640px){
    .online-copy{padding:34px 24px;}
    .retreat-quotes{grid-template-columns:1fr;}
}

/* Rebuild 9: uniform quote language, tighter home quadrant and smaller hero curve */

/* The curved teal transition is now a small accent rather than a dominant wave. */
.hero:after{
    left:18%;
    right:18%;
    bottom:-30px;
    height:72px;
    border-radius:50% 50% 0 0 / 70% 70% 0 0;
}

/* One quote treatment across the site: white panel, teal top rule, orange quote mark. */
.quote,
.day-quote,
.card-quote,
.inline-quote{
    position:relative;
    margin:0;
    padding:22px;
    background:#fff;
    border-top:5px solid var(--teal);
    border-radius:20px;
    box-shadow:none;
    text-align:left;
}
.quote:before,
.day-quote:before,
.card-quote:before,
.inline-quote:before{
    content:"“";
    display:block;
    height:30px;
    margin-top:10px;
    font-family:Georgia,serif;
    color:var(--orange);
    font-size:3.5rem;
    line-height:.5;
    font-style:normal;
}
.quote p,
.day-quote p,
.card-quote p,
.inline-quote p{
    margin:0 0 10px;
    color:var(--ink);
    font-size:.88rem;
    line-height:1.5;
    font-style:normal;
}
.quote cite,
.day-quote cite,
.card-quote cite,
.inline-quote cite{
    display:block;
    color:var(--orange);
    font-size:.75rem;
    line-height:1.35;
    font-style:normal;
    font-weight:800;
}
.day-quote,
.card-quote{
    margin-top:18px;
}
.inline-quote{
    margin:28px 0 0;
}

/* Four equal blocks under 'Gentle and powerful': three reflections + contact. */
.home-quote-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch;
}
.home-quote-grid > *{
    min-height:220px;
}
.quote-cta{
    background:var(--teal);
    border-top-color:var(--teal);
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.quote-cta:before{content:none;}
.quote-cta .eyebrow{
    color:var(--yellow);
    margin-bottom:8px;
}
.quote-cta h3{
    color:#fff;
    font-size:1.65rem;
    margin-bottom:10px;
}
.quote-cta p{
    color:#fff;
    font-size:.9rem;
    margin-bottom:18px;
}
.quote-cta .btn{
    align-self:flex-start;
    box-shadow:none;
}

/* Retreat quotes already established this visual language; inherit the shared rules. */
.retreat-quotes .quote{
    padding:22px;
    background:#fff;
    border-top:5px solid var(--teal);
}
.retreat-quotes .quote:before{
    font-size:3.5rem;
    margin-top:10px;
}
.retreat-quotes .quote p{
    font-size:.88rem;
    line-height:1.5;
}
.retreat-quotes .quote cite{font-size:.75rem;}

@media(max-width:1000px){
    .hero:after{left:15%;right:15%;height:62px;bottom:-28px;}
}
@media(max-width:640px){
    .hero:after{left:22%;right:22%;height:44px;bottom:-20px;}
    .home-quote-grid{grid-template-columns:1fr 1fr;gap:14px;}
    .home-quote-grid > *{min-height:0;padding:18px;}
    .home-quote-grid .quote:before{font-size:3rem;height:24px;}
    .home-quote-grid .quote p{font-size:.8rem;}
    .home-quote-grid .quote cite{font-size:.68rem;}
    .quote-cta h3{font-size:1.25rem;}
    .quote-cta p{font-size:.8rem;}
    .quote-cta .btn{padding:10px 12px;font-size:.7rem;}
}

/* Rebuild 10: home structure, square quotes, compact teal band, orange online rules */

/* Remove the decorative teal curve entirely. */
.hero:after{content:none!important;display:none!important;}

/* Keep the teal values band, but make it a tight functional strip. */
.quick-values{padding:18px 0 20px;}
.quick-values .inner{gap:0;}
.value{padding:8px 18px;}
.icon{font-size:1.8rem;margin-bottom:4px;}
.value h3{font-size:1.08rem;margin-bottom:3px;}
.value p{font-size:.79rem;line-height:1.35;margin:0;}

/* Crisp, square quote panels throughout the site. */
.quote,.day-quote,.card-quote,.inline-quote,.retreat-quotes .quote{border-radius:0!important;}

/* Ways to practise is a four-box quadrant; email is the blue fourth panel. */
.ways-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;}
.ways-grid > *{min-height:230px;}
.ways-email-card{background:var(--teal);color:#fff;display:flex;flex-direction:column;justify-content:center;}
.ways-email-card .eyebrow{color:var(--yellow);margin-bottom:8px;}
.ways-email-card h3{color:#fff;font-size:1.65rem;}
.ways-email-card p{color:#fff;}
.ways-email-card .btn{align-self:flex-start;box-shadow:none;}

/* Four real participant quotes beneath Gentle and powerful. */
.home-quote-grid{grid-template-columns:repeat(2,minmax(0,1fr));}

/* Online timetable: orange rules instead of teal. */
.online-days .class-day{border-top-color:var(--orange);}

@media(max-width:1000px){
  .quick-values{padding:16px 0 18px;}
  .value{padding:7px 14px;}
}
@media(max-width:640px){
  .quick-values{padding:12px 0 14px;}
  .quick-values .inner{grid-template-columns:repeat(4,minmax(0,1fr));padding:0 10px;}
  .value{padding:5px 6px;border-right:1px solid rgba(255,255,255,.35);border-bottom:0;}
  .value:last-child{border-right:0;}
  .icon{font-size:1.35rem;}
  .value h3{font-size:.78rem;letter-spacing:-.02em;}
  .value p{font-size:.58rem;line-height:1.25;}
  .ways-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
  .ways-grid > *{min-height:0;padding:18px;}
  .ways-grid h3{font-size:1rem;}
  .ways-grid p{font-size:.78rem;line-height:1.45;}
  .ways-grid a:not(.btn){font-size:.76rem;}
  .ways-email-card h3{font-size:1.15rem;}
  .ways-email-card .btn{padding:9px 10px;font-size:.62rem;}
}

/* Shared hero alignment: all page heroes follow the Home page left edge. */
.page-hero > .container{
  max-width:none;
  width:100%;
  margin:0;
  padding-left:clamp(28px,8vw,120px);
  padding-right:28px;
}

@media(max-width:1000px){
  .page-hero > .container{
    padding-left:28px;
    padding-right:28px;
  }
}