/* MHJC Modern 2.0 — visual layer. Loads after style.css; markup and content unchanged. */
@view-transition{ navigation:auto; }
@property --a{ syntax:'<angle>'; inherits:false; initial-value:0deg; }
:root{
  --ink:#0e1512; --paper:#f1f5ef; --card:#fff; --gold:#f2d98b;
  --forest-dark:#0f2418; --ease:cubic-bezier(.2,.8,.2,1);
}
html[data-theme="dark"]{
  --ink:#e6ede4; --paper:#0b120f; --card:#141d18; --line:rgba(230,237,228,.14); --stone:#9aa89b;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ font-family:'Figtree','Work Sans',sans-serif; background-color:var(--paper); }
html[data-theme="dark"] body{ background-image:none; }
h1,h2,h3,.brand-text .name,.foot-name{ font-family:'Bricolage Grotesque','Fraunces',sans-serif; letter-spacing:-.025em; font-weight:700; }
h1,h2,h3{ color:var(--forest-dark); }
html[data-theme="dark"] :is(h1,h2,h3,.brand-text .name,.principal-name,.entry-content strong){ color:var(--ink); }
:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; border-radius:6px; }

/* Glass header */
header.main{ background:color-mix(in srgb,var(--paper) 74%,transparent); -webkit-backdrop-filter:blur(18px) saturate(1.5); backdrop-filter:blur(18px) saturate(1.5); }
.brand-mark{ box-shadow:0 0 0 3px var(--paper),0 0 0 4px var(--line),0 6px 16px rgba(0,0,0,.25); }
.brand:hover .brand-mark img{ transform:rotate(90deg); }
.brand-mark img{ transition:transform .7s var(--ease); }
.nav-band li.nav-item > a{ letter-spacing:.02em; text-transform:none; font-size:.95rem; }
.cta-mhol,.cta-library,.cta-portal,.btn{ border-radius:999px; transition:transform .25s var(--ease),background .2s,box-shadow .25s; }
.cta-portal:hover,.cta-library:hover,.btn:hover{ box-shadow:0 10px 24px rgba(0,0,0,.22); }
.utility{ background:#070c0a; }
.theme-toggle{ background:none; border:0; color:#e9ede6; cursor:pointer; display:flex; padding:0; opacity:.85; }
.theme-toggle:hover{ opacity:1; }
.theme-toggle .sun{ display:none; } html[data-theme="dark"] .theme-toggle .sun{ display:block; } html[data-theme="dark"] .theme-toggle .moon{ display:none; }

/* Hero */
.hero{ min-height:min(88vh,860px); display:flex; align-items:flex-end; }
.hero-slide{ inset:-70px 0; translate:0 calc(var(--py,0)*1px); background-position:center 40%; }
.hero-overlay{ background:radial-gradient(90% 70% at 15% 100%,rgba(23,105,42,.45),transparent 60%),radial-gradient(70% 60% at 90% 10%,rgba(26,99,176,.32),transparent 60%),linear-gradient(180deg,rgba(7,12,10,.55),rgba(7,12,10,.25) 40%,rgba(7,12,10,.88)); }
.hero-inner{ width:100%; padding:120px 0 96px; }
.hero h1{ color:#fff; font-size:clamp(2.5rem,5.4vw,4.75rem); line-height:1.02; max-width:13ch; text-wrap:balance; }
.hero p.lede{ font-size:1.2rem; max-width:44ch; }
.btn-primary{ background:var(--gold); color:#10200f; } .btn-primary:hover{ background:#fff; }
.btn-outline{ -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); background:rgba(255,255,255,.08); }
.visit-chip{ background:rgba(255,255,255,.14); color:#fff; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.28); animation:none; }
.visit-chip strong{ color:var(--gold); } .visit-chip svg{ color:var(--gold); }
.hero h1 .w{ display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.1em; margin-right:.22em; }
.hero h1 .w > span{ display:inline-block; }
html.js:not(.ready) .hero h1 .w > span{ transform:translateY(112%); }
html.js .hero h1 .w > span{ transition:transform 1s var(--ease) calc(var(--i)*90ms); }
html.js:not(.ready) :is(.hero .lede,.hero-actions,.visit-chip){ opacity:0; transform:translateY(16px); }
html.js :is(.hero .lede,.hero-actions,.visit-chip){ transition:opacity .9s var(--ease),transform .9s var(--ease); }
html.js .hero .lede{ transition-delay:.45s; } html.js .hero-actions{ transition-delay:.6s; } html.js .visit-chip{ transition-delay:.75s; }

/* Sections */
.section-head h2{ font-size:clamp(1.9rem,4vw,3rem); line-height:1.05; }
.video-wrap{ overflow:visible; border-radius:24px; isolation:isolate; box-shadow:none; max-width:920px; }
.video-wrap::before{ content:""; position:absolute; inset:-3px; border-radius:27px; z-index:-1; background:conic-gradient(from var(--a),var(--wc-coast),var(--wc-forest),var(--wc-water),var(--wc-mountains),var(--wc-coast)); animation:spin 7s linear infinite; filter:drop-shadow(0 18px 34px rgba(0,0,0,.28)); }
.video-wrap iframe{ border-radius:24px; }
@keyframes spin{ to{ --a:360deg; } }
.whanau-grid{ max-width:1000px; perspective:900px; }
.whanau-card{ border-radius:18px; transform:rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)); transition:transform .25s ease,box-shadow .25s; will-change:transform; }
.whanau-card:hover{ transform:rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)) translateY(-8px) scale(1.02); }
.whanau-caption{ border-radius:999px; animation:none; transition:transform .25s var(--ease),filter .2s; }
.whanau-caption:hover{ transform:translateY(-2px); filter:brightness(1.1); }
html.js .whanau-item .whanau-card{ clip-path:inset(0 0 100% 0 round 18px); transition:clip-path 1.2s var(--ease) calc(var(--i)*150ms),transform .25s ease,box-shadow .25s; }
html.js .whanau-item.in .whanau-card{ clip-path:inset(-40px -40px -40px -40px round 18px); }
.principal-photo{ border-radius:28px 140px 28px 28px; outline:1px solid var(--line); outline-offset:10px; }
.principal-message p{ color:var(--ink); }
.feature-card,.ql-item{ background:var(--card); border-radius:24px; position:relative; overflow:hidden; }
.feature-card::after,.ql-item::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .3s; background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--gold) 38%,transparent),transparent 65%); }
.feature-card:hover::after,.ql-item:hover::after{ opacity:1; }
.fc-accent{ height:5px; background:linear-gradient(90deg,var(--wc-coast),var(--wc-forest),var(--wc-water),var(--wc-mountains)) !important; }
.ql-item{ border-radius:999px; text-align:center; padding:18px; transition:transform .25s var(--ease),border-color .2s; }
.ql-item:hover{ transform:translateY(-4px); }
.dropdown,.page-sidebar .widget{ background:var(--card); }
.dropdown li a{ background:var(--paper); color:var(--ink); }
footer.site-footer-modern{ background:#070c0a; border-top:4px solid; border-image:linear-gradient(90deg,var(--wc-coast),var(--wc-forest),var(--wc-water),var(--wc-mountains)) 1; }
.page-hero h1{ font-size:clamp(2.2rem,5vw,3.6rem); line-height:1.02; }

/* Koru scroll-progress button */
.koru-top{ position:fixed; right:22px; bottom:22px; z-index:60; width:58px; height:58px; border-radius:50%; border:0; cursor:pointer; background:#070c0a; box-shadow:0 10px 26px rgba(0,0,0,.35); opacity:0; transform:scale(.6) rotate(-90deg); transition:opacity .3s,transform .5s var(--ease); pointer-events:none; }
.koru-top.show{ opacity:1; transform:none; pointer-events:auto; }
.koru-top svg{ width:100%; height:100%; }
.koru-top .k-track{ stroke:rgba(255,255,255,.16); } .koru-top .k-bar{ stroke:var(--gold); }

/* Koru intro */
#koru-intro{ position:fixed; inset:0; z-index:9999; display:none; place-items:center; background:radial-gradient(circle at 50% 42%,#16241c,#060a08 70%); transition:background .8s .1s,opacity .5s; }
html.koru-play #koru-intro{ display:grid; }
html.koru-play:not(.koru-done){ overflow:hidden; }
#koru-intro.landing{ background:transparent; }
#koru-intro.gone{ opacity:0; pointer-events:none; }
#koru-svg{ width:min(58vmin,360px); height:auto; overflow:visible; }
#koru-intro .k-name{ position:absolute; top:calc(50% + min(34vmin,210px)); color:var(--gold); font:600 1.1rem 'Bricolage Grotesque',sans-serif; letter-spacing:.02em; opacity:0; transition:opacity .8s; }
#koru-intro.named .k-name{ opacity:1; } #koru-intro.landing .k-name{ opacity:0; }
#koru-skip{ position:absolute; bottom:28px; right:28px; background:none; border:1px solid rgba(255,255,255,.3); color:#fff; border-radius:999px; padding:8px 18px; font:inherit; cursor:pointer; }
#koru-skip:hover{ background:rgba(255,255,255,.12); }

@media (max-width:980px){ .hero{ min-height:80vh; } .hero-inner{ padding:80px 0 64px; } .koru-top{ right:14px; bottom:14px; } }
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .video-wrap::before{ animation:none; }
  html.js .whanau-item .whanau-card{ clip-path:none; }
  html.js .hero h1 .w > span,html.js :is(.hero .lede,.hero-actions,.visit-chip){ transition:none; transform:none !important; opacity:1 !important; }
  .hero-slide{ translate:none; }
}
