:root{
  /* ink + neutrals (warmed for the flower era) */
  --ink:#3a3436; --muted:#7a6d6e; --line:#eee0df; --bg:#fff; --bg-alt:#fbf6f5;
  /* leaf era (retired, kept for reversibility) + CONNECT gold */
  --ochre:#7e7c0a; --ochre-deep:#65640a; --teal:#1aa098; --teal-deep:#0f766e; --teal-ground:#0f8077; --lime:#b9c621;
  /* flower era — sampled coral (styleup scale photo #f48691): decorative only, fails AA on white */
  --coral:#f48691; --coral-deep:#e97079; --coral-pale:#f89ba6;
  /* flower era — pale surfaces */
  --lotus-veil:#fdf0f1; --lotus-band:#f6dcdb;
  /* flower era — text-grade accent (5.85:1 on white, 5.26:1 on veil) */
  --accent:#b23a48; --accent-strong:#b23a48; --accent-deep:#93303c; --accent-soft:#fdeef0;
  /* bands: pale ground + ink text (hero, reservation, footer) */
  --band-bg:var(--lotus-veil); --band-ink:var(--ink); --band-muted:#7d6064; --band-accent:var(--accent);
  /* type */
  --serif:"Gilda Display",Georgia,"Times New Roman",serif;
  --caps:"Tenor Sans",-apple-system,"Helvetica Neue",sans-serif;
  --jp-head:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  --jp-body:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  --jp-display:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue",var(--jp-body);
  /* spacing scale */
  --s-1:.5rem; --s-2:1rem; --s-3:1.5rem; --s-4:2.5rem; --s-5:4rem; --s-6:5.5rem; --s-7:7rem;
  /* radii + shadow */
  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-pill:999px;
  --shadow:0 10px 30px rgba(40,38,12,.08); --shadow-hover:0 18px 48px rgba(40,38,12,.14);
  --maxw:1040px;
  /* seminar headers (.semhead/.semcard-head/.feature-head) route through these two accents —
     the planned white+pink/coral restyle only needs to swap them; -bg/-line derive automatically */
  --semhead-accent:var(--ochre); --semhead-accent-deep:var(--ochre-deep); --semhead-on-accent:#fff;
  --semhead-bg:color-mix(in srgb,var(--semhead-accent) 7%,#fff);
  --semhead-line:color-mix(in srgb,var(--semhead-accent) 32%,transparent);
}
*{box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth}
html,body{overflow-x:hidden;overflow-x:clip}
body{margin:0;color:var(--ink);background:var(--bg);
  font-family:var(--sans);line-height:1.85;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{line-height:1.4;font-weight:500;font-family:var(--jp-head)}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.9);
  backdrop-filter:saturate(1.3) blur(8px);-webkit-backdrop-filter:saturate(1.3) blur(8px);
  border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;padding:.75rem 1.5rem;gap:.4rem 1rem}
.brand{display:flex;flex-direction:column;line-height:1;color:var(--ink)}
.brand b{font-family:var(--serif);font-weight:500;font-size:1.5rem;letter-spacing:.08em;color:var(--accent)}
.brand span{font-family:var(--caps);font-size:.56rem;font-weight:400;letter-spacing:.2em;color:var(--muted);margin-top:.3rem;text-transform:uppercase}
.site-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem 1.1rem;font-family:var(--caps);font-size:.82rem;letter-spacing:.05em}
.site-nav a{color:var(--ink)}
.site-nav a:hover{color:var(--accent);text-decoration:none}
.site-nav .book-btn{background:var(--accent-strong);color:#fff;border-radius:var(--r-pill);padding:.45rem 1.3rem;font-weight:600;letter-spacing:.08em;box-shadow:0 6px 16px rgba(178,58,72,.22);transition:transform .15s,box-shadow .15s}
.site-nav .book-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(178,58,72,.32)}

main{max-width:var(--maxw);margin:0 auto;padding:0 1.5rem}

.hero{padding:var(--s-3) 0 var(--s-5)}
/* hero — 掛軸: the brand mark blooms (promoted from design-preview 案B, 2026-07-12; DESIGN.md §5).
   Hand-drawn SVG lotus opens over the waterline, tagline inks in like a scroll inscription.
   Defaults = finished scene; every @keyframes defines only the "from", so the global
   prefers-reduced-motion rule leaves the completed bloom as a still. (home only) */
