/* ============================================================
   INNER AXIS CONSULTING — SHARED STYLESHEET
   Merged from all pages. Design tokens, base components,
   then page-section styles, then responsive breakpoints.
   ============================================================ */

:root{
    --purple:#5A2A82;
    --purple-light:#7A46A8;
    --purple-deep:#3A1B5C;
    --ink:#1C1226;
    --ink-soft:#2A1B3D;
    --blue:#1E3A8A;
    --blue-deep:#152A63;
    --gold-1:#F5C542;
    --gold-2:#C48A00;
    --paper:#FAF6EE;
    --paper-2:#F1E9D6;
    --text-dark:#2B2233;
    --text-dark-soft:#5B4E68;
    --text-light:#F4EEE0;
    --text-light-soft:#C9BEDD;
    --gold-grad: linear-gradient(135deg, var(--gold-1), var(--gold-2));
    --serif: "Playfair Display", Georgia, serif;
    --sans: "Lato", "Open Sans", -apple-system, sans-serif;
    --maxw: 1180px;
  }

*{margin:0;padding:0;box-sizing:border-box;}
picture{display:block;}

html{scroll-behavior:smooth;}

body{
    font-family:var(--sans);
    background:var(--paper);
    color:var(--text-dark);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

a{color:inherit;text-decoration:none;}

img{max-width:100%;display:block;}

section{position:relative;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}

h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.15;letter-spacing:-0.01em;}

.eyebrow{
    font-family:var(--sans);
    font-size:12.5px;
    font-weight:700;
    letter-spacing:0.22em;
    text-transform:uppercase;
    display:inline-flex;
    align-items:center;
    gap:10px;
  }

.eyebrow::before{
    content:"";
    width:26px;height:1px;
    background:var(--gold-grad);
    display:inline-block;
  }

.eyebrow--light{color:var(--gold-1);}

.eyebrow--dark{color:var(--purple);}

.btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:15px 30px;
    border-radius:2px;
    font-family:var(--sans);
    font-weight:700;
    font-size:14.5px;
    letter-spacing:0.03em;
    cursor:pointer;
    border:1px solid transparent;
    transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
  }

.btn:focus-visible{outline:2px solid var(--gold-1); outline-offset:3px;}

.btn--gold{
    background:var(--gold-grad);
    color:var(--ink);
  }

.btn--gold:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(196,138,0,0.35);}

.btn--outline{
    background:transparent;
    color:var(--text-light);
    border-color:rgba(244,238,224,0.4);
  }

.btn--outline:hover{border-color:var(--gold-1); color:var(--gold-1);}

.btn--outline-dark{
    background:transparent;
    color:var(--purple);
    border-color:rgba(90,42,130,0.35);
  }

.btn--outline-dark:hover{border-color:var(--purple); background:rgba(90,42,130,0.06);}

/* ---------- NAV ---------- */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100; padding:14px 0;
    background:rgba(250,246,238,0.92); backdrop-filter:blur(10px);
    box-shadow:0 1px 0 rgba(90,42,130,0.08);
  }

.nav{display:flex; align-items:center; justify-content:space-between;}

.brand{display:flex; align-items:center; gap:12px;}

.brand-mark{width:38px; height:38px; border-radius:50%; background:var(--ink); display:flex; align-items:center; justify-content:center; overflow:hidden;}

.brand-mark img{width:100%; height:100%; object-fit:cover; border-radius:50%;}

.brand-text{display:flex; flex-direction:column; line-height:1.1;}

.brand-text b{font-family:var(--serif); font-size:16.5px; letter-spacing:0.04em; color:var(--ink);}

.brand-text span{font-size:9.5px; letter-spacing:0.24em; text-transform:uppercase; color:var(--gold-1); font-weight:700; margin-top:2px;}

.nav-links{display:flex; gap:36px; align-items:center;}

.nav-links a{font-size:13.5px; font-weight:600; letter-spacing:0.03em; color:var(--text-dark); position:relative; padding:4px 0;}

.nav-links a[aria-current="page"]{color:var(--purple);}

.nav-links a::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:var(--gold-grad); transition:width .3s ease;}

.nav-links a:hover::after, .nav-links a[aria-current="page"]::after{width:100%;}

.nav-cta{padding:11px 22px; font-size:13px; color:var(--ink) !important;}

.nav-toggle{display:none; background:none; border:0; cursor:pointer; padding:6px;}

.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{content:""; display:block; width:22px; height:2px; background:var(--text-dark); position:relative;}

.nav-toggle span::before{position:absolute; top:-7px;}

.nav-toggle span::after{position:absolute; top:7px;}

/* ---------- HERO ---------- */
  .hero{
    min-height:100vh;
    background:
      radial-gradient(ellipse 900px 600px at 82% 12%, rgba(196,138,0,0.14), transparent 60%),
      radial-gradient(ellipse 700px 500px at 5% 85%, rgba(90,42,130,0.10), transparent 60%),
      var(--paper);
    display:flex; align-items:center;
    padding-top:120px; padding-bottom:80px;
    overflow:hidden;
  }

.hero .wrap{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:60px;
    align-items:center;
  }

.hero-copy{position:relative;z-index:2;}

.hero-copy .eyebrow{margin-bottom:22px;}

.hero-copy h1{
    font-size:clamp(34px,4.6vw,58px);
    color:var(--ink);
    margin-bottom:26px;
  }

.hero-copy h1 em{
    font-style:italic; color:var(--purple);
    background:linear-gradient(180deg, transparent 62%, rgba(245,197,66,0.35) 62%);
  }

.hero-copy p.lede{
    font-size:17.5px; color:var(--text-dark-soft); max-width:520px; margin-bottom:16px;
  }

.pillars-row{
    display:flex; flex-wrap:wrap; gap:0; margin:30px 0 36px;
    font-family:var(--serif); font-style:italic; font-size:17px; color:var(--purple);
  }

.pillars-row span{padding:0 14px 0 0;}

.pillars-row span:not(:last-child)::after{
    content:"·"; color:var(--gold-2); margin-left:14px; font-style:normal;
  }

.pillars-row span:first-child{padding-left:0;}

.hero-actions{display:flex; gap:16px; flex-wrap:wrap; margin-top:8px;}

.hero-actions .btn--outline-dark{color:var(--purple); border-color:rgba(90,42,130,0.35);}

/* Hero logo */
  .axis-wrap{
    position:relative; height:560px; display:flex; align-items:center; justify-content:center;
  }

.hero-logo-frame{
    position:relative; width:100%; max-width:400px; aspect-ratio:1/1.05;
    display:flex; align-items:center; justify-content:center;
    padding:26px;
  }

.hero-logo-frame::before{
    content:""; position:absolute; inset:0; border-radius:50%;
    background:radial-gradient(circle, rgba(90,42,130,0.14), transparent 70%);
  }

.hero-logo-img{
    position:relative; z-index:1; width:100%; height:auto;
    border-radius:14px;
    filter:drop-shadow(0 20px 40px rgba(28,18,38,0.25));
  }

.founder .wrap{
    display:grid; grid-template-columns:0.62fr 1fr; gap:70px; align-items:center;
  }

.monogram-frame{
    position:relative; aspect-ratio:1/1.1;
    border:1px solid rgba(245,197,66,0.35);
    display:flex; align-items:center; justify-content:center;
    background:rgba(244,238,224,0.02);
  }

.monogram-frame::before{
    content:""; position:absolute; inset:16px; border:1px solid rgba(245,197,66,0.18);
  }

.monogram-frame::after{
    content:""; position:absolute; width:70%; height:70%; border-radius:50%;
    background:radial-gradient(circle, rgba(245,197,66,0.16), transparent 70%); z-index:0;
  }

.monogram{
    position:relative; z-index:1;
    font-family:var(--serif); font-weight:600; font-size:96px;
    background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent;
  }

.founder-photo{
    position:relative; z-index:1;
    width:calc(100% - 32px); height:calc(100% - 32px);
    object-fit:cover; object-position:top center;
    filter:saturate(1.04) contrast(1.02);
  }

.founder-copy .eyebrow{margin-bottom:20px;}

.founder-copy h2{font-size:clamp(28px,3.2vw,40px); margin-bottom:6px; color:var(--text-light);}

.founder-copy .role{
    font-size:14px; color:var(--gold-1); font-weight:700; letter-spacing:0.05em; margin-bottom:26px;
  }

.founder-copy p{color:var(--text-light-soft); font-size:16px; max-width:560px; margin-bottom:26px;}

.credentials{
    display:grid; grid-template-columns:1fr 1fr; gap:14px 26px; margin-top:30px; max-width:560px;
  }

.credentials li{
    list-style:none; font-size:13.5px; color:var(--text-light-soft);
    padding-left:20px; position:relative; letter-spacing:0.01em;
  }

.credentials li::before{
    content:""; position:absolute; left:0; top:8px; width:9px; height:1px; background:var(--gold-1);
  }

/* ---------- PILLARS (Mind/Emotions/Purpose/Life) ---------- */
  .pillars{padding:150px 0 130px; background:var(--paper);}

.section-head{max-width:640px; margin-bottom:80px;}

.section-head .eyebrow{margin-bottom:20px;}

.section-head h2{font-size:clamp(28px,3.4vw,42px); color:var(--ink); margin-bottom:18px;}

.section-head p{color:var(--text-dark-soft); font-size:16.5px;}

.axis-spine{
    position:relative;
    display:grid;
    grid-template-columns:1fr;
    max-width:760px; margin:0 auto;
  }

.axis-spine::before{
    content:"";
    position:absolute; left:34px; top:10px; bottom:10px; width:2px;
    background:linear-gradient(180deg, var(--gold-1), var(--gold-2));
  }

.pillar-item{
    display:grid; grid-template-columns:70px 1fr; gap:0; padding:32px 0;
    position:relative;
  }

.pillar-item:not(:last-child){border-bottom:1px solid rgba(90,42,130,0.08);}

.pillar-node{
    width:14px;height:14px;border-radius:50%;
    background:var(--paper);
    border:2px solid var(--gold-2);
    position:relative; z-index:2; margin-top:8px; margin-left:28px;
  }

.pillar-body h3{
    font-size:22px; color:var(--purple); margin-bottom:8px;
    display:flex; align-items:baseline; gap:12px;
  }

.pillar-body h3 small{
    font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:0.18em;
    color:var(--gold-2); text-transform:uppercase;
  }

.pillar-body p{color:var(--text-dark-soft); font-size:15.5px; max-width:520px;}

/* ---------- COMPASS / SERVICES ---------- */
  .compass{
    background:linear-gradient(150deg, var(--blue-deep) 0%, var(--blue) 55%, var(--purple-deep) 100%);
    color:var(--text-light);
    padding:150px 0 130px;
  }

.compass .section-head p{color:var(--text-light-soft);}

.compass .section-head h2{color:var(--text-light);}

