/* ===== Kohana. site sections (design tokens come from base.css; FV from fv.css) ===== */
:root{--fs-h2:clamp(1.6rem,1.15rem + 1.5vw,2.2rem);--fs-h3:clamp(1.2rem,1.1rem + .4vw,1.35rem);--fs-body:1rem;--ma-3:16px;--ma-4:24px;--ma-5:32px;--ma-6:56px;--sec:88px;--pad:20px;--shadow:0 8px 24px rgba(120,80,50,.10)}
@media(min-width:37.5em){:root{--pad:40px;--sec:120px;--ma-4:28px;--ma-5:40px;--ma-6:64px}}
@media(min-width:64em){:root{--fs-body:1.0625rem;--sec:160px;--ma-3:24px;--ma-4:32px;--ma-5:48px;--ma-6:80px}}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
[id]{scroll-margin-top:calc(var(--hh) + 12px)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:100%;max-width:1240px;margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:var(--sec);position:relative}
.bg-washi{background:var(--washi)}.bg-ivory{background:var(--ivory)}.bg-sakura{background:var(--sakura)}.bg-blush{background:var(--blush)}.bg-shiro{background:var(--shiro)}
.sec-head{margin-bottom:var(--ma-5)}
.sec-head.c{text-align:center}.sec-head.c .lead{margin-inline:auto}
.orn{display:block;width:60px;height:auto;aspect-ratio:325/266;margin:0 0 14px -4px;pointer-events:none}
.c .orn,.orn.c{margin-inline:auto}
.kicker{font:500 13px/1.6 var(--serif);letter-spacing:.28em;color:var(--gold-ink);text-transform:uppercase;margin-bottom:10px}
.on-blush .kicker,.bg-blush .kicker{color:#5E4818}
h2{font:500 var(--fs-h2)/1.55 var(--serif);letter-spacing:.04em;color:var(--sumi);font-feature-settings:"palt";overflow-wrap:anywhere}
h3{font:500 var(--fs-h3)/1.6 var(--serif);letter-spacing:.04em;color:var(--sumi)}
.lead{font-size:var(--fs-body);line-height:1.95;color:var(--cocoa);margin-top:var(--ma-3);max-width:36em;letter-spacing:.05em}
.txt p{font-size:var(--fs-body);line-height:2;letter-spacing:.05em;color:var(--cocoa-ink);max-width:36em}
.txt p+p{margin-top:1.1em}
.fine{font-size:13px;line-height:1.8;color:var(--cocoa);letter-spacing:.04em}
.ph-r{display:block;width:100%;height:auto;border-radius:24px;object-fit:cover}
.btn-sub{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 24px;border-radius:999px;border:1px solid var(--cta);color:var(--cta);text-decoration:none;font-weight:500;letter-spacing:.06em;text-align:center;line-height:1.6;transition:background-color .15s linear,color .15s linear}
.btn-sub:hover{background:var(--cta);color:var(--shiro)}
.btn-sub svg{width:1em;height:1em;flex:none}
.cta svg{flex:none}
.cta.cta-m{width:auto;max-width:100%;white-space:normal;text-align:center;justify-content:center;min-height:56px;padding:10px 32px;font-size:17px;line-height:1.6}
@media(min-width:64em){.cta.cta-m{min-height:64px;padding-inline:40px;font-size:18px}}
.card{background:var(--shiro);border:1px solid rgba(176,138,62,.3);border-radius:24px;box-shadow:var(--shadow)}
/* reveal (JS adds .js; without JS everything is visible) */
/* Reveal only: controls/header/FV animations retain their existing timings. */
.js .rv{--reveal-fade:1.05s;opacity:0;transform:translateY(12px);transition:opacity var(--reveal-fade) cubic-bezier(.25,.1,.25,1),transform 1.15s var(--ease);transition-delay:var(--reveal-delay,0ms)}
.js .rv.rv-photo{--reveal-fade:1.35s}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}
/* about */
.about-grid{display:grid;gap:var(--ma-5);align-items:center}
@media(min-width:64em){.about-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(48px,7vw,104px)}}
.about-grid .ph-r{aspect-ratio:4/3}
/* counselor */
.cou-grid{display:grid;gap:var(--ma-5);align-items:center}
@media(min-width:64em){.cou-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(48px,7vw,104px)}}
.oval{width:min(78%,340px);aspect-ratio:4/5;border-radius:50%;overflow:hidden;border:2px solid rgba(255,253,248,.95);outline:1px solid rgba(176,138,62,.5);outline-offset:9px;box-shadow:var(--shadow);margin:9px auto}
@media(min-width:64em){.oval{width:min(100%,400px);margin:9px 0 9px auto}}
.oval img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.name-en{font:400 italic 1.05rem/1.4 var(--serif);letter-spacing:.14em;color:var(--gold-ink)}
.name{font:500 clamp(1.5rem,1.2rem + 1.2vw,2rem)/1.5 var(--serif);letter-spacing:.08em;margin-top:2px}
.quote{font:500 clamp(1.2rem,1.05rem + .7vw,1.55rem)/1.8 var(--serif);letter-spacing:.05em;color:var(--sumi);margin:var(--ma-4) 0 var(--ma-3);padding-left:1.1em;border-left:1px solid rgba(176,138,62,.6)}
.prof{display:grid;grid-template-columns:1fr;gap:0;margin-top:var(--ma-4);border-top:1px solid rgba(176,138,62,.3)}
.prof div{display:grid;gap:2px 20px;padding:12px 0;border-bottom:1px solid rgba(176,138,62,.3)}
@media(min-width:37.5em){.prof div{grid-template-columns:8em 1fr}}
.prof dt{font-size:14px;color:var(--gold-ink);letter-spacing:.1em;font-weight:500}
.prof dd{font-size:var(--fs-body);color:var(--cocoa-ink);line-height:1.8}
.more{margin-top:var(--ma-3)}
.more summary,.q summary{list-style:none;cursor:pointer}
.more summary::-webkit-details-marker,.q summary::-webkit-details-marker{display:none}
.more summary{position:relative;display:inline-flex;align-items:center;min-height:48px;gap:8px;color:var(--cocoa-ink);font-size:15px;letter-spacing:.06em;text-decoration:underline;text-underline-offset:4px}
.more summary::after{content:"＋";text-decoration:none}
.more[open] summary::after{content:"－"}
.more .txt{margin-top:8px}
/* support */
.cards4{display:grid;gap:var(--ma-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,236px),1fr));list-style:none;padding:0}
.cards4 li{overflow:hidden;display:flex;flex-direction:column}
.cards4 img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.cards4 .b{padding:20px 22px 26px}
.cards4 h3{font-size:1.15rem}
.cards4 p{font-size:15px;line-height:1.9;color:var(--cocoa);margin-top:8px;letter-spacing:.04em}
.link-arrow{display:inline-flex;align-items:center;min-height:48px;margin-top:var(--ma-4);color:var(--cocoa-ink);font-size:16px;letter-spacing:.08em;text-decoration:underline;text-underline-offset:5px;text-decoration-color:rgba(117,90,34,.6)}
/* band + quote */
.band img{display:block;width:100%;height:clamp(240px,36vw,480px);object-fit:cover;object-position:50% 58%}
.band-q{padding-block:var(--ma-6) 0;text-align:center}
.band-q p.big{font:500 clamp(1.35rem,1.05rem + 1.5vw,2.1rem)/1.8 var(--serif);letter-spacing:.06em;color:var(--sumi);overflow-wrap:anywhere}
.band-sec{padding-bottom:var(--sec)}
/* flow */
.steps{display:grid;gap:var(--ma-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));list-style:none;padding:0;counter-reset:s}
.steps li{padding:24px 26px 28px}
.steps .n{font:400 1.7rem/1 var(--serif);color:var(--gold-ink);letter-spacing:.08em;display:flex;align-items:center;gap:14px}
.steps .n::after{content:"";flex:1;height:1px;background:rgba(176,138,62,.45)}
.steps h3{margin-top:14px}
.steps p{font-size:15px;line-height:1.9;color:var(--cocoa);margin-top:6px}
.steps-note{margin-top:var(--ma-4)}
/* mid cta */
.mid{text-align:center}
.mid .lead{margin-inline:auto}
.mid .cta-wrap2{margin-top:var(--ma-5)}
/* plan */
.price3{display:grid;gap:var(--ma-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));list-style:none;padding:0}
.price3 li{padding:28px 26px 30px;display:flex;flex-direction:column;gap:6px}
.price3 .l{font-size:15px;letter-spacing:.14em;color:var(--gold-ink);font-weight:500}
.price{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 4px;font-family:var(--serif);color:var(--sumi)}
.price .num{font-size:clamp(2rem,1.6rem + 1.4vw,2.6rem);line-height:1.3;letter-spacing:.02em;font-weight:500}
.price .yen{font-size:1.2rem}
.price .tax{font-size:14px;color:var(--cocoa);margin-left:4px}
.price .per{font-size:1rem;color:var(--cocoa)}
.terms{margin-top:var(--ma-5);border-top:1px solid rgba(176,138,62,.35);max-width:960px}
.terms div{display:grid;gap:4px 28px;padding:16px 0;border-bottom:1px solid rgba(176,138,62,.35)}
@media(min-width:48em){.terms div{grid-template-columns:11em 1fr}}
.terms dt{font-weight:500;color:var(--gold-ink);letter-spacing:.08em;font-size:15px}
.terms dd{font-size:15px;line-height:1.95;color:var(--cocoa-ink);letter-spacing:.04em}
.plan-foot{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;margin-top:var(--ma-5)}
/* interlude */
.interlude{background:linear-gradient(180deg,var(--sakura),var(--blush));text-align:center}
.interlude h2{max-width:20em;margin-inline:auto}
.interlude p.s{margin:var(--ma-4) auto 0;font:500 clamp(1.05rem,1rem + .5vw,1.3rem)/2 var(--serif);letter-spacing:.08em;color:var(--cocoa-ink)}
/* faq */
.faq-wrap{max-width:860px;margin-inline:auto}
.q{border-bottom:1px solid rgba(176,138,62,.4)}
.q:first-of-type{border-top:1px solid rgba(176,138,62,.4)}
.q summary{display:flex;align-items:center;gap:16px;min-height:64px;padding:14px 4px;font:500 clamp(1.05rem,1rem + .3vw,1.2rem)/1.7 var(--serif);letter-spacing:.04em;color:var(--sumi)}
.q summary .qm{flex:none;display:grid;place-content:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(176,138,62,.6);font:400 1rem var(--serif);color:var(--gold-ink)}
.q summary .t{flex:1;min-width:0;overflow-wrap:anywhere}
.q summary .pm{flex:none;position:relative;width:20px;height:20px}
.q summary .pm::before,.q summary .pm::after{content:"";position:absolute;left:3px;right:3px;top:9px;height:1.5px;background:var(--cocoa-ink);transition:transform .25s var(--ease)}
.q summary .pm::after{transform:rotate(90deg)}
.q[open] summary .pm::after{transform:rotate(0)}
.q .a{padding:4px 4px 26px 50px}
.q .a p{font-size:var(--fs-body);line-height:2;color:var(--cocoa-ink);letter-spacing:.04em}
.q .a p+p{margin-top:.9em}
@media(max-width:37.49em){.q .a{padding-left:4px}}
@media(prefers-reduced-motion:no-preference){.q{interpolate-size:allow-keywords}}
/* ibj */
.ibj-grid{display:grid;gap:var(--ma-5);align-items:start}
@media(min-width:64em){.ibj-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,104px)}}
.ibj-logo{display:block;width:170px;height:auto;aspect-ratio:170/60;margin:var(--ma-4) 0 var(--ma-3);border:1px solid rgba(176,138,62,.45);border-radius:6px}
.award img{display:block;width:min(100%,440px);height:auto;aspect-ratio:16/9;border-radius:16px;box-shadow:var(--shadow)}
.award h3{margin-top:var(--ma-3)}
.award p{margin-top:8px;font-size:var(--fs-body);line-height:1.95;color:var(--cocoa-ink);letter-spacing:.04em;max-width:30em}
.notes{margin-top:var(--ma-6);padding:24px 26px;background:var(--washi);border:1px solid rgba(176,138,62,.3);border-radius:24px}
.notes h3{font-size:1rem}
.notes p{font-size:14px;line-height:1.9;color:var(--cocoa-ink);margin-top:8px;letter-spacing:.03em;overflow-wrap:anywhere}
/* Official YouTube iframe: native player controls, no autoplay or overlays. */
.ibj-video{position:relative;width:100%;aspect-ratio:16/9;min-height:200px;margin:16px 0}
.ibj-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* close */
.acc3{display:grid;gap:var(--ma-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));list-style:none;padding:0}
.acc{display:flex;flex-direction:column;justify-content:space-between;gap:14px;min-height:140px;padding:22px 24px;text-decoration:none;color:var(--sumi);transition:border-color .2s}
.acc:hover{border-color:var(--gold-line)}
.acc .p{font:500 13px/1.4 var(--serif);letter-spacing:.2em;color:var(--gold-ink)}
.acc .d{font-size:15px;color:var(--cocoa);line-height:1.7}
.acc .go{font:500 1.05rem/1.6 var(--serif);letter-spacing:.04em;text-decoration:underline;text-underline-offset:5px;text-decoration-color:rgba(117,90,34,.5)}
.talk{text-align:center;margin-top:var(--ma-6)}
.talk .lead{margin-inline:auto}
.talk .cta-wrap2{margin-top:var(--ma-5)}
/* company */
.co{max-width:820px;border-top:1px solid rgba(176,138,62,.4)}
.co div{display:grid;gap:2px 24px;padding:16px 0;border-bottom:1px solid rgba(176,138,62,.4)}
@media(min-width:37.5em){.co div{grid-template-columns:10em 1fr}}
.co dt{font-size:14px;color:var(--gold-ink);letter-spacing:.12em;font-weight:500}
.co dd{font-size:var(--fs-body);color:var(--cocoa-ink);overflow-wrap:anywhere}
.co a{color:var(--cocoa-ink);text-underline-offset:4px}
/* mahana */
.mh-grid{display:grid;gap:var(--ma-5);align-items:center}
@media(min-width:64em){.mh-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,104px)}}
.mh-grid .ph-r{aspect-ratio:1100/691}
.mh-name{font:400 clamp(1.6rem,1.3rem + 1vw,2.1rem)/1.3 var(--serif);letter-spacing:.2em;color:var(--gold-ink);margin-bottom:12px}
.perk{margin-top:var(--ma-4);padding:22px 24px}
.perk h3{font-size:1.1rem}
.perk p{font-size:15px;line-height:1.9;color:var(--cocoa-ink);margin-top:6px}
.perk .fine{margin-top:6px}
/* footer */
.ft{background:var(--ivory);padding:56px 0 calc(40px + 80px)}
@media(min-width:64em){.ft{padding-bottom:56px}}
.ft .in{display:flex;flex-wrap:wrap;gap:28px 48px;align-items:center;justify-content:space-between}
.ft img{display:block;height:64px;width:auto}
.ft nav ul{display:flex;flex-wrap:wrap;gap:4px 8px;list-style:none;padding:0}
.ft nav a{display:inline-flex;align-items:center;min-height:48px;padding:0 10px;color:var(--cocoa-ink);text-decoration:none;font-size:15px;letter-spacing:.08em}
.ft nav a:hover{text-decoration:underline;text-underline-offset:5px}
.ft .bt{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid rgba(176,138,62,.35)}
.ft .top{display:inline-flex;align-items:center;min-height:48px;color:var(--cocoa-ink);font-size:14px;letter-spacing:.08em}
/* sticky consult pill (small screens, after the FV) */
.pill{position:fixed;left:16px;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:35;display:flex;justify-content:center;align-items:center;gap:10px;min-height:52px;padding:8px 20px;border-radius:999px;background:var(--cta);color:var(--shiro);text-decoration:none;font-weight:500;letter-spacing:.06em;line-height:1.5;text-align:center;box-shadow:var(--shadow);border:1px solid rgba(255,253,248,.55)}
.pill[hidden]{display:none}
.pill svg{width:1em;height:1em;flex:none}
@media(min-width:64em){.pill{display:none!important}}
/* header current-section underline */
.nav a[aria-current]::after{transform:scaleX(1)}
@media(forced-colors:active){.card,.notes,.q,.btn-sub,.cta,.pill{border:1px solid ButtonText}}

/* Japanese line breaking for display text: break only at the <wbr>/<br> hints; very long runs may still wrap (text zoom) */
h2,h3,.big,.big-h,.quote,.interlude p.s,.name,.mh-name{word-break:keep-all;overflow-wrap:anywhere;line-break:strict}
/* robustness for text zoom: grid tracks never grow past the viewport; long runs may wrap */
.about-grid,.cou-grid,.ibj-grid,.mh-grid{grid-template-columns:minmax(0,1fr)}
@media(min-width:64em){.about-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}.cou-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}.ibj-grid,.mh-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
main p,main dd,main dt,main li,main summary{overflow-wrap:anywhere}
.co a{display:inline-flex;align-items:center;min-height:44px}
.ft .brandcol{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.ft .tag{font:500 1rem/1.7 var(--serif);letter-spacing:.1em;color:var(--cocoa-ink);word-break:keep-all;overflow-wrap:anywhere}
