/* ============================================================
BASICARE — 宵の青 (cosmos-blue) shared stylesheet
============================================================ */
:root{
--gold:#d6bd86;
--gold2:#b89c6c;
--accent:#f0cf9f;
--text:#f3eee3;
--muted:#d4d9e6;
--line:rgba(214,189,134,.30);
--glass:linear-gradient(158deg,rgba(86,114,164,.30),rgba(28,40,72,.5));
--glass-soft:linear-gradient(158deg,rgba(96,124,174,.22),rgba(30,42,74,.4));
--card-radius:16px;
--maxw:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
font-weight:400;color:var(--text);line-height:1.9;
-webkit-font-smoothing:antialiased;overflow-x:hidden;
background:#2c416f; /* solid下地：iOS Safariが背景を文書全体へ引き伸ばす事故を防ぐ */
}
/* 宵の青グラデはビューポート固定の専用レイヤーへ（background-attachment:fixed はiOSで無効なため擬似要素で固定） */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#2c416f 0%,#395886 26%,#456a96 50%,#5582a8 74%,#699bbe 100%)}
.serif{font-family:"Cormorant Garamond","Shippori Mincho",serif}
.mincho{font-family:"Shippori Mincho",serif}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
.center{text-align:center}
/* ===== animated sky ===== */
#sky{position:fixed;inset:0;z-index:0;pointer-events:none}
.neb{position:fixed;border-radius:50%;filter:blur(80px);z-index:0;pointer-events:none;will-change:transform,opacity}
.neb.b1{width:760px;height:760px;left:-160px;top:-120px;background:radial-gradient(circle,rgba(96,150,214,.42),transparent 65%);animation:neb1 26s ease-in-out infinite alternate}
.neb.b2{width:680px;height:680px;right:-180px;top:34%;background:radial-gradient(circle,rgba(126,162,214,.34),transparent 66%);animation:neb2 32s ease-in-out infinite alternate}
.neb.b3{width:620px;height:620px;left:18%;bottom:-160px;background:radial-gradient(circle,rgba(228,196,150,.20),transparent 64%);animation:neb3 30s ease-in-out infinite alternate}
@keyframes neb1{from{transform:translate(0,0) scale(1);opacity:.5}to{transform:translate(60px,40px) scale(1.12);opacity:.78}}
@keyframes neb2{from{transform:translate(0,0) scale(1.05);opacity:.45}to{transform:translate(-50px,30px) scale(.95);opacity:.7}}
@keyframes neb3{from{transform:translate(0,0) scale(1);opacity:.4}to{transform:translate(40px,-40px) scale(1.1);opacity:.66}}
.topscrim{display:none}
header,section,footer,main{position:relative;z-index:1}
/* ===== header ===== */
header{display:flex;align-items:center;justify-content:space-between;padding:16px 40px;position:fixed;top:0;left:0;right:0;z-index:100;background:#fff;border-bottom:1px solid rgba(28,40,72,.10);transition:background .4s,box-shadow .4s,padding .4s}
header.scrolled{background:#fff;box-shadow:0 2px 18px rgba(20,28,55,.10);padding:16px 40px}
.logo{line-height:1.1;display:flex;flex-direction:column;align-items:center}
.logo img{height:24px;width:auto;display:block}
.logo .s{display:block;font-family:"Shippori Mincho",serif;font-size:11.5px;font-weight:600;letter-spacing:.30em;color:#5a6478;margin-top:4px;padding-left:.3em;text-align:center}
nav.main ul{display:flex;gap:30px;list-style:none;align-items:center}
nav.main a{font-size:14px;letter-spacing:.13em;color:#1d2740;opacity:.85;position:relative;padding-bottom:4px;transition:opacity .3s}
nav.main a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:width .35s}
nav.main a:hover,nav.main a.active{opacity:1}
nav.main a:hover::after,nav.main a.active::after{width:100%}
/* ナビ: 日本語デフォルト / マウスオーバーで英語にクロスフェード */
nav.main a .nlj{transition:opacity .3s}
nav.main a .nle{position:absolute;left:-12%;right:-12%;top:0;height:100%;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-family:"Cormorant Garamond",serif;letter-spacing:.18em;opacity:0;transition:opacity .3s;pointer-events:none}
nav.main a:hover .nlj{opacity:0}
nav.main a:hover .nle{opacity:1}
.foot-col a .nlj{transition:opacity .3s}
.foot-col a .nle{position:absolute;left:0;top:0;height:100%;display:flex;align-items:center;white-space:nowrap;font-family:"Cormorant Garamond",serif;letter-spacing:.14em;opacity:0;transition:opacity .3s;pointer-events:none;color:var(--gold)}
.foot-col a:hover .nlj{opacity:0}
.foot-col a:hover .nle{opacity:1}
.hdr-right{display:flex;align-items:center;gap:18px}
.pill{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#e6cf98,#c4a468);color:#1b1407;font-size:13.5px;letter-spacing:.12em;font-weight:500;padding:11px 22px;border-radius:40px;box-shadow:0 6px 22px rgba(214,189,134,.36);transition:transform .3s,box-shadow .3s,filter .3s}
.pill:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 10px 28px rgba(214,189,134,.48)}
/* ヘッダーピル内：満ち欠けする月アイコン（常時アニメ） */
.pmoon{position:relative;display:inline-block;width:13px;height:13px;border-radius:50%;overflow:hidden;background:#fff7e4;vertical-align:-2px;box-shadow:inset 0 0 0 .5px rgba(27,20,7,.28),0 0 5px rgba(255,247,228,.4)}
.pmoon::after{content:"";position:absolute;top:0;left:0;width:13px;height:13px;border-radius:50%;background:#6e5118;transform:translateX(var(--pmoon-x,6.5px));transition:transform .3s ease-out}
@media(prefers-reduced-motion:reduce){.pmoon::after{transition:none}}
.menu-btn{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:10px;min-width:44px;min-height:44px}
.menu-btn span{width:24px;height:1.5px;background:#1d2740;transition:.3s}
.mnav{position:fixed;inset:0;z-index:99;background:rgba(255,255,255,.98);backdrop-filter:blur(14px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;opacity:0;pointer-events:none;transition:opacity .4s}
.mnav.open{opacity:1;pointer-events:auto}
/* メニューを開いている間はヘッダーのハンバーガーを隠し、×（閉じる）のみ表示（重なり防止） */
body:has(.mnav.open) .menu-btn{opacity:0;pointer-events:none}
.mnav a{font-family:"Shippori Mincho",serif;font-size:20px;letter-spacing:.16em;color:#1d2740}
.mnav .close{position:absolute;top:18px;right:22px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;line-height:1;font-size:30px;color:#1d2740;background:none;border:none;cursor:pointer}
/* ===== buttons ===== */
.btn-gold{display:inline-flex;align-items:center;gap:40px;background:linear-gradient(135deg,#e6cf98,#c4a468);color:#1b1407;padding:16px 32px;border-radius:6px;font-size:14px;font-weight:500;letter-spacing:.14em;transition:filter .35s,transform .3s,box-shadow .3s;box-shadow:0 8px 24px rgba(214,189,134,.3)}
.btn-gold:hover{filter:brightness(1.06);transform:translateY(-2px);box-shadow:0 12px 30px rgba(214,189,134,.42)}
.btn-outline{display:inline-flex;align-items:center;gap:40px;border:1px solid var(--line);padding:16px 40px;font-size:14px;letter-spacing:.18em;color:var(--text);border-radius:6px;transition:background .35s,color .35s,border-color .35s}
.btn-outline:hover{background:var(--gold);color:#1b1407;border-color:var(--gold)}
.btn-line{display:inline-flex;align-items:center;gap:14px;font-size:14px;letter-spacing:.18em;color:var(--text);padding-bottom:8px;border-bottom:1px solid var(--gold)}
.btn-line svg{transition:transform .3s}
.btn-line:hover svg{transform:translateX(6px)}
.arrow path{stroke:currentColor;fill:none}
/* ===== generic section / type ===== */
section{padding:104px 0}
.eyebrow{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:15.5px;letter-spacing:.13em;color:#f8dfb4;margin-bottom:16px}
.sec-title{font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(26px,3.4vw,40px);letter-spacing:.1em;color:#fffdf7;line-height:1.5}
.sec-sub{font-size:15px;color:#e8e4d9;letter-spacing:.05em;margin-top:18px;line-height:2}
.lead{font-family:"Shippori Mincho",serif;font-size:clamp(19px,2.2vw,24px);letter-spacing:.05em;color:#fffdf7;line-height:1.8}
.head-c{text-align:center;max-width:760px;margin:0 auto 56px}
/* ===== page hero (sub pages) ===== */
.page-hero{min-height:62vh;display:flex;align-items:center;overflow:hidden;padding:140px 0 90px}
.page-hero.tall{min-height:78vh}
.page-hero::before{content:"";position:absolute;right:-3%;top:6%;width:440px;height:440px;border-radius:50%;z-index:0;background:radial-gradient(circle at 42% 40%,#fffaf0 0%,#f3ead4 32%,rgba(214,189,134,.26) 58%,rgba(214,189,134,0) 70%)}
.page-hero.left::before{left:-6%;right:auto}
.page-hero .inner{position:relative;z-index:3;width:100%}
.page-hero h1{font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(34px,5vw,60px);line-height:1.4;letter-spacing:.05em;color:#fffdf7;text-shadow:0 2px 30px rgba(12,18,40,.5)}
.page-hero .sub{margin-top:24px;font-size:15px;color:#e3e0d7;letter-spacing:.05em;max-width:34em;text-shadow:0 1px 16px rgba(12,18,40,.66)}
.page-hero .eyebrow{text-shadow:0 1px 12px rgba(12,18,40,.55)}
.page-hero .cta-row{margin-top:38px;display:flex;gap:18px;flex-wrap:wrap;align-items:center}
/* grids */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.grid-2.wide{gap:72px}
/* ===== glass cards ===== */
.glass{position:relative;border:1px solid var(--line);border-radius:var(--card-radius);background:var(--glass);backdrop-filter:blur(7px);box-shadow:0 20px 50px rgba(10,16,38,.42),inset 0 1px 0 rgba(255,250,238,.12)}
.card-pad{padding:34px 32px}
/* ===== feature / trust row ===== */
.feat-grid{display:grid;gap:22px}
.feat-5{grid-template-columns:repeat(5,1fr)}
.feat-4{grid-template-columns:repeat(4,1fr)}
.feat-3{grid-template-columns:repeat(3,1fr)}
.feat{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;padding:8px}
.feat .ic{width:46px;height:46px}
.feat .ic svg{width:100%;height:100%;stroke:var(--gold);fill:none;stroke-width:1.2}
.feat h4{font-family:"Shippori Mincho",serif;font-size:15px;letter-spacing:.08em;color:#f6e6bd;font-weight:500;word-break:auto-phrase}
.feat p{font-size:13.5px;letter-spacing:.05em;color:#cfd3df;line-height:1.8;word-break:auto-phrase}
.feat .en{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:10px;letter-spacing:.16em;color:var(--gold2)}
/* ===== horizontal timeline ===== */
.timeline-h{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:relative}
.timeline-h::before{content:"";position:absolute;left:8%;right:8%;top:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.tl-item{text-align:center;position:relative}
.tl-node{width:14px;height:14px;border-radius:50%;background:var(--gold);margin:28px auto 22px;box-shadow:0 0 0 6px rgba(214,189,134,.16),0 0 16px rgba(240,207,159,.5)}
.tl-year{font-family:"Cormorant Garamond",serif;font-size:30px;font-weight:600;color:var(--accent);letter-spacing:.04em}
.tl-title{font-family:"Shippori Mincho",serif;font-size:14.5px;color:#fffdf7;margin:8px 0 8px;font-weight:500}
.tl-desc{font-size:13.5px;color:#cfd3df;line-height:1.8}
/* vertical timeline */
.timeline-v{position:relative;padding-left:30px}
.timeline-v::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:linear-gradient(180deg,transparent,var(--gold),transparent)}
.tv{position:relative;padding:0 0 34px 0}
.tv::before{content:"";position:absolute;left:-30px;top:6px;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px rgba(214,189,134,.15)}
.tv .y{font-family:"Cormorant Garamond",serif;font-size:22px;color:var(--accent);font-weight:600}
.tv .e{font-size:14px;color:#e7e3d8;margin-top:4px;line-height:1.8}
/* ===== product cards ===== */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.prod-card{overflow:hidden;display:flex;flex-direction:column;transition:transform .4s,box-shadow .4s,border-color .4s}
.prod-card:hover{transform:translateY(-10px);border-color:var(--gold);box-shadow:0 30px 64px rgba(10,16,38,.5),0 0 30px rgba(240,207,159,.16)}
.prod-card .pimg{aspect-ratio:1/1;overflow:hidden;position:relative;background:radial-gradient(62% 66% at 50% 46%,rgba(255,255,255,.13),rgba(255,255,255,0) 72%),linear-gradient(158deg,rgba(255,255,255,.10),rgba(150,178,216,.04) 50%,rgba(255,255,255,.07))}
.prod-card .pimg img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.prod-card:hover .pimg img{transform:scale(1.05)}
.prod-card .phase{position:absolute;top:14px;left:14px;display:flex;align-items:center;gap:8px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:12px;letter-spacing:.06em;color:#1b1407;background:rgba(246,238,222,.82);padding:5px 12px;border-radius:30px}
.prod-card .pbody{padding:26px 24px 30px;text-align:center;flex:1;display:flex;flex-direction:column}
.prod-card h3{font-family:"Cormorant Garamond",serif;font-size:25px;font-weight:500;letter-spacing:.04em;color:#fffdf7}
.prod-card .jp{font-family:"Shippori Mincho",serif;font-size:13px;color:var(--accent);letter-spacing:.08em;margin-top:4px}
.prod-card .desc{font-size:14px;color:#d2d6e2;line-height:1.9;margin:16px 0}
.prod-card .price{font-size:14px;color:#fffdf7;letter-spacing:.06em;margin-top:auto}
.prod-card .price small{font-size:11px;color:var(--muted)}
.prod-card .shop{margin-top:18px}
.shop-btn{display:inline-block;width:100%;text-align:center;background:linear-gradient(135deg,#e6cf98,#c4a468);color:#1b1407;padding:13px;border-radius:6px;font-size:12.5px;letter-spacing:.14em;font-weight:500;transition:filter .3s}
.shop-btn:hover{filter:brightness(1.07)}
/* moon phase cards */
.moon-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.mcard{overflow:hidden;box-shadow:0 12px 30px rgba(10,16,38,.22),inset 0 1px 0 rgba(255,250,238,.10);transition:transform .4s,box-shadow .4s,border-color .4s}
.mcard:hover{transform:translateY(-10px);border-color:var(--gold);box-shadow:0 20px 42px rgba(10,16,38,.30),0 0 26px rgba(240,207,159,.16)}
.mcard .img{aspect-ratio:1.45/1;overflow:hidden;background:#0e1730}
.mcard .img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.mcard:hover .img img{transform:scale(1.06)}
.mcard .body{padding:24px 16px 30px;text-align:center;background:linear-gradient(158deg,#456a96,#2c416f)}
.mcard .en{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:12px;color:var(--gold);letter-spacing:.06em}
.mcard h3{font-family:"Shippori Mincho",serif;font-size:18px;letter-spacing:.18em;color:#f6e6bd;font-weight:500;margin-top:4px}
.mcard .rule{width:26px;height:1px;background:var(--gold);margin:13px auto}
.mcard p{font-size:13.5px;color:#d2d6e2;letter-spacing:.03em;line-height:1.9}
@media(max-width:940px){.moon-grid{grid-template-columns:repeat(2,1fr);gap:22px}}
/* showcase band (framed photo) */
.frame{position:relative;border-radius:var(--card-radius);overflow:hidden;border:1px solid var(--line);box-shadow:0 26px 64px rgba(10,16,38,.5),inset 0 1px 0 rgba(255,250,238,.12)}
.frame::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(80,120,180,0),rgba(20,30,58,.26));pointer-events:none}
.frame img{width:100%;display:block}
/* === 実写ストック写真：青の世界観へ統合する修飾 === */
.frame.photo img{aspect-ratio:16/9;object-fit:cover;filter:saturate(.9) brightness(.97) contrast(1.02)}
.frame.photo::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(160deg,rgba(70,106,150,.20),rgba(28,40,72,.30));mix-blend-mode:multiply}
.frame.photo.lab img{filter:saturate(.74) brightness(.95) hue-rotate(-10deg)}
/* ラボ写真：金枠と硬いエッジを弱め、周縁を宵の青へフェードさせて背景と馴染ませる（明るさは維持） */
.frame.photo.lab{border-color:rgba(140,168,205,.16);box-shadow:0 34px 78px rgba(10,16,38,.48)}
.frame.photo.lab::after{background:radial-gradient(128% 138% at 50% 38%,rgba(77,118,160,0) 40%,rgba(60,92,138,.30) 75%,rgba(48,72,116,.52) 100%)}
.grid-2 .frame.photo img,figure .frame.photo img{aspect-ratio:4/5}
#ritual .frame.photo img{aspect-ratio:16/10;object-position:72% 32%}
.inner-band .frame.photo img{aspect-ratio:21/9;object-position:50% 42%;filter:brightness(.93) saturate(.88)}
.support-visual img{aspect-ratio:4/3;object-fit:cover}
.concept-visual img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;filter:saturate(.92) brightness(.98) contrast(1.02)}
.utility-visual img{aspect-ratio:16/8;object-fit:cover;object-position:50% 50%;filter:saturate(.88) brightness(.96) contrast(1.02)}
@media(max-width:940px){.grid-2 .frame.photo img,figure .frame.photo img{aspect-ratio:3/2}.inner-band .frame.photo img{aspect-ratio:16/9}}
/* ===== definition / spec table (company, tokusho) ===== */
.spec{border-top:1px solid var(--line)}
.spec .row{display:grid;grid-template-columns:230px 1fr;gap:24px;padding:20px 8px;border-bottom:1px solid rgba(214,189,134,.16);align-items:start}
.spec .row:nth-child(odd){background:rgba(255,255,255,.025)}
.spec dt,.spec .k{font-family:"Shippori Mincho",serif;font-size:14px;color:var(--accent);letter-spacing:.06em}
.spec dd,.spec .v{font-size:15px;color:#e7e3d8;line-height:1.9}
.spec .v small{display:block;font-size:11.5px;color:var(--muted);margin-top:4px}
.spec a{color:var(--gold);text-decoration:underline}
/* ===== policy (index sidebar + content) ===== */
.policy{display:grid;grid-template-columns:240px 1fr;gap:54px;align-items:start}
.pol-index{position:sticky;top:110px}
.pol-index .lbl{font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:.2em;color:var(--gold);font-size:13px;margin-bottom:18px}
.pol-index ol{list-style:none;display:flex;flex-direction:column;gap:12px}
.pol-index a{display:flex;gap:12px;font-size:13.5px;color:var(--muted);transition:color .3s}
.pol-index a:hover,.pol-index a.active{color:var(--accent)}
.pol-index a .n{font-family:"Cormorant Garamond",serif;color:var(--gold);font-size:13px}
.pol-card{margin-top:30px;text-align:center;padding:26px 20px}
.pol-card .ic{width:40px;height:40px;margin:0 auto 12px}
.pol-card .ic svg{width:100%;height:100%;stroke:var(--gold);fill:none;stroke-width:1.2}
.pol-card p{font-size:13.5px;color:#dcd9d0;line-height:1.8}
.pol-sec{padding:6px 0 30px;border-bottom:1px solid rgba(214,189,134,.14);margin-bottom:30px}
.pol-sec:last-child{border-bottom:none}
.pol-sec .num{font-family:"Cormorant Garamond",serif;font-size:30px;color:var(--gold);font-weight:600;float:left;margin:-4px 18px 0 0;line-height:1}
.pol-sec h3{font-family:"Shippori Mincho",serif;font-size:18px;color:#fffdf7;font-weight:500;letter-spacing:.06em;margin-bottom:14px;padding-top:6px}
.pol-sec p{font-size:15px;color:#dcd9d0;line-height:2}
.pol-sec ul{margin:12px 0 0;padding-left:0;list-style:none}
.pol-sec li{font-size:14px;color:#dcd9d0;line-height:1.9;padding-left:18px;position:relative}
.pol-sec li::before{content:"";position:absolute;left:0;top:12px;width:5px;height:5px;border-radius:50%;background:var(--gold)}
/* ===== form ===== */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:start}
.field{margin-bottom:24px}
.field label{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.06em;color:#f0ecdf;margin-bottom:9px}
.req{font-size:10px;letter-spacing:.08em;background:#c98a8a;color:#241014;padding:2px 8px;border-radius:4px}
.opt{font-size:10px;letter-spacing:.08em;color:var(--muted);border:1px solid rgba(255,255,255,.2);padding:1px 8px;border-radius:4px}
.field input,.field select,.field textarea{width:100%;background:rgba(12,18,38,.4);border:1px solid var(--line);border-radius:10px;padding:14px 16px;color:var(--text);font-family:inherit;font-size:14px;font-weight:300;transition:border-color .3s,box-shadow .3s}
.field input::placeholder,.field textarea::placeholder{color:#8a90a4}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(214,189,134,.16)}
.field textarea{min-height:150px;resize:vertical}
.field select{appearance:none;background-image:url("data:image/svg+xml;utf8,");background-repeat:no-repeat;background-position:right 16px center}
.consent{font-size:12px;color:var(--muted);margin:6px 0 18px}
.consent a{color:var(--gold);text-decoration:underline}
.form-note{display:none;margin-top:18px;padding:14px 18px;border-radius:10px;background:rgba(214,189,134,.12);border:1px solid var(--line);font-size:13px;color:var(--accent)}
/* choice cards (contact categories) */
.choice{display:flex;flex-direction:column;gap:16px}
.choice-card{display:flex;align-items:center;gap:18px;padding:22px 24px;cursor:pointer;transition:transform .3s,border-color .3s,box-shadow .3s}
.choice-card:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 16px 40px rgba(10,16,38,.4)}
.choice-card .ic{width:42px;height:42px;flex:none}
.choice-card .ic svg{width:100%;height:100%;stroke:var(--gold);fill:none;stroke-width:1.2}
.choice-card .tx{flex:1}
.choice-card h4{font-family:"Cormorant Garamond",serif;font-size:20px;color:#fffdf7;font-weight:500;letter-spacing:.04em}
.choice-card .sl{font-family:"Shippori Mincho",serif;font-size:12.5px;color:var(--accent);margin:2px 0 4px}
.choice-card p{font-size:12px;color:#cfd3df;line-height:1.7}
.choice-card .go{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex:none;color:var(--gold)}
/* reassurance / check list */
.checks{list-style:none;display:flex;flex-direction:column;gap:12px;margin-top:8px}
.checks li{display:flex;gap:12px;font-size:13px;color:#dcd9d0;line-height:1.7}
.checks li::before{content:"✓";color:var(--gold);font-weight:700}
/* ===== CTA bands ===== */
.cta-dark{position:relative;overflow:hidden;padding:120px 0;text-align:left}
.cta-dark::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(60% 44% at 50% 32%,rgba(255,243,220,.14),transparent 70%),radial-gradient(140% 78% at 50% 122%,rgba(176,224,246,.4),transparent 60%)}
.cta-inner{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:50px;flex-wrap:wrap}
.cta-inner h2{font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(26px,3.4vw,40px);letter-spacing:.1em;color:#fffdf7;line-height:1.6}
.cta-inner p{margin-top:16px;color:#e7e3d8;font-size:14px}
.moonpin{position:absolute;right:7%;top:16%;width:60px;height:60px;border-radius:50%;z-index:1;background:radial-gradient(circle at 40% 36%,#fffaf0,#efe2c8 55%,#d6bd86);box-shadow:0 0 46px rgba(240,207,159,.5);animation:moonbob 8s ease-in-out infinite}
@keyframes moonbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
/* dual cta */
.cta-split{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.cta-col{padding:48px 44px}
.cta-col .eyebrow{margin-bottom:10px}
.cta-col h3{font-family:"Shippori Mincho",serif;font-size:22px;color:#fffdf7;font-weight:500;line-height:1.6;margin-bottom:26px}
/* ===== trust strip ===== */
.trust{padding:64px 0;background:#5582a8;border-top:1px solid rgba(255,255,255,.25)}
/* ブルー背景で視認性を確保：文字・アイコンを明色（クリーム／ゴールド）に */
.trust .feat h4{color:#fffdf7}
.trust .feat p{color:#eef2f8;text-shadow:0 1px 8px rgba(16,26,52,.35)}
.trust .feat .en{color:var(--accent)}
.trust .feat .ic svg{stroke:var(--gold)}
/* ===== footer ===== */
footer{background:#111d3c;color:#c4c0cd;padding:72px 0 30px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.08)}
.foot-brand .b{font-family:"Cormorant Garamond",serif;font-size:26px;letter-spacing:.34em;color:#f1eadb}
.foot-brand .s{font-family:"Cormorant Garamond",serif;font-size:10px;letter-spacing:.3em;color:var(--gold2);margin:4px 0 16px}
.foot-brand p{font-size:13px;color:#a9a6b6;line-height:1.9;max-width:24em}
.foot-soc{display:flex;gap:14px;margin-top:18px}
.foot-soc a{width:34px;height:34px;border:1px solid rgba(255,255,255,.16);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold);transition:background .3s,border-color .3s}
.foot-soc a:hover{background:rgba(214,189,134,.14);border-color:var(--gold)}
.foot-soc svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.4}
.foot-col h5{font-family:"Cormorant Garamond",serif;font-size:13px;letter-spacing:.18em;color:var(--gold);margin-bottom:16px}
.foot-col a{display:block;position:relative;font-size:13.5px;letter-spacing:.06em;color:#bdb9c6;margin-bottom:11px;transition:color .3s}
.foot-col a:hover{color:var(--gold)}
.foot-col .hrs{font-size:13px;color:#a9a6b6;margin-bottom:16px;line-height:1.8}
.copy{margin-top:26px;font-family:"Cormorant Garamond",serif;font-size:12px;letter-spacing:.16em;color:#787590;text-align:center}
/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity 1s ease,transform 1s ease}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}
/* ===== responsive ===== */
@media(max-width:940px){
header{padding:13px 22px}
header.scrolled{padding:13px 22px}
nav.main,.hdr-right .pill{display:none}
.menu-btn{display:flex}
section{padding:80px 0}
/* サブページヒーロー：スマホでは vh 依存をやめ、余白を実寸で最適化 */
.page-hero{min-height:auto;padding:126px 0 64px}
.page-hero.tall{min-height:auto}
.grid-2,.form-grid{grid-template-columns:1fr;gap:40px}
.timeline-h{grid-template-columns:repeat(2,1fr);gap:34px}
.timeline-h::before{display:none}
.feat-5,.feat-4{grid-template-columns:repeat(2,1fr);gap:30px}
.feat-3{grid-template-columns:1fr;gap:26px}
.prod-grid{grid-template-columns:1fr;gap:26px}
.policy{grid-template-columns:1fr;gap:30px}
.pol-index{position:static}
.pol-index ol{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}
.pol-index a{padding:8px 0}
.spec .row{grid-template-columns:1fr;gap:6px;padding:16px 6px}
.cta-split{grid-template-columns:1fr}
.cta-inner{flex-direction:column;text-align:center}
.moonpin{display:none}
.foot-grid{grid-template-columns:1fr 1fr;gap:30px}
/* スマホ：ヒーローの月の光は見出しに被らないよう画面端へ逃がす */
.page-hero::before{width:300px;height:300px;right:-34%;top:-6%;opacity:.8}
.page-hero.left::before{left:-34%;right:auto}
}
@media(max-width:560px){
.wrap{padding:0 22px}
section{padding:64px 0}
.feat-5,.feat-4{grid-template-columns:1fr}
.foot-grid{grid-template-columns:1fr}
.page-hero{padding:112px 0 56px}
.grid-2,.form-grid{gap:32px}
.cta-dark{padding:88px 0}
.cta-col{padding:38px 28px}
.card-pad{padding:28px 24px}
.btn-gold,.btn-outline{gap:22px;padding:15px 26px;letter-spacing:.12em}
/* サブページ・ヒーロー見出し：スマホで語中改行しない寸法へ */
.page-hero h1{font-size:clamp(27px,7.4vw,34px);letter-spacing:.03em}
/* iOSの入力フォーカス時オートズーム防止（16px以上） */
.field input,.field select,.field textarea{font-size:16px}
/* 選ばれる理由：番号と本文の詰まりで見出しが語中で割れるのを緩和 */
.reason{padding:24px 22px;gap:16px}
.reason h4{font-size:15px;letter-spacing:.02em;word-break:auto-phrase}
}
/* ===== 画像挿入予定プレースホルダー ===== */
.frame.photo.is-ph{aspect-ratio:16/9}
.grid-2 .frame.photo.is-ph,figure .frame.photo.is-ph{aspect-ratio:4/5}
#ritual .frame.photo.is-ph{aspect-ratio:16/10}
.inner-band .frame.photo.is-ph{aspect-ratio:21/9}
.frame.photo.is-ph::before,.frame.photo.is-ph::after{display:none}
.frame.photo.is-ph .ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:26px;text-align:center;background:repeating-linear-gradient(135deg,rgba(255,255,255,.055) 0 14px,rgba(255,255,255,.02) 14px 28px);border:1px dashed rgba(214,189,134,.5);color:#cdd4e0}
.ph svg{width:42px;height:42px;stroke:var(--accent);fill:none;stroke-width:1.2;opacity:.85}
.ph .ph-t{font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:.2em;font-size:14px;color:var(--accent)}
.ph .ph-d{font-size:12px;letter-spacing:.05em;color:#aeb6c6;line-height:1.75;max-width:26em}
@media(max-width:940px){.grid-2 .frame.photo.is-ph,figure .frame.photo.is-ph{aspect-ratio:3/2}.inner-band .frame.photo.is-ph{aspect-ratio:16/9}}
/* ===== 日本語タイポグラフィ：折り返し最適化 ===== */
h1,h2,h3,h4,.sec-title,.page-hero h1,.cta-inner h2{text-wrap:balance;line-break:strict}
.sec-sub,.page-hero .sub,.lead,.pd-lead,p.sub,.pd-points li,.prod-card .desc{text-wrap:pretty;line-break:strict}
/* ============================================================
ボリューム増強用の共通パーツ（2026-07 追加）
アンカーナビ / FAQ / 脚注 / テクスチャー / トラストバー / 選ばれる理由 / 使い方ステップ
============================================================ */
/* ----- 在ページ内アンカーナビ ----- */
.anchornav{display:flex;flex-wrap:wrap;gap:10px 12px;justify-content:center;margin:2px auto 0;max-width:860px}
.anchornav a{font-size:12.5px;letter-spacing:.1em;color:var(--muted);border:1px solid var(--line);border-radius:30px;padding:11px 20px;transition:color .3s,border-color .3s,background .3s}
.anchornav a:hover{color:#1b1407;background:var(--gold);border-color:var(--gold)}
/* ----- FAQ アコーディオン（details/summary） ----- */
.faq{max-width:860px;margin:0 auto;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid rgba(214,189,134,.16)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:16px;padding:22px 6px;font-family:"Shippori Mincho",serif;font-size:15.5px;letter-spacing:.04em;color:#fffdf7;line-height:1.7;transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";font-family:"Cormorant Garamond",serif;font-style:italic;font-size:19px;color:var(--gold);line-height:1.3;flex:none}
.faq summary .qx{flex:1}
.faq summary::after{content:"";margin-top:7px;width:9px;height:9px;border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(45deg);transition:transform .3s;flex:none}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq summary:hover{color:var(--accent)}
.faq .a{display:flex;gap:16px;padding:0 6px 24px 30px;font-size:13.5px;line-height:2.05;color:#d2d6e2}
.faq .a::before{content:"A";font-family:"Cormorant Garamond",serif;font-style:italic;font-size:19px;color:var(--accent);flex:none;line-height:1.3;margin-left:-30px}
.faq .a small{color:var(--muted);font-size:11.5px}
/* ----- 薬機法配慮の脚注 ----- */
.legal-note{font-size:11.5px;color:var(--muted);line-height:1.9;letter-spacing:.03em;margin-top:16px}
.legal-note b{color:#c7cbd8;font-weight:500}
.legal-note.box{border:1px solid var(--line);border-radius:12px;padding:16px 18px;background:rgba(12,18,38,.28)}
/* ----- テクスチャー・使用感チップ ----- */
.tx-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.tx-chip{font-size:12px;letter-spacing:.05em;color:var(--accent);border:1px solid var(--line);border-radius:30px;padding:6px 15px;background:rgba(214,189,134,.06)}
/* ----- 送料・お届けのトラストバー ----- */
.shipbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 34px;padding:24px 28px}
.shipbar .si{display:flex;align-items:center;gap:13px;font-size:13.5px;color:#e7e3d8;letter-spacing:.04em;line-height:1.7}
.shipbar .si svg{width:26px;height:26px;stroke:var(--gold);fill:none;stroke-width:1.2;flex:none}
.shipbar .si b{font-family:"Shippori Mincho",serif;color:#fffdf7;font-weight:500}
.shipbar .sep{width:1px;height:26px;background:var(--line)}
@media(max-width:640px){.shipbar .sep{display:none}.shipbar{gap:16px}}
/* ----- 選ばれる理由（お客様の声の代替） ----- */
.reasons{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.reason{display:flex;gap:20px;padding:28px 30px}
.reason .rn{font-family:"Cormorant Garamond",serif;font-size:30px;font-weight:600;color:var(--gold);line-height:1;flex:none}
.reason h4{font-family:"Shippori Mincho",serif;font-size:16px;color:#fffdf7;font-weight:500;letter-spacing:.05em;margin-bottom:9px}
.reason p{font-size:13.5px;color:#cfd3df;line-height:1.95}
@media(max-width:860px){.reasons{grid-template-columns:1fr}}
/* ----- 使い方ステップ（番号つき） ----- */
.usesteps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.usestep{padding:30px 26px;text-align:center;position:relative}
.usestep .un{font-family:"Cormorant Garamond",serif;font-size:34px;font-weight:600;color:var(--gold);line-height:1}
.usestep h4{font-family:"Shippori Mincho",serif;font-size:16px;color:#fffdf7;font-weight:500;margin:8px 0 6px;letter-spacing:.04em}
.usestep .amt{font-size:12px;color:var(--accent);letter-spacing:.05em;margin-bottom:10px}
.usestep p{font-size:13px;color:#cfd3df;line-height:1.95}
@media(max-width:860px){.usesteps{grid-template-columns:1fr;gap:18px}}
/* ============================================================
明色セクション（白帯）— 青一色の単調さを軽減（2026-07 追加）
使い方：白にしたい の class に "sec-light" を足す。
既存 #products / .form-sky のダーク文字パレットを流用。
子孫セレクタ（.sec-light .xxx）でページ埋め込み