.compass-grid{
    display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:1px;
    background:rgba(244,238,224,0.14);
    border:1px solid rgba(244,238,224,0.14);
  }

.compass-card{
    background:linear-gradient(180deg, rgba(28,18,38,0.55), rgba(28,18,38,0.35));
    padding:38px 28px 34px;
    transition:background .35s ease, transform .35s ease;
  }

.compass-card:hover{background:rgba(28,18,38,0.75); transform:translateY(-4px);}

.compass-dir{
    font-family:var(--serif); font-style:italic; font-size:15px; color:var(--gold-1);
    margin-bottom:22px; display:block;
  }

.compass-card h3{font-size:19px; color:var(--text-light); margin-bottom:12px; line-height:1.25;}

.compass-card p{font-size:14px; color:var(--text-light-soft);}

/* ---------- QUOTE ---------- */
  .quote-band{
    padding:110px 0;
    background:var(--paper-2);
    text-align:center;
  }

.quote-band blockquote{
    font-family:var(--serif); font-style:italic; font-weight:500;
    font-size:clamp(24px,3.2vw,38px); color:var(--purple);
    max-width:820px; margin:0 auto 26px; line-height:1.35;
  }

.quote-band cite{
    font-style:normal; font-size:13px; letter-spacing:0.1em; text-transform:uppercase;
    font-weight:700; color:var(--gold-2);
  }

/* ---------- CONTACT ---------- */
  .contact{padding:150px 0 130px; background:var(--paper);}

.contact .wrap{
    display:grid; grid-template-columns:1fr 0.85fr; gap:70px; align-items:start;
  }

.contact h2{font-size:clamp(28px,3.4vw,42px); color:var(--ink); margin-bottom:22px;}

.contact p.lede{color:var(--text-dark-soft); font-size:16.5px; max-width:460px; margin-bottom:36px;}

.contact-list{list-style:none;}

.contact-list li{
    padding:20px 0; border-top:1px solid rgba(90,42,130,0.12);
    display:flex; justify-content:space-between; gap:20px; font-size:14.5px;
  }

.contact-list li:last-child{border-bottom:1px solid rgba(90,42,130,0.12);}

.contact-list span:first-child{color:var(--text-dark-soft); letter-spacing:0.03em; text-transform:uppercase; font-size:11.5px; font-weight:700;}

.contact-list span:last-child{color:var(--ink); font-weight:600; text-align:right;}

.contact-panel{
    background:var(--ink); color:var(--text-light);
    padding:48px 40px; position:relative; overflow:hidden;
  }

.contact-panel::before{
    content:""; position:absolute; top:-40%; right:-30%; width:280px; height:280px; border-radius:50%;
    background:radial-gradient(circle, rgba(245,197,66,0.18), transparent 70%);
  }

.contact-panel h3{font-size:22px; margin-bottom:14px; color:var(--text-light);}

.contact-panel p{color:var(--text-light-soft); font-size:14.5px; margin-bottom:28px;}

/* ---------- FOOTER ---------- */
  footer{background:var(--ink); color:var(--text-light-soft); padding:60px 0 34px;}

.footer-top{
    display:flex; justify-content:space-between; align-items:flex-start; gap:40px;
    padding-bottom:40px; border-bottom:1px solid rgba(244,238,224,0.1);
    flex-wrap:wrap;
  }

.footer-tag{font-family:var(--serif); font-style:italic; font-size:19px; color:var(--text-light); max-width:340px;}

.footer-cols{display:flex; gap:60px; flex-wrap:wrap;}

.footer-col h4{
    font-size:11.5px; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold-1);
    margin-bottom:16px; font-family:var(--sans); font-weight:700;
  }

.footer-col a{display:block; font-size:13.5px; color:var(--text-light-soft); margin-bottom:10px; transition:color .25s ease;}

.footer-col a:hover{color:var(--gold-1);}

.footer-bottom{
    display:flex; justify-content:space-between; padding-top:28px; font-size:12.5px; color:rgba(201,190,221,0.6);
    flex-wrap:wrap; gap:10px;
  }

/* ---------- reveal ----------
   Visible by default on purpose: if JavaScript fails to load or run
   for any reason, content must still be readable. script.js applies
   the hidden starting state itself (as an inline style) only once
   it has successfully run, then animates elements in as they scroll
   into view. See script.js for details. */
  .reveal{transition:opacity .8s ease, transform .8s ease;}

.reveal.in{opacity:1; transform:translateY(0);}

/* ---------- responsive ---------- */
  @media (max-width:980px){
    .hero .wrap{grid-template-columns:1fr; gap:20px;}
    .axis-wrap{order:-1; height:340px;}
    .founder .wrap{grid-template-columns:1fr; gap:40px;}
    .monogram-frame{max-width:260px;}
    .compass-grid{grid-template-columns:1fr 1fr;}
    .contact .wrap{grid-template-columns:1fr;}
    .footer-top{flex-direction:column;}
  }

header{position:fixed; top:0; left:0; right:0; z-index:100; padding:14px 0; background:rgba(250,246,238,0.92); backdrop-filter:blur(10px); box-shadow:0 1px 0 rgba(90,42,130,0.08);}

.breadcrumb{padding:84px 0 0; font-size:12.5px; color:var(--text-dark-soft);}

.breadcrumb a{color:var(--purple); font-weight:600;}

.breadcrumb span{margin:0 8px; color:var(--gold-2);}

.page-hero{padding:30px 0 80px; background:radial-gradient(ellipse 900px 500px at 85% 0%, rgba(90,42,130,0.10), transparent 60%), var(--paper);}

.page-hero .eyebrow{margin-bottom:20px;}

.page-hero h1{font-size:clamp(32px,4.4vw,54px); color:var(--ink); max-width:720px;}

.page-hero p{color:var(--text-dark-soft); font-size:17px; max-width:600px; margin-top:20px;}

.founder{background:radial-gradient(ellipse 800px 500px at 90% 0%, rgba(90,42,130,0.35), transparent 55%), linear-gradient(rgba(28,18,38,0.55), rgba(58,27,92,0.55)), url("../images/hero-banner.webp"); background-size:cover; background-position:center; color:var(--text-light); padding:110px 0;}

.founder-copy blockquote{font-family:var(--serif); font-style:italic; font-size:19px; color:var(--gold-1); margin:26px 0; border-left:2px solid var(--gold-1); padding-left:20px;}

.credentials-note{font-size:11.5px; color:rgba(201,190,221,0.6); margin-top:16px; max-width:520px;}

.mv{padding:140px 0; background:var(--paper);}

.mv-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:rgba(90,42,130,0.12);}

.mv-card{padding:56px 48px; background:var(--paper);}

.mv-card.mission{background:linear-gradient(160deg, var(--purple-deep), var(--ink));}

.mv-card.vision{background:linear-gradient(160deg, var(--blue-deep), var(--blue));}

.mv-card h3{font-size:14px; text-transform:uppercase; letter-spacing:0.18em; color:var(--gold-1); margin-bottom:20px; font-family:var(--sans); font-weight:700;}

.mv-card p{font-family:var(--serif); font-size:22px; line-height:1.5; color:var(--text-light);}

.values{padding:0 0 140px; background:var(--paper);}

.values-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:rgba(90,42,130,0.12); border:1px solid rgba(90,42,130,0.12);}

.values-grid--3col{grid-template-columns:repeat(3,1fr);}

.value-card{background:var(--paper); padding:38px 28px; transition:background .3s ease;}

.value-card:hover{background:var(--paper-2);}

.value-card .num{font-family:var(--serif); font-style:italic; color:var(--gold-2); font-size:15px; display:block; margin-bottom:20px;}

.value-card h4{font-size:18px; color:var(--purple); margin-bottom:10px;}

.value-card p{font-size:14px; color:var(--text-dark-soft);}

.impact{padding:130px 0; background:linear-gradient(150deg, var(--blue-deep) 0%, var(--blue) 55%, var(--purple-deep) 100%); color:var(--text-light);}

.impact .section-head p{color:var(--text-light-soft);}

.impact .section-head h2{color:var(--text-light);}

.impact-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:30px; margin-bottom:80px;}

.stat b{display:block; font-family:var(--serif); font-size:44px; background:var(--gold-grad); -webkit-background-clip:text; background-clip:text; color:transparent; margin-bottom:8px;}

.stat span{font-size:13px; color:var(--text-light-soft); letter-spacing:0.03em;}

.partners-label{font-size:11.5px; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-1); font-weight:700; margin-bottom:24px; display:block;}

.partners-row{display:flex; flex-wrap:wrap; gap:14px;}

.partner-chip{border:1px solid rgba(244,238,224,0.25); padding:12px 22px; font-size:13.5px; color:var(--text-light-soft); letter-spacing:0.02em;}

.cta-band{padding:110px 0; text-align:center; background:var(--paper-2);}

.cta-band h2{font-size:clamp(26px,3.2vw,38px); color:var(--ink); margin-bottom:28px; max-width:600px; margin-left:auto; margin-right:auto;}

.cta-actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}

footer{background:var(--ink); color:var(--text-light-soft); padding:60px 0 34px;}

.subnav{position:sticky; top:66px; z-index:50; background:rgba(250,246,238,0.95); backdrop-filter:blur(8px); border-top:1px solid rgba(90,42,130,0.1); border-bottom:1px solid rgba(90,42,130,0.1);}

.subnav-inner{display:flex; gap:34px; overflow-x:auto; padding:16px 0;}

.subnav a{font-size:12.5px; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-dark-soft); white-space:nowrap;}

.subnav a:hover{color:var(--purple);}

.service-block{padding:110px 0;}

.service-block.paper{background:var(--paper);}

.service-block.dark{background:linear-gradient(160deg, var(--purple-deep) 0%, var(--ink) 100%); color:var(--text-light);}

.service-block.blue{background:linear-gradient(150deg, var(--blue-deep) 0%, var(--blue) 100%); color:var(--text-light);}

.service-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:70px; align-items:start;}

.service-tag{display:block; margin-bottom:18px;}

.service-block.paper .service-tag{color:var(--gold-2);}

.service-block.dark .service-tag, .service-block.blue .service-tag{color:var(--gold-1);}

.service-block h2{font-size:clamp(26px,3vw,38px); margin-bottom:20px;}

.service-block.paper h2{color:var(--ink);}

.service-block.dark h2, .service-block.blue h2{color:var(--text-light);}

.service-block p.desc{font-size:16px; margin-bottom:26px; max-width:420px;}

.service-block.paper p.desc{color:var(--text-dark-soft);}

.service-block.dark p.desc, .service-block.blue p.desc{color:var(--text-light-soft);}

.service-block .who{font-size:13.5px; font-weight:700; letter-spacing:0.03em; margin-bottom:10px;}

.service-block.paper .who{color:var(--purple);}

.service-block.dark .who, .service-block.blue .who{color:var(--gold-1);}

.expect-panel{border:1px solid; padding:36px 34px;}

.service-block.paper .expect-panel{border-color:rgba(90,42,130,0.15); background:var(--paper-2);}