.kake-hero{padding:0 0 var(--s-4);--kb-ease:cubic-bezier(.22,1,.36,1);--kb-petal-ease:cubic-bezier(.30,.80,.28,1)}
.kake-inner{position:relative;min-height:clamp(41rem,80vh,42rem)}
.kb-pond{position:absolute;top:6px;left:-146px;width:660px;margin:0;pointer-events:none}
.kb-pond svg{display:block;width:100%;height:auto}
.kb-draw{stroke-dasharray:1 1.02;stroke-dashoffset:0;animation:kbDraw var(--dur,1.2s) cubic-bezier(.4,0,.2,1) var(--d,0s) both}
@keyframes kbDraw{from{stroke-dashoffset:1}}
.kb-rise{animation:kbRise 1.9s var(--kb-ease) .85s both,kbFade .7s ease-out .85s both}
@keyframes kbRise{from{transform:translateY(140px)}}
@keyframes kbFade{from{opacity:0}}
.kb-petal{transform:rotate(var(--r));transform-origin:300px 300px;transform-box:view-box;animation:kbPetal var(--dur,2s) var(--kb-petal-ease) var(--d) both}
@keyframes kbPetal{from{transform:rotate(var(--r0,0deg))}}
.kb-blush{opacity:.5;animation:kbFade 2.2s ease-in-out 3s both}
.kb-reflin{animation:kbFade 1.8s ease-in-out 5.2s both}
.kb-refl{opacity:.35;animation:kbBreathe 11s ease-in-out 7.2s 4}
@keyframes kbBreathe{0%,100%{opacity:.35}50%{opacity:.2}}
.kb-sway{transform-origin:300px 300px;transform-box:view-box;animation:kbSway 14s ease-in-out 7s 3}
@keyframes kbSway{0%,100%{transform:rotate(0deg)}33%{transform:rotate(.4deg)}66%{transform:rotate(-.4deg)}}
.kb-waves{animation:kbDrift 11s ease-in-out 4s 4}
@keyframes kbDrift{0%,100%{transform:translateX(0)}30%{transform:translateX(2px)}70%{transform:translateX(-2px)}}
.kb-tatewrap{position:absolute;top:10px;right:clamp(.2rem,4vw,2.4rem);display:flex;gap:14px}
.kb-keyline{width:1px;background:var(--coral);transform-origin:top;animation:kbLine 1.5s var(--kb-ease) 2.15s both}
@keyframes kbLine{from{transform:scaleY(0)}}
.kb-tate{writing-mode:vertical-rl;text-orientation:mixed;margin:0;font-family:var(--jp-display);font-weight:500;font-size:clamp(1.5rem,6vw,2.2rem);letter-spacing:.14em;color:var(--ink)}
.kb-tate .kb-ch{display:inline-block;animation:kbChar .85s var(--kb-ease) var(--d) both}
.kb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
@keyframes kbChar{from{opacity:0;transform:translateY(-9px)}}
.kb-wordmark{position:absolute;top:392px;left:108px;transform:translateX(-50%);margin:0;white-space:nowrap;font-family:var(--serif);font-weight:400;line-height:1.2;font-size:1.85rem;color:var(--ink)}
.kb-wordmark span{display:inline-block;margin-right:.38em;animation:kbLetter .9s var(--kb-ease) var(--d) both}
.kb-wordmark span:last-child{margin-right:0}
@keyframes kbLetter{from{opacity:0;transform:translateY(12px)}}
.kb-foot{position:absolute;left:0;bottom:4.2rem;max-width:calc(100% - 4.6rem)}
.kb-mark{font-family:var(--caps);font-size:.72rem;letter-spacing:.2em;color:var(--muted);margin:0;animation:kbFoot 1s var(--kb-ease) 5.75s both}
.kb-hook{color:var(--muted);font-size:.9rem;line-height:2;margin:.8rem 0 0;max-width:21em;animation:kbFoot 1s var(--kb-ease) 5.95s both}
@keyframes kbFoot{from{opacity:0;transform:translateY(8px)}}
.kb-seal{position:absolute;right:clamp(.6rem,5.5vw,3rem);bottom:4.4rem;width:46px;height:46px;border:1px solid var(--coral-deep);border-radius:1px;display:grid;place-items:center;background:#fff;animation:kbSeal .55s cubic-bezier(.2,.8,.3,1) 6.4s both}
@keyframes kbSeal{from{opacity:0;transform:rotate(-3deg) scale(1.12)}}
@media (min-width:880px){
  .kake-inner{min-height:clamp(44rem,92vh,50rem)}
  .kb-pond{width:900px;left:-16px;top:16px}
  .kb-wordmark{top:496px;left:330px;font-size:2.1rem}
  .kb-tatewrap{right:40px;top:24px}
  .kb-tate{font-size:1.9rem}
  .kb-seal{bottom:3.4rem}
}
.kake-hero .lu{color:var(--accent)}
.lead{max-width:36em;margin:.2rem auto 1.6rem;color:#564e4f;font-size:1.02rem;line-height:2;letter-spacing:.03em}
.block-photo{max-width:560px;margin:0 auto 1.8rem;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow)}
.block-photo img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.hero-sub{text-align:center;padding:var(--s-6) 1rem var(--s-4);border-bottom:1px solid var(--line);margin-bottom:var(--s-4)}
.hero-sub h1{font-family:var(--serif),var(--jp-head);font-weight:500;font-size:clamp(2rem,4vw,3.2rem);letter-spacing:.06em;margin:.2rem 0 0}
.hero-sub h1::after{content:"";display:block;width:44px;height:3px;border-radius:2px;background:var(--accent);margin:1.1rem auto .2rem}
.hero-sub p{color:var(--muted);margin-top:.8rem}

/* blocks */
.block{padding:clamp(4.5rem,8vw,7rem) 0;border-bottom:1px solid var(--line)}
.block:last-of-type{border-bottom:0}
.block.alt{background:var(--bg-alt);border-bottom:0;margin:0 -50vw;padding-left:50vw;padding-right:50vw}
.block.alt > *{max-width:var(--maxw);margin-left:auto;margin-right:auto}
.block.band{background:var(--band-bg);color:var(--band-ink);border-bottom:0;margin:0 -50vw;padding-left:50vw;padding-right:50vw}
.block.band > *{max-width:var(--maxw);margin-left:auto;margin-right:auto}
.block.band h2{color:var(--accent)}
.block.band h2::before{background:var(--accent);opacity:.45}
.block.band h2 span{color:var(--band-muted)}
.block.band a{color:var(--accent)}
.block.band .big{color:var(--band-ink)}
.block.band .muted{color:var(--band-muted)}
.block.band .btn{background:var(--accent-strong);color:#fff;box-shadow:0 8px 20px rgba(178,58,72,.22)}
.block.narrow{max-width:720px;margin:0 auto}
.block h2{text-align:center;font-family:var(--caps);text-transform:uppercase;font-weight:400;letter-spacing:.36em;text-indent:.36em;color:var(--accent);font-size:clamp(1.4rem,3.2vw,2.3rem);margin:0 0 clamp(2.2rem,4.5vw,3.4rem)}
.block h2::before{content:"";display:block;width:1px;height:clamp(40px,6vw,64px);background:var(--accent);opacity:.45;margin:0 auto 1.4rem;text-indent:0}
.block h2 span{display:block;font-family:var(--jp-head);font-weight:400;font-size:.82rem;color:var(--muted);letter-spacing:.26em;text-indent:0;margin-top:.9rem;text-transform:none}
@media(max-width:560px){.block h2{letter-spacing:.26em;text-indent:.26em}}
.block h3{font-family:var(--jp-head);font-size:1.08rem;font-weight:500;margin:2.6rem 0 .7rem}
.block-art{max-width:240px;margin:0 auto 1.4rem}
.block-art img{mix-blend-mode:multiply}
.center{text-align:center}
.muted{color:var(--muted);font-size:.88rem}
.sub{font-weight:600;margin:1.4rem 0 .3rem;font-family:var(--jp-head)}
.big{font-family:var(--serif);font-size:1.8rem;font-weight:500;letter-spacing:.04em}
.more{text-align:center;margin-top:1.8rem}
.more a{font-family:var(--caps);letter-spacing:.06em;color:var(--accent)}
ul.plain{list-style:none;padding:0;margin:.8rem 0}
ul.plain li{padding:.45rem 0;border-bottom:1px solid color-mix(in srgb,var(--accent) 16%,transparent)}
ul.plain.small li{font-size:.88rem}
ul.plain.center-list{max-width:600px;margin:1.2rem auto;text-align:left}

/* profile (asymmetric photo + text) */
.profile-grid{display:grid;grid-template-columns:320px 1fr;gap:2.4rem;align-items:start;text-align:left}
.profile-photo img{width:100%;border-radius:var(--r-md);box-shadow:var(--shadow)}
@media(max-width:720px){.profile-grid{grid-template-columns:1fr}.profile-photo{max-width:300px;margin:0 auto}}
.profile .name{font-family:var(--serif);font-size:1.6rem;font-weight:500;letter-spacing:.03em;margin:.2rem 0 0}
.profile .name small{font-family:var(--caps);font-size:.76rem;color:var(--muted);letter-spacing:.1em;margin-left:.6rem}
.profile .creds{color:var(--muted);margin:.3rem 0 1.2rem}

/* numbered lists */
ol.mission,ol.rewards{padding-left:1.3rem}
ol.mission li,ol.rewards li{margin:1rem 0}
ol.mission li::marker,ol.rewards li::marker{color:color-mix(in srgb,var(--accent) 55%,#fff);font-family:var(--serif);font-weight:400;font-size:1.5em}

/* tables */
table.menu,table.meta{width:100%;border-collapse:collapse;margin:1.2rem 0}
table.menu th,table.menu td,table.meta th,table.meta td{border-bottom:1px solid var(--line);
  padding:.75rem .6rem;text-align:left;vertical-align:top;font-size:.94rem}
table.menu thead th{font-family:var(--caps);text-transform:uppercase;color:var(--muted);font-weight:400;letter-spacing:.08em;font-size:.76rem}
table.menu .m-title{font-family:var(--jp-head)}
table.menu .m-dur{white-space:nowrap;color:var(--muted)}
table.menu .m-price{white-space:nowrap;text-align:right;font-family:var(--serif),var(--jp-body);color:var(--ink);font-size:1.02rem}
table.menu .m-book{white-space:nowrap;text-align:right;width:1%}
table.menu .m-book a{display:inline-block;font-family:var(--caps);font-size:.78rem;letter-spacing:.04em;color:#fff;background:var(--accent-strong);padding:.34rem .9rem;border-radius:var(--r-pill);text-decoration:none}
table.menu .m-book a:hover{background:var(--accent-deep);text-decoration:none}
table.meta th{width:7rem;color:var(--muted);font-weight:600;white-space:nowrap}
@media(max-width:520px){
  table.menu thead{display:none}
  table.menu tr{display:grid;grid-template-columns:1fr auto;column-gap:.9rem;row-gap:.15rem;padding:.85rem 0;border-bottom:1px solid var(--line);align-items:center}
  table.menu td{border:0;padding:0}
  table.menu .m-title{grid-column:1 / 3;font-family:var(--jp-head);font-weight:600}
  table.menu .m-dur{grid-column:1;grid-row:2;color:var(--muted);font-size:.85rem}
  table.menu .m-price{grid-column:1;grid-row:3;text-align:left}
  table.menu .m-book{grid-column:2;grid-row:2 / 4;align-self:center;text-align:right;width:auto}
}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem;margin:1.6rem 0}
@media(max-width:640px){.two-col{grid-template-columns:1fr}}

/* contact form */
.contact-form{margin:1.6rem 0}
.contact-form p{margin:1rem 0}
.contact-form label{display:block;font-size:.9rem;font-weight:600;margin-bottom:.35rem}
.contact-form .req{color:#c0392b;font-weight:700}
.contact-form input[type=text],.contact-form input[type=email],.contact-form textarea{
  width:100%;padding:.7rem .8rem;border:1px solid var(--line);border-radius:var(--r-sm);
  font:inherit;color:var(--ink);background:#fff}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.contact-form .agree label{display:inline;font-weight:400;font-size:.9rem}
.contact-form .agree input{margin-right:.4rem}
.btn{display:inline-block;background:var(--accent-strong);color:#fff;border:0;border-radius:var(--r-pill);
  padding:.8rem 2.6rem;font:inherit;font-weight:600;letter-spacing:.08em;cursor:pointer;
  box-shadow:0 8px 20px rgba(178,58,72,.22);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(178,58,72,.3);text-decoration:none}

/* card grid */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin:1.8rem 0}
@media(max-width:820px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.grid{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-md);
  overflow:hidden;color:var(--ink);background:#fff;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);text-decoration:none}
.card img{aspect-ratio:16/9;object-fit:cover;width:100%;background:var(--bg-alt)}
.card-body{padding:1rem 1.1rem}
.card .date{font-family:var(--caps);font-size:.72rem;color:var(--accent);letter-spacing:.08em}
.card h3{font-family:var(--jp-head);font-size:1rem;font-weight:500;margin:.3rem 0 .4rem}
.card p{font-size:.84rem;color:var(--muted);margin:0}
.grid-section{padding:var(--s-4) 0}
.grid-section h2{text-align:center;font-family:var(--caps);text-transform:uppercase;color:var(--accent);letter-spacing:.16em}
/* featured (editorial first item on index pages) */
.feature{display:grid;grid-template-columns:1.25fr 1fr;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:#fff;color:var(--ink);box-shadow:var(--shadow);margin:1.8rem 0;transition:transform .2s,box-shadow .2s}
.feature:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);text-decoration:none}
.feature-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;background:var(--bg-alt)}
.feature-body{padding:2.2rem 2.4rem;display:flex;flex-direction:column;justify-content:center}
.feature-body .date{font-family:var(--caps);color:var(--accent);letter-spacing:.08em;font-size:.78rem}
.feature-body h2{font-family:var(--jp-head);font-weight:500;font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.45;letter-spacing:.02em;text-align:left;text-transform:none;color:var(--ink);margin:.5rem 0 .7rem}
.feature-body p{color:var(--muted);font-size:.9rem;margin:0 0 1rem}
.feature-more{font-family:var(--caps);color:var(--accent);letter-spacing:.06em;font-size:.85rem}
@media(max-width:640px){.feature{grid-template-columns:1fr}.feature-img img{aspect-ratio:16/9}.feature-body{padding:1.4rem 1.4rem 1.6rem}}

/* detail pages */
.detail{max-width:780px;margin:0 auto;padding:var(--s-3) 0 var(--s-5)}
.crumb{font-family:var(--caps);font-size:.82rem;letter-spacing:.04em;margin-bottom:1.2rem}
.detail h1{font-family:var(--serif),var(--jp-head);font-weight:500;font-size:clamp(1.6rem,3.2vw,2.3rem);letter-spacing:.03em;margin:.2rem 0 .2rem}
.detail h1::after{content:"";display:block;width:40px;height:3px;border-radius:2px;background:var(--accent);margin:.9rem 0 1rem}
.detail .date{font-family:var(--caps);color:var(--muted);font-size:.85rem;letter-spacing:.06em;margin:-.6rem 0 1rem}
.detail .cover{border-radius:var(--r-md);margin:1.2rem 0 1.6rem}
.detail .body{font-size:1.02rem}
.detail .body p{margin:1.1rem 0}
.detail .body h2{font-family:var(--jp-head);font-size:1.3rem;font-weight:500;color:var(--ink);text-align:left;margin:2rem 0 .8rem}
.detail .body h3{font-family:var(--jp-head);font-size:1.1rem;font-weight:500}
.detail .body img{border-radius:var(--r-sm);margin:1.2rem 0}
.detail .body a{text-decoration:underline}
.notice{background:#fff8e1;border:1px solid #f0e3b0;color:#7a6a16;padding:.8rem 1rem;border-radius:var(--r-sm);font-size:.88rem}
.book-cta{margin:1.5rem 0 .5rem}
.book-cta.multi{display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--r-md);padding:1.2rem 1.3rem}
.book-cta .book-label{font-family:var(--caps);text-transform:uppercase;letter-spacing:.14em;color:var(--accent);font-size:.78rem;margin:0}
.book-cta.multi .btn{margin:0}
.img-missing{color:var(--muted);font-size:.8rem}

/* connect (membership) page — iter.2: all-white folio, gold only, scoped to .connect-page */
/* guards: CONNECT stays leaf-era gold while the global chrome went flower-era coral */
.connect-page a{color:var(--ochre-deep)}
.connect-page .btn{background:var(--ochre);box-shadow:0 8px 20px rgba(126,124,10,.22)}
.connect-page .btn:hover{box-shadow:0 12px 26px rgba(126,124,10,.3)}
.connect-page .block{border-bottom:0;padding:clamp(5rem,11vw,9rem) 0}
.connect-page #background{padding:clamp(6rem,12vw,10rem) 0}
/* the recurring luxury header motif (a gold tick + big letter-spaced caps + JP sub) */
.connect-page .block h2{font-family:var(--caps);text-transform:uppercase;font-weight:400;font-size:clamp(1.5rem,3.6vw,2.6rem);letter-spacing:.42em;text-indent:.42em;color:var(--ochre-deep);text-align:center;margin:0 0 clamp(2.6rem,5vw,4rem)}
.connect-page .block h2::before{content:"";display:block;width:1px;height:clamp(48px,7vw,72px);background:var(--ochre);opacity:.45;margin:0 auto 1.6rem;text-indent:0}
.connect-page .block h2 span{display:block;font-family:var(--jp-head);font-weight:400;font-size:.8rem;letter-spacing:.34em;color:var(--muted);text-transform:none;text-indent:0;margin-top:1rem}
.connect-page .block h3{border-left:0;padding-left:0}
@media(max-width:560px){.connect-page .block h2{letter-spacing:.26em;text-indent:.26em}}
/* hero */
.connect-page .connect-hero{text-align:center;border-bottom:0;padding:clamp(4rem,9vw,7rem) 1rem clamp(2rem,5vw,3.5rem)}
.connect-page .connect-eyebrow{font-family:var(--caps);text-transform:uppercase;letter-spacing:.5em;text-indent:.5em;color:var(--ochre-deep);font-size:.72rem;margin:0 0 2rem}
.connect-page .connect-wordmark{width:min(72vw,440px);height:auto;display:block;margin:0 auto clamp(1.6rem,3vw,2.2rem)}
.connect-page .connect-sub{font-family:var(--jp-head);letter-spacing:.2em;color:var(--muted);font-size:.9rem;margin:0 0 1.6rem}
.connect-page .connect-hero .lead{max-width:32em;line-height:2;color:#4a4a44;margin:clamp(2rem,4.5vw,3rem) auto clamp(2.4rem,5.5vw,3.6rem)}
.connect-page .connect-login{margin-top:.9rem}
.connect-page .connect-login a{font-family:var(--caps);font-size:.8rem;letter-spacing:.08em;color:var(--ochre-deep)}
/* message — a letter + a hovering face seal */
.connect-page .message-letter{max-width:44em;margin:0 auto;text-align:left}
.connect-page .message-letter p{margin:0 0 1.4rem;font-family:var(--jp-body);font-size:.98rem;line-height:2.05;color:#45443d}
.connect-page .sig-seal{text-align:center;margin-top:clamp(2.4rem,5vw,3.4rem)}
.connect-page .sig-avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:3px solid #fff;box-shadow:0 0 0 1px color-mix(in srgb,var(--ochre) 35%,transparent),0 12px 30px rgba(40,38,12,.12);margin:0 auto .9rem;display:block}
.connect-page .sig-role{font-family:var(--caps);text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--muted);margin:0}
.connect-page .sig-name{font-family:var(--serif);font-size:1.4rem;color:var(--ink);letter-spacing:.04em;margin:.25rem 0 0}
/* rewards — five alternating gold plates */
.connect-page .rewards-intro{margin:0 auto clamp(3rem,6vw,5rem);max-width:34em}
.connect-page .reward-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,5rem);align-items:center;max-width:900px;margin:clamp(4rem,8vw,6.5rem) auto 0}
.connect-page .reward-art{display:flex;justify-content:center}
.connect-page .reward-art img{width:clamp(280px,38vw,390px);height:auto;mix-blend-mode:multiply}
.connect-page .reward-art.is-wide img{width:clamp(250px,34vw,350px)}
.connect-page .reward-row.flip .reward-art{order:2}
.connect-page .reward-folio{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3.4rem);line-height:1;color:color-mix(in srgb,var(--ochre) 50%,#fff);margin:0 0 .5rem}
.connect-page .reward-text h3{font-family:var(--jp-head);font-weight:500;font-size:clamp(1.15rem,2.2vw,1.45rem);letter-spacing:.04em;color:var(--ink);margin:0}
.connect-page .reward-text h3::after{content:"";display:block;width:32px;height:1px;background:var(--ochre);margin:.7rem 0 1.1rem}
.connect-page .reward-body{font-family:var(--jp-body);font-size:.94rem;line-height:1.95;color:#4a4a44;margin:0;max-width:32em}
.connect-page .reward-note{font-family:var(--jp-body);font-size:.82rem;line-height:1.7;color:var(--muted);margin:1rem 0 0;border-top:1px solid color-mix(in srgb,var(--ochre) 16%,transparent);padding-top:.8rem;max-width:32em}
@media(max-width:820px){
  .connect-page .reward-row{grid-template-columns:1fr;gap:1.4rem;text-align:center;margin-top:clamp(3rem,9vw,4.5rem)}
  .connect-page .reward-row.flip .reward-art{order:0}
  .connect-page .reward-art img,.connect-page .reward-art.is-wide img{width:min(74vw,300px)}
  .connect-page .reward-text h3::after{margin-left:auto;margin-right:auto}
  .connect-page .reward-body,.connect-page .reward-note{margin-left:auto;margin-right:auto}
}
/* members' background — masthead roles + osusume grid */
.connect-page .roles-line{text-align:center;font-family:var(--jp-head);font-size:clamp(.85rem,1.6vw,.95rem);letter-spacing:.14em;color:var(--ochre-deep);line-height:2.4;margin:0 auto clamp(3rem,6vw,4.5rem);max-width:760px}
.connect-page .roles-line span:not(:first-child)::before{content:"·";margin:0 .85em;color:color-mix(in srgb,var(--ochre) 45%,#fff)}
.connect-page .osusume-head{text-align:center;font-family:var(--jp-head);font-weight:500;font-size:1.05rem;letter-spacing:.1em;color:var(--ink);margin:0 0 1.6rem}
.connect-page .osusume-head::before{content:"";display:block;width:1px;height:34px;background:var(--ochre);opacity:.45;margin:0 auto 1.1rem}
.connect-page .osusume-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2.2rem 3rem;max-width:840px;margin:0 auto}
.connect-page .osusume-item{display:flex;gap:1rem;align-items:flex-start}
.connect-page .osusume-idx{font-family:var(--serif);font-size:1.2rem;line-height:1.5;color:color-mix(in srgb,var(--ochre) 50%,#fff);flex:0 0 auto}
.connect-page .osusume-item p{font-family:var(--jp-body);font-size:.96rem;line-height:1.9;color:var(--ink);margin:0}
@media(max-width:640px){.connect-page .osusume-grid{grid-template-columns:1fr;gap:1.5rem}}
/* fee — just the price, alone in white */
.connect-page .fee-amount{text-align:center;font-family:var(--serif);font-size:clamp(3rem,7vw,4.6rem);color:var(--ochre-deep);letter-spacing:.03em;margin:0}
/* how to join — outlined gold step rings */
.connect-page ol.steps{list-style:none;padding:0;max-width:640px;margin:0 auto;display:flex;flex-direction:column}
.connect-page .steps .step{display:flex;gap:1.2rem;align-items:flex-start;padding:1.4rem 0;border-bottom:1px solid color-mix(in srgb,var(--ochre) 16%,transparent)}
.connect-page .steps .step:last-child{border-bottom:0}
.connect-page .step-num{flex:0 0 2.6rem;width:2.6rem;height:2.6rem;border-radius:50%;background:transparent;border:1px solid var(--ochre);color:var(--ochre-deep);font-family:var(--serif);font-size:1.2rem;display:flex;align-items:center;justify-content:center}
.connect-page .steps .step h3{font-family:var(--jp-head);font-weight:500;font-size:1.02rem;margin:.3rem 0 .35rem}
.connect-page .steps .step p{font-family:var(--jp-body);font-size:.92rem;line-height:1.8;color:#4a4a44;margin:0}
.connect-page .join-cta{margin-top:clamp(2.5rem,5vw,3.5rem)}
/* notes */
.connect-page ul.notes{max-width:640px;margin:0 auto;padding:0;list-style:none}
.connect-page ul.notes li{position:relative;padding:.7rem 0 .7rem 1.5rem;border-bottom:1px solid color-mix(in srgb,var(--ochre) 16%,transparent);color:var(--muted);font-size:.9rem;line-height:1.8}
.connect-page ul.notes li::before{content:"※";position:absolute;left:0;color:var(--ochre)}
.connect-page ul.notes li:last-child{border-bottom:0}

/* footer (pale band) */
.site-footer{background:var(--band-bg);color:var(--band-ink);margin-top:var(--s-5);padding:var(--s-5) 1.5rem 2rem;font-size:.88rem}
.foot-brand{max-width:var(--maxw);margin:0 auto var(--s-3);text-align:center}
.foot-brand img{width:150px;margin:0 auto;opacity:.95}
.foot-cols{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:1.8rem}
@media(max-width:640px){.foot-cols{grid-template-columns:1fr;text-align:center}}
.site-footer strong{color:var(--ink)}
.site-footer a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.site-footer a:hover{color:var(--accent-deep)}
.copyright{text-align:center;color:var(--band-muted);margin:var(--s-3) 0 0;font-size:.74rem;font-family:var(--caps);letter-spacing:.08em}

/* yearly seminar schedule (seminars.html) */
.schedule-section .schedule{max-width:920px;margin:1.6rem auto 0}
.sch-group{font-family:var(--jp-head);font-weight:600;font-size:.92rem;color:var(--accent);letter-spacing:.04em;margin:1.8rem 0 .5rem;padding-bottom:.4rem;border-bottom:1px solid color-mix(in srgb,var(--accent) 22%,transparent)}
.sch-months{display:grid;grid-template-columns:13rem repeat(12,1fr);gap:.1rem;align-items:end;margin-bottom:.5rem;padding-bottom:.45rem;border-bottom:1px solid color-mix(in srgb,var(--accent) 18%,transparent)}
.sch-m{font-size:.66rem;color:var(--muted);text-align:center}
.sch-m.now{color:var(--accent);font-weight:700}
.sch-track{display:grid;grid-template-columns:13rem 1fr;gap:.9rem;align-items:center;padding:.65rem 0;border-bottom:1px solid color-mix(in srgb,var(--accent) 10%,transparent)}
.sch-track:last-of-type{border-bottom:0}
.sch-name{font-family:var(--jp-head);font-weight:600;font-size:.96rem;margin:0;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;line-height:1.4}
.sch-name a{color:var(--ink)}.sch-name a:hover{color:var(--accent)}
.sch-sub{font-size:.74rem;color:var(--muted);margin:.25rem 0 0;line-height:1.5}
.sch-status{font-family:var(--caps);font-size:.6rem;letter-spacing:.05em;padding:.12rem .5rem;border-radius:var(--r-pill);white-space:nowrap}
.sch-status.open{background:var(--accent-strong);color:#fff}
.sch-status.prep{border:1px solid var(--accent);color:var(--accent)}
.sch-status.done{background:var(--line);color:var(--muted)}
.sch-note{font-size:.62rem;color:var(--accent);border:1px dashed var(--accent);border-radius:var(--r-pill);padding:.08rem .45rem;white-space:nowrap}
.sch-bars{display:grid;grid-template-columns:repeat(12,1fr);align-items:center;min-height:1.9rem}
.sch-bar{border-radius:var(--r-pill);font-size:.72rem;padding:.32rem .8rem;display:flex;align-items:center;justify-content:space-between;gap:.6rem;white-space:nowrap;overflow:hidden;min-width:0}
.sch-bar.open{background:var(--accent-strong);color:#fff}
.sch-bar.prep{border:1px dashed var(--accent);color:var(--accent)}
.sch-bar.done{background:var(--line);color:var(--muted)}
.sch-bar.tbd{border:1px dashed color-mix(in srgb,var(--accent) 40%,#fff);color:var(--muted);justify-content:center}
.sch-badge{font-family:var(--caps);font-size:.64rem;letter-spacing:.02em;background:rgba(255,255,255,.22);padding:.06rem .45rem;border-radius:var(--r-pill);white-space:nowrap}
.sch-legend{display:flex;flex-wrap:wrap;gap:1.1rem;justify-content:center;margin:1.5rem 0 0;font-size:.74rem;color:var(--muted)}
.sch-legend span{display:inline-flex;align-items:center;gap:.4rem}
.sch-legend span::before{content:"";width:16px;height:11px;border-radius:3px;display:inline-block}
.sch-legend .open::before{background:var(--accent-strong)}
.sch-legend .prep::before{border:1px dashed var(--accent)}
.sch-legend .done::before{background:var(--line)}
.sch-notes{margin:1.4rem auto 0;max-width:760px}
@media(max-width:720px){
  .schedule-section .sch-months{display:none}
  .sch-track{grid-template-columns:1fr;gap:.45rem;padding:.95rem 0}
  .sch-bars{grid-template-columns:1fr}
  .sch-bar{grid-column:1/2!important;white-space:normal;justify-content:flex-start;gap:.8rem}
}

/* ---- seminar headers — editable HTML replacing the baked banner images ----
   scoped: .semhead (detail page), .semcard-head (grid card), .feature-head (featured slot).
   All color via --semhead-* tokens (see :root). Photo sits right of the text behind a
   --semhead-bg gradient so the text always reads; on phones it becomes a top strip. */
.semhead{position:relative;overflow:hidden;background:var(--semhead-bg);border:1px solid var(--semhead-line);
  border-radius:var(--r-md);margin:1.2rem 0 1.6rem;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(150px,.8fr)}
.semhead-body{position:relative;z-index:2;padding:clamp(1.4rem,4vw,2.3rem) clamp(1.1rem,3.5vw,2.1rem)}
.semhead-photo{position:relative;background-size:cover;background-position:60% 28%;min-height:210px}
.semhead-photo::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--semhead-bg) 0%,transparent 45%)}
.semhead-mark{position:absolute;right:.9rem;bottom:.7rem;width:54px;opacity:.4;z-index:2;
  mix-blend-mode:multiply;pointer-events:none;user-select:none}
.semhead-audience{display:inline-block;background:var(--semhead-accent);color:var(--semhead-on-accent);
  font-family:var(--jp-head);font-weight:500;font-size:.72rem;letter-spacing:.06em;padding:.3rem .85rem;border-radius:4px;margin:0 0 1rem}
.semhead-catch,.semhead-hook{font-family:var(--jp-head);font-weight:700;color:var(--semhead-accent-deep);
  font-size:.92rem;letter-spacing:.08em;margin:0 0 .1rem}
.semhead-series{font-family:var(--jp-head);color:var(--muted);letter-spacing:.12em;font-size:.86rem;margin:.15rem 0 0}
.semhead-vol{font-family:var(--serif);font-size:1.3em;color:var(--semhead-accent-deep);letter-spacing:.03em}
.detail .semhead h1.semhead-title{font-family:var(--jp-head);font-weight:700;color:var(--semhead-accent-deep);
  font-size:clamp(1.4rem,4vw,2rem);line-height:1.5;letter-spacing:.03em;margin:.4rem 0 .2rem;text-wrap:balance;text-align:left}
.detail .semhead h1.semhead-title::after{display:none}
.semhead-subtitle{font-family:var(--jp-head);color:var(--semhead-accent-deep);font-size:1rem;letter-spacing:.12em;margin:.1rem 0 0}
.semhead--course .semhead-subtitle{color:var(--ink);letter-spacing:.1em}
.semhead-state{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin:1.4rem 0 0;font-family:var(--jp-head)}
.semhead-state.is-upcoming{display:inline-flex;background:var(--semhead-accent);color:var(--semhead-on-accent);
  border-radius:var(--r-sm);padding:.55rem 1.05rem;font-size:.95rem;letter-spacing:.05em}
.semhead-state.is-upcoming .semhead-where::after{content:"｜";margin:0 .55em;opacity:.6}
.semhead-state.is-archive .semhead-archive{display:inline-block;border:2px solid var(--semhead-accent);color:var(--semhead-accent-deep);
  border-radius:var(--r-sm);padding:.45rem 1.05rem;font-weight:700;letter-spacing:.08em;font-size:.95rem}
.semhead-held{color:var(--muted);font-size:.85rem;letter-spacing:.04em}
@media(max-width:640px){
  .semhead{grid-template-columns:1fr}
  .semhead-photo{order:-1;min-height:150px;background-position:60% 22%}
  .semhead-photo::before{background:linear-gradient(180deg,transparent 55%,var(--semhead-bg) 100%)}
}
/* card mini-header — fills the 16:9 slot so seminar cards keep rhythm with photo cards */
.semcard-head{aspect-ratio:16/9;position:relative;overflow:hidden;background-color:var(--semhead-bg);
  background-size:cover;background-position:62% 25%;border-bottom:1px solid var(--semhead-line)}
.semcard-head::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,
  color-mix(in srgb,var(--semhead-bg) 96%,transparent) 38%,color-mix(in srgb,var(--semhead-bg) 35%,transparent) 66%,transparent 90%)}
.semcard-inner{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:.1rem;padding:1rem 1.15rem}
.semcard-series{font-family:var(--jp-head);font-size:.7rem;letter-spacing:.14em;color:var(--muted)}
.semcard-vol{font-family:var(--serif);font-size:2rem;line-height:1.1;color:var(--semhead-accent-deep)}
.semcard-vol--text{font-family:var(--jp-head);font-weight:700;font-size:1.02rem;letter-spacing:.06em;line-height:1.4}
.semcard-state{margin-top:.4rem;font-family:var(--jp-head);font-size:.66rem;letter-spacing:.05em;padding:.14rem .6rem;border-radius:var(--r-pill)}
.semcard-state.is-upcoming{background:var(--semhead-accent);color:var(--semhead-on-accent)}
.semcard-state.is-archive{border:1px solid var(--semhead-accent);color:var(--semhead-accent-deep);background:color-mix(in srgb,#fff 72%,transparent)}
/* featured-card rendition — fills the .feature-img grid cell */
.feature-head{height:100%;min-height:250px;position:relative;overflow:hidden;background-color:var(--semhead-bg);
  background-size:cover;background-position:68% 26%}
.feature-head::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,
  var(--semhead-bg) 32%,color-mix(in srgb,var(--semhead-bg) 45%,transparent) 62%,transparent 88%)}
.feature-head-inner{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.1rem;padding:1.6rem 1.7rem}
.feature-head .semhead-state{margin-top:1rem}
.feature-head .semhead-state.is-upcoming{font-size:.85rem;padding:.45rem .9rem}
.feature-head .semhead-state.is-archive .semhead-archive{font-size:.85rem;padding:.35rem .85rem}
@media(max-width:640px){.feature-head{min-height:185px}}


/* scroll reveals — pure CSS, fail-safe (no support = content just shows) */
@media (prefers-reduced-motion: no-preference){
  @supports (animation-timeline: view()){
    .block,.hero-sub,.grid > .card{animation:reveal linear both;animation-timeline:view();animation-range:entry 2% entry 30%}
    .grid > .card:nth-child(2){animation-range:entry 6% entry 34%}
    .grid > .card:nth-child(3){animation-range:entry 10% entry 38%}
    @keyframes reveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
  }
}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}