.service-block.dark .expect-panel, .service-block.blue .expect-panel{border-color:rgba(244,238,224,0.18); background:rgba(244,238,224,0.04);}

.expect-panel h4{font-size:12px; letter-spacing:0.16em; text-transform:uppercase; margin-bottom:20px; font-family:var(--sans); font-weight:700;}

.service-block.paper .expect-panel h4{color:var(--purple);}

.service-block.dark .expect-panel h4, .service-block.blue .expect-panel h4{color:var(--gold-1);}

.expect-panel ul{list-style:none;}

.expect-panel li{font-size:14.5px; padding:12px 0 12px 24px; position:relative; border-bottom:1px solid;}

.service-block.paper .expect-panel li{color:var(--text-dark-soft); border-color:rgba(90,42,130,0.1);}

.service-block.dark .expect-panel li, .service-block.blue .expect-panel li{color:var(--text-light-soft); border-color:rgba(244,238,224,0.1);}

.expect-panel li:last-child{border-bottom:none; padding-bottom:0;}

.expect-panel li::before{content:"—"; position:absolute; left:0; top:12px; color:var(--gold-2);}

.expect-panel .btn{margin-top:26px;}

button{font-family:var(--sans);}

.filters{padding:0 0 60px;}

.filter-row{display:flex; gap:12px; flex-wrap:wrap;}

.filter-pill{
    padding:10px 20px; font-size:12.5px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
    border:1px solid rgba(90,42,130,0.25); background:transparent; color:var(--text-dark-soft);
    cursor:pointer; transition:all .25s ease;
  }

.filter-pill:hover{border-color:var(--purple); color:var(--purple);}

.filter-pill.active{background:var(--purple); border-color:var(--purple); color:var(--text-light);}

.filter-pill:focus-visible{outline:2px solid var(--gold-1); outline-offset:2px;}

.blog{padding:0 0 130px;}

.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px;}

.blog-card{
    display:flex; flex-direction:column; background:var(--paper-2); border:1px solid rgba(90,42,130,0.1);
    transition:transform .3s ease, box-shadow .3s ease; opacity:1; transform:scale(1);
  }

.blog-card:hover{transform:translateY(-4px); box-shadow:0 16px 34px rgba(28,18,38,0.1);}

/* V20 — Resources editorial hierarchy */
.blog-card--featured{grid-column:span 2; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);}
.blog-card--featured .card-media{height:100%; min-height:330px;}
.blog-card--featured .card-body{padding:34px 34px 32px;}
.blog-card--featured .card-body h3{font-size:clamp(24px,2.4vw,34px); line-height:1.18;}
.blog-card--featured .card-body p{font-size:15px; line-height:1.75;}
.blog-card--featured .card-meta{padding-top:10px;}

.card-media-image{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0;transition:transform .55s cubic-bezier(.2,.65,.2,1);}
.blog-card:hover .card-media-image{transform:scale(1.035);}
.card-media-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,18,38,.03) 20%,rgba(28,18,38,.68) 100%);}
.card-media > .card-icon,.card-media > .card-cat{position:relative;z-index:2;}

.testimonials .section-head p{color:var(--text-light-soft);}
.testimonials .section-head h2{color:var(--text-light);}

.article-media--photo{height:460px;align-items:stretch;justify-content:stretch;}
.article-media--photo img{width:100%;height:100%;object-fit:cover;display:block;}
.article-media--photo::after{content:"";position:absolute;inset:0;border:1px solid rgba(245,197,66,.35);pointer-events:none;}
.article-media-wrap{position:relative;}


.blog-card.hidden{display:none;}

.card-media{
    height:150px; position:relative; overflow:hidden;
    display:flex; flex-direction:column; justify-content:space-between; padding:18px;
  }

.card-media.mind{background:linear-gradient(140deg, var(--purple) 0%, var(--purple-deep) 100%);}

.card-media.leadership{background:linear-gradient(140deg, var(--blue) 0%, var(--blue-deep) 100%);}

.card-media.growth{background:linear-gradient(140deg, var(--gold-2) 0%, #8a6100 100%);}

.card-media.faith{background:linear-gradient(140deg, var(--purple-light) 0%, var(--blue-deep) 100%);}

.card-icon{opacity:0.85;}

.card-icon svg{width:30px; height:30px;}

.card-cat{font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-light);}

.card-body{padding:26px 26px 28px; display:flex; flex-direction:column; flex:1;}

.card-body h3{font-size:19px; color:var(--ink); margin-bottom:12px; line-height:1.3;}

.card-body p{font-size:13.5px; color:var(--text-dark-soft); margin-bottom:20px; flex:1;}

.card-meta{display:flex; justify-content:space-between; align-items:center; font-size:12px; color:var(--purple); font-weight:700;}

.testimonials{padding:130px 0; background:linear-gradient(150deg, var(--blue-deep) 0%, var(--blue) 55%, var(--purple-deep) 100%); color:var(--text-light);}

.testimonials .section-head p{color:var(--text-light-soft); font-size:16.5px;}

.testimonials .section-head h2{font-size:clamp(28px,3.4vw,42px); color:var(--text-light); margin-bottom:18px;}

.t-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(244,238,224,0.15); border:1px solid rgba(244,238,224,0.15);}

.t-card{background:rgba(28,18,38,0.35); padding:34px 30px;}

.t-card p.quote{font-family:var(--serif); font-style:italic; font-size:17px; line-height:1.5; color:var(--text-light); margin-bottom:22px;}

.t-card .who{font-size:12.5px; color:var(--gold-1); font-weight:700; letter-spacing:0.03em;}

.t-card .who span{display:block; color:var(--text-light-soft); font-weight:400; margin-top:2px; font-size:12px;}

.story{padding:130px 0; background:var(--paper);}

.story-grid{display:grid; grid-template-columns:0.4fr 1fr; gap:60px; align-items:center;}

.story-frame{aspect-ratio:1/1; background:linear-gradient(150deg, var(--gold-1), var(--gold-2)); display:flex; align-items:center; justify-content:center;}

.story-frame span{font-family:var(--serif); font-size:60px; color:var(--ink); opacity:0.85;}

.story-copy .eyebrow{margin-bottom:20px;}

.story-copy h2{font-size:clamp(24px,2.8vw,32px); color:var(--ink); margin-bottom:18px;}

.story-copy p{color:var(--text-dark-soft); font-size:15.5px; margin-bottom:10px;}

.story-copy .signee{margin-top:20px; font-size:13px; font-weight:700; color:var(--purple);}

h1,h2,h3{font-family:var(--serif); font-weight:600; line-height:1.2; letter-spacing:-0.01em;}

.nav-links a:hover::after{width:100%;}

.article-hero{padding:30px 0 60px; background:radial-gradient(ellipse 900px 500px at 85% 0%, rgba(90,42,130,0.10), transparent 60%), var(--paper);}

.back-link{display:none;}

.article-hero h1{font-size:clamp(30px,4.2vw,50px); color:var(--ink); max-width:760px; margin:20px 0 24px;}

.article-meta{display:flex; gap:20px; flex-wrap:wrap; font-size:13px; color:var(--text-dark-soft); font-weight:600;}

.article-meta span:not(:last-child)::after{content:"·"; margin-left:20px; color:var(--gold-2);}

.article-media{height:320px; margin:0 0 70px; background:linear-gradient(140deg, var(--purple) 0%, var(--purple-deep) 100%); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center;}

.article-media svg{width:120px; height:120px; opacity:0.9;}

.article-body{max-width:720px; margin:0 auto; padding-bottom:130px;}

.article-body p{font-size:17px; color:var(--text-dark); margin-bottom:24px;}

.article-body h2{font-size:26px; color:var(--purple); margin:48px 0 18px;}

.article-body blockquote{font-family:var(--serif); font-style:italic; font-size:22px; color:var(--purple); border-left:3px solid var(--gold-1); padding-left:24px; margin:36px 0;}

.article-body ul{margin:0 0 24px 20px;}

.article-body li{font-size:16px; color:var(--text-dark); margin-bottom:10px;}

.article-cta{background:var(--paper-2); padding:44px 40px; margin-top:50px; text-align:center;}

.article-cta h3{font-size:22px; color:var(--ink); margin-bottom:14px;}

.article-cta p{color:var(--text-dark-soft); font-size:14.5px; margin-bottom:22px;}

.contact-main{padding:0 0 130px;}

.contact-grid{display:grid; grid-template-columns:0.95fr 1.05fr; gap:70px; align-items:start;}

.info-block{margin-bottom:44px;}

.info-block h3{font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--purple); margin-bottom:16px; font-family:var(--sans); font-weight:700;}

.info-row{display:flex; justify-content:space-between; padding:16px 0; border-top:1px solid rgba(90,42,130,0.12); font-size:14.5px;}

.info-row:last-child{border-bottom:1px solid rgba(90,42,130,0.12);}

.info-row span:first-child{color:var(--text-dark-soft); font-weight:600;}

.info-row span:last-child{color:var(--ink); font-weight:600; text-align:right;}

.social-row{display:flex; gap:14px; margin-top:6px;}

.social-chip{border:1px solid rgba(90,42,130,0.3); padding:11px 20px; font-size:13px; font-weight:700; color:var(--purple); transition:all .25s ease;}

.social-chip:hover{background:var(--purple); color:var(--text-light); border-color:var(--purple);}

.map-block{height:220px; background:linear-gradient(150deg, var(--blue-deep), var(--purple-deep)); position:relative; display:flex; align-items:center; justify-content:center; margin-top:6px;}

.map-block::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 50%, rgba(245,197,66,0.14), transparent 60%);}

.map-pin{position:relative; z-index:2; text-align:center; color:var(--text-light);}

.map-pin svg{width:26px; height:26px; margin-bottom:8px;}

.map-pin span{display:block; font-size:13px; font-weight:700; letter-spacing:0.03em;}

/* form */
  .form-panel{background:var(--ink); padding:48px 44px; position:relative; overflow:hidden;}

.form-panel .btn{width:100%;}

.form-panel::before{content:""; position:absolute; top:-40%; right:-30%; width:280px; height:280px; border-radius:50%; background:radial-gradient(circle, rgba(245,197,66,0.16), transparent 70%);}

.form-panel h2{color:var(--text-light); font-size:26px; margin-bottom:8px; position:relative; z-index:2;}

.form-panel > p{color:var(--text-light-soft); font-size:14.5px; margin-bottom:32px; position:relative; z-index:2;}

.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:18px; position:relative; z-index:2;}

.form-row.full{grid-template-columns:1fr;}

.field label{display:block; font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-1); font-weight:700; margin-bottom:8px;}

.field input, .field select, .field textarea{
    width:100%; background:rgba(244,238,224,0.05); border:1px solid rgba(244,238,224,0.2);
    color:var(--text-light); padding:13px 14px; font-family:var(--sans); font-size:14px;
  }

.field input::placeholder, .field textarea::placeholder{color:rgba(201,190,221,0.5);}

.field input:focus, .field select:focus, .field textarea:focus{outline:2px solid var(--gold-1); outline-offset:1px; border-color:var(--gold-1);}

.field textarea{resize:vertical; min-height:110px;}

.field select{appearance:none; background-image:linear-gradient(45deg, transparent 50%, var(--gold-1) 50%), linear-gradient(135deg, var(--gold-1) 50%, transparent 50%); background-position:calc(100% - 18px) center, calc(100% - 13px) center; background-size:5px 5px, 5px 5px; background-repeat:no-repeat;}

.field select option{background:var(--ink); color:var(--text-light);}

.form-note{font-size:12px; color:rgba(201,190,221,0.65); margin-top:16px; position:relative; z-index:2;}

.booking-main{padding:0 0 130px;}

.service-select{margin-bottom:40px;}

.service-select h2{font-size:14px; letter-spacing:0.1em; text-transform:uppercase; color:var(--purple); margin-bottom:20px; font-family:var(--sans); font-weight:700;}

.service-pills{display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:14px;}

.service-pill{
    border:1.5px solid rgba(90,42,130,0.2); background:var(--paper-2); padding:20px 18px; text-align:left; cursor:pointer;
    transition:all .25s ease;
  }

.service-pill:hover{border-color:var(--purple);}

.service-pill.active{border-color:var(--gold-2); background:linear-gradient(160deg, var(--purple-deep), var(--ink)); color:var(--text-light);}

.service-pill .dir{display:block; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold-2); margin-bottom:8px; font-weight:700;}

.service-pill.active .dir{color:var(--gold-1);}

.service-pill .name{font-family:var(--serif); font-size:16px; color:var(--ink);}

.service-pill.active .name{color:var(--text-light);}

.service-pill:focus-visible{outline:2px solid var(--gold-1); outline-offset:2px;}

.scheduler-panel{
    border:1px solid rgba(90,42,130,0.15); background:var(--paper-2);
    padding:4px; position:relative;
  }

.scheduler-frame{
    width:100%; min-height:680px; border:0; background:var(--paper);
    display:block;
  }

.scheduler-fallback{
    position:absolute; inset:4px; display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; padding:40px; background:var(--paper); gap:16px;
  }

.scheduler-fallback svg{width:44px; height:44px;}

.scheduler-fallback h3{font-size:19px; color:var(--ink);}

.scheduler-fallback p{font-size:14px; color:var(--text-dark-soft); max-width:380px;}

.booking-alt{
    margin-top:60px; padding:44px 40px; background:linear-gradient(150deg, var(--blue-deep), var(--purple-deep));
    color:var(--text-light); display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center;
  }

.booking-alt h3{font-size:21px; margin-bottom:8px; color:var(--text-light);}

.booking-alt p{color:var(--text-light-soft); font-size:14.5px;}

.faq{padding:100px 0 130px; background:var(--paper-2);}

.faq-item{border-top:1px solid rgba(90,42,130,0.15); padding:26px 0;}

.faq-item:last-child{border-bottom:1px solid rgba(90,42,130,0.15);}

.faq-item summary{
    font-family:var(--serif); font-size:18px; color:var(--purple); cursor:pointer; list-style:none;
    display:flex; justify-content:space-between; align-items:center; gap:20px;
  }

.faq-item summary::-webkit-details-marker{display:none;}

.faq-item summary::after{content:"+"; font-size:22px; color:var(--gold-2); font-family:var(--sans); font-weight:400; flex-shrink:0;}

.faq-item[open] summary::after{content:"–";}

.faq-item p{color:var(--text-dark-soft); font-size:14.5px; margin-top:14px; max-width:640px;}

/* ---------- WHATSAPP ---------- */
.whatsapp-float{
  position:fixed; right:26px; bottom:26px; z-index:200;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px rgba(37,211,102,0.45);
  transition:transform .3s ease, box-shadow .3s ease;
  animation:wa-pulse 2.8s ease-in-out infinite;
}
.whatsapp-float svg{width:28px; height:28px;}
.whatsapp-float:hover{transform:scale(1.08) translateY(-2px); box-shadow:0 14px 32px rgba(37,211,102,0.55);}
.whatsapp-float:focus-visible{outline:2px solid var(--gold-1); outline-offset:3px;}
@keyframes wa-pulse{
  0%, 100%{box-shadow:0 10px 26px rgba(37,211,102,0.45);}
  50%{box-shadow:0 10px 26px rgba(37,211,102,0.45), 0 0 0 10px rgba(37,211,102,0.12);}
}
.whatsapp-chip{
  display:inline-flex; align-items:center; gap:10px;
  background:#25D366; color:#fff; padding:12px 22px; font-size:13.5px; font-weight:700;
  transition:transform .25s ease, box-shadow .25s ease;
}
.whatsapp-chip svg{width:18px; height:18px;}
.whatsapp-chip:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(37,211,102,0.35);}

/* ---------- FORM STATUS ---------- */
.form-status{font-size:13.5px; margin-top:14px; min-height:1em;}
.form-status--success{color:#8FD19E;}
.form-status--error{color:#F2A0A0;}

/* ---------- PHOTO GALLERY ---------- */
.gallery{padding:130px 0; background:var(--paper);}
.gallery-grid{
  display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:150px; gap:10px;
}
.gallery-tile{
  position:relative; overflow:hidden; border-radius:4px;
  display:flex; align-items:flex-end; padding:16px;
  transition:transform .4s ease, box-shadow .4s ease;
}
.gallery-tile:hover{transform:scale(1.02); box-shadow:0 16px 30px rgba(28,18,38,0.18); z-index:2;}
.gallery-tile.tall{grid-row:span 2;}
.gallery-tile.wide{grid-column:span 2;}
.gallery-tile::before{
  content:""; position:absolute; inset:0;
  background:var(--tile-grad, linear-gradient(150deg, var(--purple), var(--purple-deep)));
  transition:transform .5s ease;
}
.gallery-tile:hover::before{transform:scale(1.08);}
.gallery-tile-label{
  position:relative; z-index:1; color:var(--text-light); font-size:12.5px; font-weight:700;
  letter-spacing:0.03em; display:flex; align-items:center; gap:8px;
}
.gallery-tile-label svg{width:15px; height:15px; opacity:0.85; flex-shrink:0;}
.gallery-note{font-size:12.5px; color:var(--text-dark-soft); margin-top:18px; text-align:center;}

/* Photo lightbox — full, uncropped view on click */
.gallery-tile--photo{cursor:zoom-in;}
.lightbox-overlay{
  position:fixed; inset:0; z-index:500; background:rgba(10,6,14,0.92);
  display:none; align-items:center; justify-content:center; padding:40px;
  opacity:0; transition:opacity .25s ease;
}
.lightbox-overlay.is-open{display:flex;}
.lightbox-overlay.is-visible{opacity:1;}
.lightbox-image{
  max-width:90vw; max-height:88vh; border-radius:6px;
  box-shadow:0 30px 80px rgba(0,0,0,0.5);
  transform:scale(0.96); transition:transform .25s ease;
}
.lightbox-overlay.is-visible .lightbox-image{transform:scale(1);}
.lightbox-close{
  position:absolute; top:22px; right:28px; z-index:2;
  width:44px; height:44px; border-radius:50%; border:1px solid rgba(244,238,224,0.3);
  background:rgba(244,238,224,0.08); color:var(--text-light); font-size:26px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s ease;
}
.lightbox-close:hover{background:rgba(244,238,224,0.18);}
@media (max-width:720px){
  .lightbox-overlay{padding:20px;}
  .lightbox-close{top:14px; right:14px; width:38px; height:38px; font-size:22px;}
}
.gallery-tile--photo{background-size:cover; background-position:center 50%;}
.gallery-tile--photo::before{content:none;}

/* ---------- MOTION / HOVER POLISH ---------- */
.compass-card, .blog-card, .mv-card, .value-card, .t-card, .service-pill, .expect-panel{
  transition:transform .35s ease, box-shadow .35s ease, background .3s ease, border-color .3s ease;
}
.compass-card:hover{transform:translateY(-4px); box-shadow:0 16px 30px rgba(0,0,0,0.18);}
.blog-card:hover{box-shadow:0 18px 36px rgba(28,18,38,0.12);}
.value-card:hover{transform:translateY(-3px);}
.t-card{transition:transform .35s ease;}
.t-card:hover{transform:translateY(-3px);}
.card-media{overflow:hidden;}
.card-media .card-icon{transition:transform .4s ease;}
.blog-card:hover .card-icon{transform:scale(1.12) translateY(-2px);}
.social-chip, .partner-chip{transition:transform .25s ease, background .25s ease, color .25s ease;}
.social-chip:hover, .partner-chip:hover{transform:translateY(-2px);}
.footer-col a{transition:color .25s ease, transform .25s ease; display:inline-block;}
.footer-col a:hover{transform:translateX(3px);}
@keyframes hero-float{
  0%, 100%{transform:translateY(0);}
  50%{transform:translateY(-10px);}
}
.hero-logo-img{animation:hero-float 6s ease-in-out infinite;}
.brand-mark{transition:transform .3s ease;}
.brand:hover .brand-mark{transform:rotate(8deg) scale(1.06);}

/* ---- Responsive: tablet ---- */
@media (max-width:980px){
  .founder .wrap{grid-template-columns:1fr; gap:40px;}
  .monogram-frame{max-width:260px;}
  .mv-grid{grid-template-columns:1fr;}
  .values-grid{grid-template-columns:1fr 1fr 1fr;}
  .impact-stats{grid-template-columns:1fr 1fr;}
  .footer-top{flex-direction:column;}
  .blog-grid{grid-template-columns:1fr 1fr;}
  .t-grid{grid-template-columns:1fr;}
  .story-grid{grid-template-columns:1fr; gap:30px;}
  .story-frame{max-width:220px;}
  .contact-grid{grid-template-columns:1fr; gap:50px;}
  .gallery-grid{grid-template-columns:1fr 1fr; grid-auto-rows:160px;}
  .gallery-tile.wide{grid-column:span 1;}
}

/* ---- Responsive: @media (prefers-reduced-motion: reduce) ---- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}

/* ---- Responsive: @media (max-width:900px) ---- */
@media (max-width:900px){
  .service-grid{grid-template-columns:1fr; gap:36px;}
  .service-pills{grid-template-columns:1fr 1fr;}
  .booking-alt{grid-template-columns:1fr; text-align:left;}
}

/* ---- Responsive: mobile ---- */
@media (max-width:720px){
  .nav-links{
      position:fixed; top:0; right:0; height:100vh; width:78%; max-width:320px;
      background:var(--ink); flex-direction:column; align-items:flex-start;
      padding:110px 34px 40px; gap:26px;
      transform:translateX(100%); transition:transform .4s ease;
    }
  .nav-links.open{transform:translateX(0);}
  .nav-links a{color:var(--text-light) !important; font-size:16px;}
  .nav-cta{margin-top:10px;}
  .nav-toggle{display:block;}
  .credentials{grid-template-columns:1fr;}
  .compass-grid{grid-template-columns:1fr;}
  .pillar-item{grid-template-columns:40px 1fr;}
  .pillar-node{margin-left:14px;}
  .axis-spine::before{left:20px;}
  .breadcrumb{padding-top:78px;}
  .values-grid{grid-template-columns:1fr;}
  .impact-stats{grid-template-columns:1fr 1fr; gap:24px;}
  .subnav{top:60px;}
  .blog-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .form-panel{padding:36px 26px;}
  .service-pills{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:1fr 1fr; grid-auto-rows:130px;}
}

/* ============================================================
   INNER AXIS — VISUAL REFRESH V2
   Editorial, human-centered presentation layer.
   ============================================================ */
:root{
  --shadow-soft:0 18px 50px rgba(28,18,38,.10);
  --shadow-deep:0 30px 80px rgba(28,18,38,.18);
}

/* Shared editorial page hero */
.page-hero{
  position:relative;
  overflow:hidden;
  min-height:320px;
  display:flex;
  align-items:flex-end;
  padding:46px 0 54px;
  background:
    linear-gradient(90deg,rgba(250,246,238,.98) 0%,rgba(250,246,238,.92) 48%,rgba(250,246,238,.56) 72%,rgba(250,246,238,.22) 100%),
    url('../images/hero-banner.webp') center/cover no-repeat;
}
.page-hero::after{
  content:"";position:absolute;right:6%;top:22%;width:130px;height:130px;
  border:1px solid rgba(90,42,130,.24);border-radius:50%;box-shadow:0 0 0 22px rgba(90,42,130,.035),0 0 0 44px rgba(196,138,0,.035);
}
.page-hero .wrap{position:relative;z-index:1;width:100%;}
.page-hero h1{max-width:780px;font-size:clamp(40px,6vw,72px);line-height:1.03;letter-spacing:-.025em;}
.page-hero p{max-width:650px;font-size:18px;line-height:1.8;}

/* Homepage hero */
.hero{position:relative;overflow:hidden;padding-top:118px;padding-bottom:92px;background:var(--paper);}
.hero>.wrap{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);gap:70px;align-items:center;}
.hero-copy{position:relative;z-index:2;max-width:700px;}
.hero h1{font-size:clamp(48px,6.3vw,84px);line-height:.98;letter-spacing:-.045em;max-width:760px;}
.hero .lede{font-size:17px;line-height:1.85;max-width:660px;}
.hero-visual{min-height:620px;display:flex;align-items:center;justify-content:center;}
.hero-photo-frame{position:relative;width:min(100%,570px);height:650px;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-deep);background:var(--purple-deep);transform:rotate(1deg);}
.hero-photo-frame::before{content:"";position:absolute;inset:16px;border:1px solid rgba(245,197,66,.5);z-index:3;pointer-events:none;}
.hero-photo{width:100%;height:100%;object-fit:cover;object-position:center;display:block;}
.hero-photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,18,38,.02) 20%,rgba(28,18,38,.18) 52%,rgba(28,18,38,.84) 100%);}
.hero-photo-caption{position:absolute;left:38px;right:38px;bottom:36px;color:#fff;z-index:4;}
.hero-photo-caption span{display:block;font-size:11px;letter-spacing:.2em;color:var(--gold-1);font-weight:800;margin-bottom:8px;}
.hero-photo-caption strong{font-family:var(--serif);font-size:30px;font-weight:600;}
.hero-photo-badge{position:absolute;right:-24px;top:62px;z-index:5;width:126px;height:126px;border-radius:50%;background:var(--gold-1);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);transform:rotate(-6deg);}
.hero-photo-badge span{font-family:var(--serif);font-size:34px;font-weight:800;line-height:1;}
.hero-photo-badge small{text-align:center;font-size:10px;line-height:1.25;text-transform:uppercase;letter-spacing:.08em;margin-top:6px;max-width:75px;}

/* Homepage visual story */
.visual-story{padding:130px 0;background:#fff;overflow:hidden;}
.visual-story-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:center;}
.visual-story-copy{max-width:520px;}
.visual-story-copy h2{font-size:clamp(36px,4.3vw,60px);line-height:1.03;letter-spacing:-.03em;}
.visual-story-copy p{font-size:17px;line-height:1.85;color:var(--text-dark-soft);}
.text-link{display:inline-flex;gap:12px;align-items:center;margin-top:20px;color:var(--purple);font-weight:800;text-decoration:none;}
.text-link span{transition:transform .25s ease;}.text-link:hover span{transform:translateX(5px);}
.visual-story-collage{position:relative;min-height:650px;}
.story-image{position:absolute;margin:0;overflow:hidden;border-radius:10px;box-shadow:var(--shadow-deep);background:#ddd;}
.story-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .7s ease;}
.story-image:hover img{transform:scale(1.04);}
.story-image figcaption{position:absolute;left:18px;bottom:16px;color:#fff;font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 10px rgba(0,0,0,.35);}
.story-image--large{left:12%;top:0;width:58%;height:610px;}
.story-image--top{right:0;top:58px;width:34%;height:250px;}
.story-image--bottom{right:5%;bottom:0;width:40%;height:290px;}

/* Image-led service cards */
.compass-card{position:relative;overflow:hidden;min-height:350px;padding:0!important;display:flex;flex-direction:column;justify-content:flex-end;isolation:isolate;background:var(--ink);box-shadow:0 15px 40px rgba(0,0,0,.12);}
.compass-card .compass-media{position:absolute!important;inset:0!important;width:auto!important;height:auto!important;z-index:-2;background-size:cover;background-position:center;transition:transform .7s ease,filter .5s ease;}
.compass-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,18,38,.05) 25%,rgba(28,18,38,.84) 100%);z-index:-1;}
.compass-card:hover .compass-media{transform:scale(1.06);filter:saturate(1.06);}
.compass-card:nth-child(1) .compass-media{background-image:url('../images/founder-florence-2.webp');background-position:center 20%;}
.compass-card:nth-child(2) .compass-media{background-image:url('../images/gallery-portrait.webp');}
.compass-card:nth-child(3) .compass-media{background-image:url('../images/founder-florence.webp');background-position:center 25%;}
.compass-card:nth-child(4) .compass-media{background-image:url('../images/gallery-community.webp');}
.compass-card:nth-child(5) .compass-media{background-image:url('../images/gallery-ministry.webp');background-position:center 20%;}
.compass-card .compass-dir,.compass-card h3,.compass-card p{position:relative;z-index:1;margin-left:28px;margin-right:28px;color:#fff!important;}
.compass-card .compass-dir{margin-bottom:7px!important;color:var(--gold-1)!important;}
.compass-card h3{font-size:27px!important;line-height:1.08;margin-bottom:10px!important;}
.compass-card p{margin-bottom:28px!important;color:rgba(255,255,255,.82)!important;line-height:1.65;}

/* About founder */
.about-founder .wrap{align-items:stretch;}
.founder .monogram-frame{box-shadow:var(--shadow-deep);}
.founder .monogram-frame::after{content:"";position:absolute;inset:18px;border:1px solid rgba(245,197,66,.4);pointer-events:none;}

/* About values become editorial blocks */
.values .value-card,.mv-card{border-radius:10px;box-shadow:0 10px 35px rgba(28,18,38,.05);transition:transform .3s ease,box-shadow .3s ease;}
.values .value-card:hover,.mv-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-soft);}

/* Impact section */
.impact{position:relative;overflow:hidden;}
.impact::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(90,42,130,.08),transparent 45%,rgba(245,197,66,.06));pointer-events:none;}
.impact-stats{position:relative;z-index:1;}

/* Gallery refresh */
.gallery{padding:92px 0 105px;}
.gallery-grid{grid-template-columns:repeat(12,1fr);grid-auto-rows:110px;gap:14px;}
.gallery-tile{grid-column:span 4;grid-row:span 3;border-radius:8px;box-shadow:0 8px 24px rgba(28,18,38,.09);}
.gallery-tile.wide{grid-column:span 6;grid-row:span 4;}
.gallery-tile.tall{grid-row:span 5;}
.gallery-tile--photo{transition:transform .35s ease,box-shadow .35s ease;}
.gallery-tile--photo:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(28,18,38,.18);}
.gallery-tile-label{font-size:12px!important;letter-spacing:.03em;}

/* Services page visual system */
.services-intro{padding:0 0 80px;}
.service-block{position:relative;overflow:hidden;}
.service-block .service-grid{grid-template-columns:minmax(0,1fr) minmax(280px,.72fr);gap:70px;align-items:stretch;}
.service-block .service-grid::after{content:"";display:block;}
.service-block .service-visual{min-height:360px;border-radius:10px;overflow:hidden;box-shadow:var(--shadow-deep);background-size:cover;background-position:center;position:relative;order:2;}
.service-block .service-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,18,38,.02),rgba(28,18,38,.35));}
.service-block .service-content{order:1;}
.service-block:nth-of-type(1) .service-visual{background-image:url('../images/founder-florence-2.webp');background-position:center 20%;}
.service-block:nth-of-type(2) .service-visual{background-image:url('../images/gallery-portrait.webp');}
.service-block:nth-of-type(3) .service-visual{background-image:url('../images/founder-florence.webp');background-position:center 25%;}
.service-block:nth-of-type(4) .service-visual{background-image:url('../images/gallery-community.webp');}
.service-block:nth-of-type(5) .service-visual{background-image:url('../images/gallery-ministry.webp');background-position:center 20%;}
.service-block .expect-panel{align-self:end;}
.service-number{display:inline-flex;width:42px;height:42px;border-radius:50%;align-items:center;justify-content:center;background:rgba(196,138,0,.14);color:var(--gold-2);font-weight:900;margin-bottom:18px;}

/* Contact/booking supporting visuals */
.contact .contact-panel{box-shadow:var(--shadow-soft);}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important;}
}

@media(max-width:1050px){
  .hero>.wrap{grid-template-columns:1fr;gap:45px;}
  .hero-copy{max-width:820px;}
  .hero-visual{min-height:500px;}
  .hero-photo-frame{height:540px;max-width:760px;}
  .visual-story-grid{grid-template-columns:1fr;gap:55px;}
  .visual-story-copy{max-width:760px;}
  .visual-story-collage{max-width:760px;min-height:560px;margin:auto;width:100%;}
  .story-image--large{height:520px;}
  .service-block .service-grid{grid-template-columns:1fr;}
  .service-block .service-visual{order:1;min-height:360px;}
  .service-block .service-content,.service-block .expect-panel{order:2;}
}

@media(max-width:720px){
  .page-hero{min-height:300px;padding:74px 0 48px;background:linear-gradient(180deg,rgba(250,246,238,.90),rgba(250,246,238,.98)),url('../images/hero-banner.webp') center/cover;}
  .page-hero::after{width:80px;height:80px;right:6%;top:15%;}
  .hero{padding-top:96px;padding-bottom:65px;}
  .hero h1{font-size:clamp(43px,14vw,64px);}
  .hero-photo-frame{height:470px;transform:none;}
  .hero-photo-badge{right:14px;top:20px;width:100px;height:100px;}
  .hero-photo-caption{left:28px;right:28px;bottom:28px;}
  .hero-photo-caption strong{font-size:25px;}
  .visual-story{padding:85px 0;}
  .visual-story-collage{min-height:420px;}
  .story-image--large{left:0;width:66%;height:380px;}
  .story-image--top{right:0;width:36%;height:170px;top:30px;}
  .story-image--bottom{right:0;width:42%;height:190px;bottom:0;}
  .gallery-grid{grid-template-columns:1fr 1fr;grid-auto-rows:150px;}
  .gallery-tile,.gallery-tile.wide,.gallery-tile.tall{grid-column:span 1;grid-row:span 2;}
  .gallery-tile.wide{grid-column:span 2;}
  .gallery-tile-label{left:15px;right:15px;bottom:14px;}
  .service-block .service-grid{gap:34px;}
  .service-block .service-visual{min-height:280px;}
}

@media(max-width:480px){
  .hero-photo-frame{height:420px;}
  .hero-photo-badge{width:86px;height:86px;}
  .hero-photo-badge span{font-size:28px;}
  .visual-story-collage{min-height:350px;}
  .story-image--large{height:320px;}
  .story-image--top{height:145px;}
  .story-image--bottom{height:165px;}
  .gallery-grid{grid-template-columns:1fr;grid-auto-rows:190px;}
  .gallery-tile,.gallery-tile.wide,.gallery-tile.tall{grid-column:span 1;grid-row:span 1;}
  .gallery-tile.wide{grid-column:span 1;}
}

/* V2 page-specific intro blocks */
.services-intro{padding:0 0 90px;background:var(--paper);}
.services-intro-grid,.about-intro-grid{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:center;}
.services-intro-copy h2,.about-intro-copy h2{font-size:clamp(34px,4vw,56px);line-height:1.04;max-width:650px;}
.services-intro-copy p,.about-intro-copy p{font-size:17px;line-height:1.85;max-width:650px;color:var(--text-dark-soft);}
.services-intro-visual,.about-intro-visual-image{height:340px;border-radius:10px;overflow:hidden;box-shadow:var(--shadow-deep);}
.services-intro-visual img,.about-intro-visual-image img{width:100%;height:100%;object-fit:cover;display:block;}
.about-intro-visual-image img{object-position:center 25%;}
.about-intro-visual-image img,.services-intro-visual img{object-fit:cover;max-width:100%;}
.impact-note{position:relative;z-index:1;max-width:760px;margin:34px 0 0;color:rgba(255,255,255,.72);font-size:13px;line-height:1.7;}
@media(max-width:760px){
 .services-intro-grid,.about-intro-grid{grid-template-columns:1fr;gap:35px;}
 .services-intro-visual,.about-intro-visual-image{height:260px;}
}

/* ============================================================
   V3 EDITORIAL REFINEMENTS — Resources, Articles, Contact, Booking
   ============================================================ */
.page-hero{overflow:hidden;}
.page-hero::before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-120px;bottom:-190px;background:rgba(90,42,130,.08);filter:blur(2px);}
.page-hero .wrap{position:relative;z-index:2;}

/* Resources */
.blog-card{overflow:hidden;}
.card-media{position:relative;min-height:220px;background:var(--purple-deep);}
.card-media-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s ease;opacity:.92;}
.card-media-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,18,38,.12) 10%,rgba(28,18,38,.78) 100%);}
.blog-card:hover .card-media-image{transform:scale(1.06);}
.card-media .card-icon,.card-media .card-cat{position:relative;z-index:2;}
.card-media .card-icon{margin:52px auto 24px;display:flex;align-items:center;justify-content:center;width:74px;height:74px;border:1px solid rgba(245,197,66,.42);border-radius:50%;background:rgba(28,18,38,.24);backdrop-filter:blur(4px);}
.card-media .card-cat{position:absolute;left:20px;bottom:18px;color:var(--text-light);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;}
.blog-card .card-body{padding:26px 24px 24px;}
.blog-card .card-body h3{font-size:22px;line-height:1.2;}
.blog-card .card-body p{min-height:66px;}

/* Article */
.article-hero{padding:60px 0 70px;background:radial-gradient(ellipse 700px 420px at 90% 0%,rgba(196,138,0,.13),transparent 60%),var(--paper);}
.article-hero-grid{display:grid;grid-template-columns:1fr 240px;gap:60px;align-items:center;}
.article-hero h1{font-size:clamp(36px,5vw,66px);line-height:1.02;max-width:820px;margin:20px 0 22px;}
.article-dek{max-width:700px;color:var(--text-dark-soft);font-size:18px;line-height:1.75;margin-bottom:24px;}
.article-hero-mark{width:210px;height:210px;border:1px solid rgba(90,42,130,.18);border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,rgba(245,197,66,.18),transparent 55%),var(--paper-2);box-shadow:0 20px 55px rgba(28,18,38,.08);transform:rotate(-8deg);}
.article-hero-mark span{font-family:var(--serif);font-size:30px;line-height:.95;text-align:center;color:var(--purple);transform:rotate(8deg);}
.article-media-wrap{margin-top:-10px;}
.article-media--photo{height:480px;border-radius:10px;box-shadow:var(--shadow-deep);}
.article-media--photo img{width:100%;height:100%;object-fit:cover;}
.related-wrap{max-width:820px;margin:0 auto;}
.related-title{font-family:var(--serif);color:var(--ink);font-size:26px;margin-bottom:22px;border-top:1px solid rgba(90,42,130,.12);padding-top:40px;}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.related-card{display:block;padding:22px;background:var(--paper-2);border-radius:7px;transition:transform .25s ease,box-shadow .25s ease;}
.related-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(28,18,38,.08);}
.related-card span{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-2);font-weight:700;}
.related-card h4{color:var(--ink);font-size:18px;margin:8px 0 7px;}
.related-card p{color:var(--text-dark-soft);font-size:13px;line-height:1.55;}

/* Contact */
.contact-side{display:flex;flex-direction:column;}
.contact-visual{height:430px;position:relative;overflow:hidden;border-radius:9px;margin-bottom:42px;box-shadow:var(--shadow-deep);}
.contact-visual img{width:100%;height:100%;object-fit:cover;object-position:center 28%;}
.contact-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(28,18,38,.84) 100%);}
.contact-visual-caption{position:absolute;left:28px;right:28px;bottom:26px;z-index:2;color:var(--text-light);}
.contact-visual-caption .eyebrow{font-size:10px;margin-bottom:10px;}
.contact-visual-caption strong{display:block;font-family:var(--serif);font-size:30px;line-height:1.05;margin-bottom:7px;}
.contact-visual-caption p{font-size:13px;line-height:1.55;color:rgba(244,238,224,.78);max-width:360px;}

/* Booking */
.booking-hero-grid{display:grid;grid-template-columns:1fr 280px;gap:70px;align-items:center;}
.booking-hero-photo{height:300px;border-radius:9px;overflow:hidden;position:relative;box-shadow:var(--shadow-deep);}
.booking-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;}
.booking-hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(28,18,38,.72));}
.booking-hero-photo span{position:absolute;z-index:2;left:20px;bottom:18px;color:var(--text-light);font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;}
.service-select{position:relative;padding-left:56px;}
.step-label{position:absolute;left:0;top:0;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--purple);color:var(--gold-1);font-size:11px;font-weight:800;letter-spacing:.05em;}
.service-select h2{margin-top:3px;}

@media(max-width:900px){
 .article-hero-grid{grid-template-columns:1fr;gap:30px;}
 .article-hero-mark{width:120px;height:120px;}
 .article-hero-mark span{font-size:22px;}
 .related-grid{grid-template-columns:1fr;}
 .booking-hero-grid{grid-template-columns:1fr;gap:35px;}
 .booking-hero-photo{height:340px;max-width:620px;}
}
@media(max-width:720px){
 .card-media{min-height:200px;}
 .article-hero{padding:40px 0 55px;}
 .article-hero-mark{display:none;}
 .article-dek{font-size:16px;}
 .article-media--photo{height:300px;border-radius:7px;}
 .contact-visual{height:360px;}
 .service-select{padding-left:48px;}
 .booking-hero-photo{height:300px;}
}
@media(max-width:480px){
 .card-media .card-icon{margin-top:42px;}
 .contact-visual{height:320px;}
 .article-media--photo{height:240px;}
}

.related-card{overflow:hidden;padding:0;}
.related-card-media{height:150px;overflow:hidden;background:var(--purple-deep);}
.related-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease;}
.related-card:hover .related-card-media img{transform:scale(1.035);}
.related-card-body{padding:22px;}
.related-card:focus-visible{outline:3px solid var(--gold-1);outline-offset:3px;}


/* ============================================================
   V9 MOTION + SCROLL POLISH
   Subtle editorial motion: the site should feel alive while
   remaining calm, professional and accessible.
   ============================================================ */

:root{--header-h:66px;}

/* Give the fixed navigation a little breathing room without the
   oversized blank area that previously appeared above page content. */
main{position:relative;}
header{transition:padding .28s ease, background .28s ease, box-shadow .28s ease, backdrop-filter .28s ease;}
header.scrolled{padding:9px 0;background:rgba(250,246,238,.96);box-shadow:0 8px 24px rgba(28,18,38,.09);}
header.scrolled .brand-mark{transform:scale(.92);transition:transform .28s ease;}

/* Fine scroll progress indicator. */
#scrollProgress{position:fixed;left:0;top:0;height:2px;width:0;background:var(--gold-grad);z-index:300;pointer-events:none;transform-origin:left center;}

/* Page intro rhythm. */
.breadcrumb{padding-top:12px!important;padding-bottom:8px!important;margin-top:0!important;}
.page-hero{padding-top:24px!important;padding-bottom:54px!important;}
.page-hero .wrap>*{max-width:780px;}
.page-hero h1{margin-top:10px!important;margin-bottom:12px!important;}
.page-hero p{margin-top:8px!important;}

/* Richer reveal states. JS activates these when the user reaches them. */
.reveal{will-change:opacity,transform;transition:opacity .72s cubic-bezier(.22,.61,.36,1),transform .72s cubic-bezier(.22,.61,.36,1),filter .72s ease;}
.reveal.motion-left{transform:translate3d(-34px,0,0);}
.reveal.motion-right{transform:translate3d(34px,0,0);}
.reveal.motion-scale{transform:translate3d(0,24px,0) scale(.975);}
.reveal.in{opacity:1;transform:none;filter:none;}

/* Image-led sections gain gentle movement rather than feeling like flat cards. */
.hero-photo-frame,.contact-visual,.booking-hero-photo,.about-intro-visual .about-intro-image,.service-visual{will-change:transform;}
.hero-photo-frame{transition:transform .6s cubic-bezier(.22,.61,.36,1),box-shadow .6s ease;}
.hero-photo-frame:hover{box-shadow:0 28px 65px rgba(28,18,38,.20);}

/* Cards lift as the pointer moves across them. */
.compass-card,.service-block,.value-card,.mv-card,.expect-panel,.t-card,.blog-card,.stat,.pillar-item{transition:transform .38s cubic-bezier(.22,.61,.36,1),box-shadow .38s ease,border-color .38s ease;}
.compass-card:hover,.service-block:hover,.value-card:hover,.mv-card:hover,.expect-panel:hover,.t-card:hover,.blog-card:hover{transform:translateY(-6px);}

/* Gallery gets a restrained editorial zoom. */
.gallery-tile{transition:transform .45s cubic-bezier(.22,.61,.36,1),box-shadow .45s ease;}
.gallery-tile--photo:hover{transform:translateY(-5px) scale(1.012);}

/* Decorative sections should enter with a little depth. */
.section-head,.visual-story-copy,.visual-story-collage{isolation:isolate;}

@media(max-width:720px){
  header.scrolled{padding:7px 0;}
  .breadcrumb{padding-top:8px!important;padding-bottom:5px!important;}
  .page-hero{padding-top:18px!important;padding-bottom:42px!important;}
  .reveal.motion-left,.reveal.motion-right{transform:translate3d(0,24px,0);}
  .compass-card:hover,.service-block:hover,.value-card:hover,.mv-card:hover,.expect-panel:hover,.t-card:hover,.blog-card:hover{transform:none;}
}

@media(prefers-reduced-motion:reduce){
  #scrollProgress{display:none;}
  header,.reveal,.hero-photo-frame,.compass-card,.service-block,.value-card,.mv-card,.expect-panel,.t-card,.blog-card,.gallery-tile{transition:none!important;transform:none!important;}
}

/* ============================================================
   V10 — EDITORIAL SCROLL SCENES
   Makes long pages feel like a guided story rather than a stack
   of static sections. Motion stays restrained and accessible.
   ============================================================ */
.scroll-scene{position:relative;isolation:isolate;}
.scroll-scene::before{content:"";position:absolute;left:0;top:12%;bottom:12%;width:2px;background:linear-gradient(180deg,transparent,rgba(196,138,0,.55),transparent);opacity:0;transform:scaleY(.35);transform-origin:center;transition:opacity .8s ease,transform 1s cubic-bezier(.22,.61,.36,1);pointer-events:none;}
.scroll-scene.scene-active::before{opacity:1;transform:scaleY(1);}
.scroll-scene .section-head,.scroll-scene .visual-story-copy{transition:transform .8s cubic-bezier(.22,.61,.36,1),opacity .8s ease;}
.scroll-scene:not(.scene-active) .section-head{transform:translateY(10px);opacity:.88;}
.scroll-scene.scene-active .section-head{transform:none;opacity:1;}
.scene-grid > *{transition:transform .65s cubic-bezier(.22,.61,.36,1),opacity .65s ease,box-shadow .4s ease;}
.scene-grid > *:nth-child(2){transition-delay:70ms;}
.scene-grid > *:nth-child(3){transition-delay:140ms;}
.scene-grid > *:nth-child(4){transition-delay:210ms;}
.scene-grid > *:nth-child(5){transition-delay:280ms;}
.scene-grid > *:nth-child(6){transition-delay:350ms;}
.scroll-scene:not(.scene-active) .scene-grid > *{transform:translateY(18px);opacity:.82;}
.scroll-scene.scene-active .scene-grid > *{transform:none;opacity:1;}

/* Section transitions: subtle tonal changes create a visual rhythm while scrolling. */
.pillars,.visual-story,.values,.gallery,.blog,.faq{background-image:linear-gradient(180deg,rgba(90,42,130,.018),transparent 18%,transparent 82%,rgba(196,138,0,.018));}
.service-block{overflow:hidden;}
.service-block .service-copy{transition:transform .7s cubic-bezier(.22,.61,.36,1);}
.service-block:not(.scene-active) .service-copy{transform:translateY(12px);}
.service-block.scene-active .service-copy{transform:none;}
.service-block .service-visual{transition:transform .8s cubic-bezier(.22,.61,.36,1),box-shadow .6s ease;}
.service-block:not(.scene-active) .service-visual{transform:scale(.985);}
.service-block.scene-active .service-visual{transform:scale(1);}

/* More tactile photography: image itself moves slightly inside a fixed frame. */
.hero-photo-frame img,.about-intro-visual-image img,.services-intro-visual img,.contact-visual img,.booking-hero-photo img,.service-visual{transition:transform .9s cubic-bezier(.22,.61,.36,1),filter .5s ease;}
.hero-photo-frame:hover img,.about-intro-visual-image:hover img,.services-intro-visual:hover img,.contact-visual:hover img,.booking-hero-photo:hover img{transform:scale(1.025);}

/* Quiet return-to-top control. */
#backToTop{position:fixed;right:26px;bottom:98px;width:42px;height:42px;border:1px solid rgba(90,42,130,.20);border-radius:50%;background:rgba(250,246,238,.94);color:var(--purple);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(28,18,38,.10);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s ease,visibility .25s ease,transform .25s ease,background .25s ease;z-index:190;cursor:pointer;}
#backToTop.is-visible{opacity:1;visibility:visible;transform:none;}
#backToTop:hover{background:var(--paper-2);transform:translateY(-2px);}
#backToTop svg{width:17px;height:17px;}

@media(max-width:720px){
 .scroll-scene::before{display:none;}
 .scroll-scene:not(.scene-active) .section-head{transform:none;opacity:1;}
 .scroll-scene:not(.scene-active) .scene-grid > *{transform:none;opacity:1;}
 #backToTop{right:18px;bottom:88px;width:38px;height:38px;}
}
@media(prefers-reduced-motion:reduce){
 .scroll-scene::before,.scroll-scene .section-head,.scene-grid > *, .service-block .service-copy,.service-block .service-visual,.hero-photo-frame img,.about-intro-visual-image img,.services-intro-visual img,.contact-visual img,.booking-hero-photo img,#backToTop{transition:none!important;transform:none!important;}
 .scroll-scene:not(.scene-active) .section-head,.scroll-scene:not(.scene-active) .scene-grid > *,.service-block:not(.scene-active) .service-copy,.service-block:not(.scene-active) .service-visual{opacity:1;}
}


/* ============================================================
   V11 — VISUAL HIERARCHY + SCROLL STORY
   More movement, clearer chapter changes, tighter vertical rhythm.
   ============================================================ */
html{scroll-behavior:smooth;scroll-padding-top:78px;}

/* Tighten the long-form rhythm without making the pages feel cramped. */
.pillars{padding-top:108px!important;padding-bottom:104px!important;}
.home-intro{padding-top:72px!important;padding-bottom:54px!important;}
.visual-story{padding-top:96px!important;padding-bottom:104px!important;}
.compass{padding-top:108px!important;padding-bottom:104px!important;}
.quote-band{padding-top:82px!important;padding-bottom:82px!important;}
.contact{padding-top:104px!important;padding-bottom:104px!important;}
.founder{padding-top:94px!important;padding-bottom:94px!important;}
.mv{padding-top:108px!important;padding-bottom:108px!important;}
.impact{padding-top:104px!important;padding-bottom:104px!important;}
.gallery{padding-top:96px!important;padding-bottom:104px!important;}
.service-block{padding-top:88px!important;padding-bottom:88px!important;}
.blog{padding-bottom:104px!important;}
.testimonials,.story{padding-top:104px!important;padding-bottom:104px!important;}
.cta-band{padding-top:88px!important;padding-bottom:88px!important;}

/* A section heading now has a small visual completion line that grows
   when its chapter becomes active. */
.scroll-scene .section-head{position:relative;padding-bottom:14px;}
.scroll-scene .section-head::after{content:"";display:block;width:34px;height:2px;margin-top:18px;background:var(--gold-grad);transform:scaleX(.25);transform-origin:left center;opacity:.35;transition:transform .8s cubic-bezier(.22,.61,.36,1),opacity .6s ease,width .8s ease;}
.scroll-scene.scene-active .section-head::after{width:72px;transform:scaleX(1);opacity:1;}

/* Service cards feel like visual chapters rather than static tiles. */
.compass-card{transition:transform .5s cubic-bezier(.22,.61,.36,1),box-shadow .5s ease,filter .5s ease;}
.compass-card::before{content:attr(data-index);position:absolute;top:20px;right:20px;z-index:3;width:32px;height:32px;border:1px solid rgba(244,238,224,.28);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold-1);font-size:10px;font-weight:800;letter-spacing:.08em;background:rgba(28,18,38,.22);backdrop-filter:blur(5px);opacity:.82;}
.compass-card:hover{transform:translateY(-9px);filter:saturate(1.03);}

/* Visual-story collage gets a little editorial depth as the chapter activates. */
.scroll-scene.scene-active .visual-story-collage .story-image--large{transform:translate3d(0,-5px,0);}
.scroll-scene.scene-active .visual-story-collage .story-image--top{transform:translate3d(5px,-7px,0);}
.scroll-scene.scene-active .visual-story-collage .story-image--bottom{transform:translate3d(-5px,5px,0);}
.visual-story-collage .story-image{transition:transform .9s cubic-bezier(.22,.61,.36,1),box-shadow .6s ease;}

/* Hero has a quiet invitation to continue. */
.hero{position:relative;}
.hero-scroll-cue{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:7px;color:var(--purple);font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;opacity:.68;z-index:4;transition:opacity .3s ease,transform .3s ease;}
.hero-scroll-cue i{display:block;width:1px;height:28px;background:linear-gradient(var(--gold-1),transparent);position:relative;}
.hero-scroll-cue i::after{content:"";position:absolute;top:0;left:-2px;width:5px;height:5px;border-radius:50%;background:var(--gold-1);animation:heroCue 1.8s ease-in-out infinite;}
.hero-scroll-cue.is-hidden{opacity:0;transform:translate(-50%,8px);pointer-events:none;}
@keyframes heroCue{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(18px);opacity:1}}

/* Anchor targets never disappear under the fixed navigation. */
[id]{scroll-margin-top:82px;}

@media(max-width:720px){
  .pillars{padding-top:78px!important;padding-bottom:78px!important;}
  .home-intro{padding-top:54px!important;padding-bottom:42px!important;}
  .visual-story{padding-top:76px!important;padding-bottom:80px!important;}
  .compass{padding-top:82px!important;padding-bottom:80px!important;}
  .quote-band,.contact,.founder,.mv,.impact,.gallery,.testimonials,.story{padding-top:78px!important;padding-bottom:78px!important;}
  .service-block{padding-top:68px!important;padding-bottom:68px!important;}
  .cta-band{padding-top:68px!important;padding-bottom:68px!important;}
  .hero-scroll-cue{bottom:16px;font-size:8px;}
  .scroll-scene .section-head::after{margin-top:14px;}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .hero-scroll-cue{display:none;}
  .scroll-scene .section-head::after,.visual-story-collage .story-image{transition:none!important;transform:none!important;}
}
.scroll-scene.scene-near .section-head{opacity:1;}

/* ============================================================
   V12 — EDITORIAL MOTION + SCROLL NAVIGATION
   The site should feel responsive to the visitor, not animated for
   animation's sake. These effects are deliberately restrained.
   ============================================================ */

/* A fine reading-progress rail at the very top of the viewport. */
#scrollProgress{
  position:fixed;left:0;top:0;width:100%;height:2px;z-index:260;
  pointer-events:none;background:transparent;overflow:hidden;
}
#scrollProgress span{
  display:block;width:100%;height:100%;transform-origin:left center;transform:scaleX(0);
  background:var(--gold-grad);box-shadow:0 0 8px rgba(245,197,66,.28);
}

/* A quiet page-level depth cue. */
header.scrolled::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(196,138,0,.24),transparent);
}

/* Make section entry feel intentional rather than abrupt. */
.scroll-scene .section-head{transition:opacity .7s ease,transform .75s cubic-bezier(.22,.61,.36,1);}
.scroll-scene:not(.scene-near) .section-head{transform:translateY(10px);opacity:.82;}
.scroll-scene.scene-active .section-head{transform:none;opacity:1;}

/* Interactive image treatment: frame stays still; image breathes inside it. */
.gallery-tile,.service-visual,.about-intro-visual-image,.services-intro-visual,.contact-visual,.booking-hero-photo,.story-image{
  overflow:hidden;
}
.gallery-tile img,.service-visual img,.about-intro-visual-image img,.services-intro-visual img,.contact-visual img,.booking-hero-photo img,.story-image img{
  transition:transform .8s cubic-bezier(.22,.61,.36,1),filter .6s ease;
}
.gallery-tile:hover img,.service-block:hover .service-visual img,.about-intro-visual-image:hover img,.services-intro-visual:hover img,.contact-visual:hover img,.booking-hero-photo:hover img,.story-image:hover img{
  transform:scale(1.035);
  filter:saturate(1.04);
}

/* Cards get a more physical response without large movement. */
.value-card,.mv-card,.t-card,.blog-card,.expect-panel,.compass-card{
  transition:transform .38s cubic-bezier(.22,.61,.36,1),box-shadow .38s ease,border-color .38s ease;
}
.value-card:hover,.mv-card:hover,.t-card:hover,.blog-card:hover,.expect-panel:hover{
  transform:translateY(-5px);
}

/* Homepage service blocks read as chapters. */
.service-block{position:relative;}
.service-block::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1px;
  background:var(--gold-grad);transition:width .75s cubic-bezier(.22,.61,.36,1);
}
.service-block.scene-active::after{width:100%;}

@media(max-width:720px){
  #scrollProgress{height:2px;}
  .gallery-tile:hover img,.service-block:hover .service-visual img,.about-intro-visual-image:hover img,.services-intro-visual:hover img,.contact-visual:hover img,.booking-hero-photo:hover img,.story-image:hover img{transform:none;filter:none;}
  .value-card:hover,.mv-card:hover,.t-card:hover,.blog-card:hover,.expect-panel:hover{transform:none;}
}

@media(prefers-reduced-motion:reduce){
  #scrollProgress span{transition:none!important;}
  .gallery-tile img,.service-visual img,.about-intro-visual-image img,.services-intro-visual img,.contact-visual img,.booking-hero-photo img,.story-image img,.scroll-scene .section-head,.value-card,.mv-card,.t-card,.blog-card,.expect-panel,.compass-card,.service-block::after{transition:none!important;transform:none!important;}
}


/* ============================================================
   V13 — EDITORIAL HIERARCHY + FINISHING POLISH
   Clearer visual chapters, quieter chrome and stronger transitions.
   ============================================================ */

/* Chapter markers use the existing data-chapter values added by JS.
   They stay secondary to the content and disappear on small screens. */
@media(min-width:981px){
  .home-intro.scroll-scene::after,
  .visual-story.scroll-scene::after,
  .pillars.scroll-scene::after,
  .compass.scroll-scene::after,
  .quote-band.scroll-scene::after,
  .contact.scroll-scene::after{
    content:attr(data-chapter);
    position:absolute;
    top:34px;
    right:max(24px, calc((100vw - 1180px)/2));
    font-size:10px;
    letter-spacing:.18em;
    font-weight:800;
    color:rgba(90,42,130,.42);
    font-family:var(--sans);
  }
  .founder.scroll-scene::after,
  .mv.scroll-scene::after,
  .impact.scroll-scene::after,
  .gallery.scroll-scene::after,
  .testimonials.scroll-scene::after,
  .story.scroll-scene::after,
  .cta-band.scroll-scene::after{
    content:attr(data-chapter);
    position:absolute;
    top:34px;
    right:max(24px, calc((100vw - 1180px)/2));
    font-size:10px;
    letter-spacing:.18em;
    font-weight:800;
    color:rgba(244,238,224,.38);
    font-family:var(--sans);
  }
}

/* Give the homepage's major visual chapters a slightly more confident
   opening/closing rhythm without increasing the overall page length. */
.home-intro .section-head h2,
.visual-story .section-head h2,
.pillars .section-head h2,
.compass .section-head h2{
  text-wrap:balance;
}

/* Prevent decorative scene lines from competing with photographs. */
.scroll-scene::before{mix-blend-mode:multiply;}
.founder.scroll-scene::before,
.cta-band.scroll-scene::before,
.service-block.scroll-scene::before{mix-blend-mode:screen;}

/* Header becomes a little more compact after the first scroll. */
@media(min-width:981px){
  header.scrolled .nav{min-height:46px;}
  header.scrolled .brand-text b{font-size:17px;}
  header.scrolled .brand-text span{font-size:10px;}
}

/* Keep touch devices calm: no hover-induced movement after a tap. */
@media (hover:none){
  .brand:hover .brand-mark{transform:none;}
  .gallery-tile:hover,.compass-card:hover{transform:none;}
}

@media(prefers-reduced-motion:reduce){
  .scroll-scene::after{transition:none!important;}
}


/* ============================================================
   V14 — SERVICE NAVIGATION
   A quiet active state helps visitors keep their place in the
   five-part service journey without adding visual noise.
   ============================================================ */
.subnav a{position:relative;transition:color .25s ease,opacity .25s ease;}
.subnav a::after{content:"";position:absolute;left:0;right:0;bottom:-16px;height:2px;background:var(--gold-2);transform:scaleX(0);transform-origin:center;transition:transform .25s ease;}
.subnav a.is-active{color:var(--purple);}
.subnav a.is-active::after{transform:scaleX(1);}
@media(max-width:700px){
  .subnav-inner{gap:24px;padding-left:4px;padding-right:4px;}
  .subnav a::after{bottom:-14px;}
}
@media(prefers-reduced-motion:reduce){.subnav a{transition:none!important}.subnav a::after{transition:none!important;}}


/* ============================================================
   V15 — ACCESSIBILITY + PERFORMANCE POLISH
   ============================================================ */
.skip-link{position:fixed;left:18px;top:12px;z-index:9999;transform:translateY(-180%);padding:10px 14px;border-radius:999px;background:var(--purple-deep);color:#fff;font:700 12px/1 var(--sans);letter-spacing:.04em;box-shadow:0 10px 30px rgba(0,0,0,.18);transition:transform .2s ease;}
.skip-link:focus{transform:translateY(0);outline:3px solid var(--gold-1);outline-offset:3px;}
main[tabindex="-1"]:focus{outline:none;}
:focus-visible{outline:2px solid var(--gold-1);outline-offset:4px;}
img{content-visibility:auto;}
@media(prefers-reduced-motion:reduce){.skip-link{transition:none!important;}}


/* ============================================================
   V16 — SERVICE INDEX + MARKUP POLISH
   ============================================================ */
.subnav{box-shadow:0 5px 18px rgba(31,18,44,.035);}
.subnav-inner{scrollbar-width:none;position:relative;}
.subnav-inner::-webkit-scrollbar{display:none;}
@media(max-width:700px){
  .subnav{overflow:hidden;}
  .subnav::after{content:"";position:absolute;top:0;right:0;width:34px;height:100%;pointer-events:none;background:linear-gradient(90deg,rgba(250,246,238,0),rgba(250,246,238,.98));}
  .subnav-inner{padding-right:42px;-webkit-overflow-scrolling:touch;}
}
.service-block .service-content h2{text-wrap:balance;}
.service-block .expect-panel{transition:transform .28s ease,box-shadow .28s ease;}
@media(hover:hover) and (min-width:901px){.service-block .expect-panel:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(31,18,44,.10);}}
@media(prefers-reduced-motion:reduce){.service-block .expect-panel{transition:none!important;}}


/* V20 responsive editorial refinements */
@media (max-width:900px){
  .blog-card--featured{grid-column:1/-1;grid-template-columns:1fr;}
  .blog-card--featured .card-media{min-height:280px;}
}
@media (max-width:720px){
  .blog-card--featured{display:flex;}
  .blog-card--featured .card-media{height:220px;min-height:220px;}
  .blog-card--featured .card-body{padding:26px 24px 28px;}
  .blog-card--featured .card-body h3{font-size:24px;}
  .article-media--photo{height:300px;}
}
@media (max-width:480px){
  .article-media--photo{height:230px;}
}


/* V21: signature service positioning and compact desktop navigation */
.signature-services .compass-card{min-height:330px;padding:34px 30px;}
.signature-services .compass-card h3{max-width:310px;}
.signature-services .compass-card p{max-width:360px;}
@media (min-width:721px) and (max-width:1120px){
  .nav-links{gap:12px;}
  .nav-links a{font-size:11.5px;letter-spacing:0;}
  .brand-text b{font-size:18px;}
  .brand-text span{font-size:11px;}
}

.booking-service-note,.form-privacy-note{font-size:13px;line-height:1.7;color:var(--text-dark-soft);margin-top:16px;}
.booking-service-note a,.form-privacy-note a{color:var(--purple);font-weight:700;text-decoration:underline;text-underline-offset:3px;}


@media (min-width:721px) and (max-width:900px){
  .nav-links{position:fixed;top:0;right:0;height:100vh;width:78%;max-width:320px;background:var(--ink);flex-direction:column;align-items:flex-start;padding:100px 30px 40px;gap:22px;transform:translateX(100%);transition:transform .35s ease;z-index:1001;overflow-y:auto;}
  .nav-links.open{transform:translateX(0);}
  .nav-links a{color:var(--text-light)!important;font-size:15px;}
  .nav-cta{margin-top:8px;}
  .nav-toggle{display:block;position:relative;z-index:1002;}
}