/* Visual refinement — content and links are preserved in index.html. */
:root{
  --ink:#1b302d;--ink-soft:#52645d;--paper:#f6f7f2;--sheet:#fff;
  --safe:#27664e;--safe-deep:#174d38;--safe-tint:#e9f0e9;--rule:#d7dfd6;
  --gutter:clamp(22px,5vw,72px);--measure:42rem;
  --display:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Noto Sans JP","Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
}
body{font-family:var(--sans);font-size:17px;line-height:1.95;letter-spacing:.025em;-webkit-font-smoothing:antialiased}
.wrap{max-width:1280px}
main{overflow:clip}
.shader-bg{position:relative;isolation:isolate}
section{padding:clamp(80px,10vw,144px) 0;scroll-margin-top:88px}
h1,h2{font-family:var(--display);font-weight:600;font-feature-settings:"palt";line-height:1.5;letter-spacing:-.035em;overflow-wrap:anywhere}
h2{font-size:clamp(30px,3.8vw,53px);margin-bottom:32px}
h3{font-weight:600;letter-spacing:.015em}
p{margin-bottom:1.25em}
.prose{line-height:2.05}
a,input,summary{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid var(--focus);outline-offset:5px}
.site-head{background:rgba(246,247,242,.9);backdrop-filter:blur(20px);border-color:rgba(27,48,45,.13)}
.site-head .wrap{height:82px}
.brand{gap:12px;font-size:16px;letter-spacing:.035em}
.brand svg{width:31px;height:31px}
.brand small{font-size:10px;letter-spacing:.06em;margin-top:6px}
.btn{min-height:55px;padding:1em 1.8em;border-radius:6px;font-size:15px;letter-spacing:.035em;box-shadow:0 8px 24px rgba(23,77,56,.1);transition:background .25s,border-color .25s,transform .25s,box-shadow .25s}
.btn::after{content:"↗";font-family:var(--sans);font-size:1.2em;margin-left:1.15em;transition:transform .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(23,77,56,.16)}
.btn:hover::after{transform:translate(2px,-2px)}
.btn--small{min-height:42px;font-size:13px;padding:.75em 1.15em}
.btn--small::after{margin-left:.5em}

/* Large editorial typography, with a light veil above the living sea. */
.hero{padding:0 0 clamp(64px,8vw,110px)}
.hero-visual{min-height:clamp(760px,95svh,1040px);position:relative}
.hero-visual::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(243,247,243,.93),rgba(243,247,243,.79) 48%,rgba(243,247,243,.06) 85%)}
.hero-copy{padding-top:clamp(65px,8.3vw,120px);padding-bottom:220px}
.hero h1{font-size:clamp(41px,6.5vw,88px);line-height:1.48;max-width:none;letter-spacing:-.055em}
.hero h1 .nb{display:block;width:fit-content}
.hero h1 .nb:first-child{font-size:.48em;line-height:1.3;letter-spacing:.02em;margin-bottom:.25em}
.hero h1 .nb:last-child{color:var(--safe-deep)}
.hero .lead{font-size:clamp(16px,1.45vw,19px);max-width:39em;line-height:1.95;margin-top:30px;text-wrap:pretty}
.hero-cta{margin-top:30px;gap:18px 26px}
.hero-cta .note{font-size:13px;max-width:24em;line-height:1.9;color:#334d44}
.doors{margin-top:clamp(44px,6vw,80px);gap:28px;grid-template-columns:1fr 42px 1fr}
.door-col{padding:32px;border-radius:12px;border-color:var(--rule);box-shadow:0 16px 45px rgba(27,48,45,.035)}
.door-col h3{font-size:19px;font-weight:700}
.door-col .sub{margin-top:6px;margin-bottom:24px;font-size:13px}
.door-col--after{background:#edf3eb;border-color:#729080;box-shadow:none}
.door-list li{padding:12px 14px;font-size:14px;border-left-width:2px;background:#f6eee5;border-radius:4px}
.tag{font-size:11px}
.after-main{background:#fff;border-left-width:2px;border-radius:5px;padding:22px 18px;margin-bottom:18px}
.after-main strong{font-size:22px}
.after-main span{display:block;margin-top:6px;font-size:13px}
.after-row{padding:14px 10px;font-size:14px;flex-wrap:wrap}
.doors-caption{font-size:13px;line-height:1.9;margin-top:0}
.incident{grid-template-columns:1fr 1.1fr;gap:clamp(36px,6vw,88px)}
.incident .date{font-family:var(--sans);font-size:12px;letter-spacing:.15em;margin-bottom:24px}
.incident h2{font-size:clamp(30px,3.5vw,46px)}
.incident .prose{padding-top:7px}
.incident-scene{background:#eef3e9}
.incident-scene::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(246,247,242,.12);pointer-events:none}
.incident-scene .incident{align-items:center}
.incident-scene .prose{background:rgba(246,247,242,.9);padding:30px 32px;border-radius:12px}
.incident-scene .prose p:last-child{margin-bottom:0}
section[aria-labelledby="check"]{background:#edf1ea}
section[aria-labelledby="check"] h2{margin-bottom:20px}
section[aria-labelledby="check"] .prose{margin-bottom:36px}
.check{max-width:none;padding:24px 38px 34px;border-radius:12px;box-shadow:0 18px 50px rgba(27,48,45,.035)}
.check ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px}
.check li+li{border-top:0}
.check li{border-bottom:1px solid var(--rule)}
.check label{padding:20px 0;font-size:15px;gap:13px;height:100%;align-items:flex-start;line-height:1.8}
.check input{width:22px;height:22px;margin-top:3px;border-width:1.5px;transition:background .2s,border-color .2s}
.tally{border:0;margin-top:25px;padding-top:0;gap:10px 18px}
.tally .num{font-family:var(--sans);font-size:64px;font-weight:500;letter-spacing:-.08em;color:var(--safe-deep)}
.tally .of,.tally .judge{font-size:14px}
.tally .judge{margin:0}

/* Aurora: a quiet dark chapter, with readable solid-backed cards. */
.merits{background:#102b26;color:#f2f6ef;border-top:0;position:relative}
.merits::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(5,22,19,.45);pointer-events:none}
.merits h2{color:#f4f7ee;max-width:15em;font-size:clamp(33px,4.3vw,60px);margin-bottom:54px}
.benefits{max-width:none;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
.benefits div{padding:30px 26px 32px;border:1px solid rgba(207,232,214,.18);border-radius:8px;background:rgba(9,30,25,.84)}
.benefits dt{display:block;font-size:18px;line-height:1.65;margin-bottom:15px;letter-spacing:0}
.benefits dt svg{width:29px;height:29px;color:#b5d5b9;margin-bottom:24px}
.benefits dd{color:#d3e1d6;font-size:14px;line-height:1.95}
.notfor{max-width:none;background:rgba(8,24,21,.9);border:1px solid rgba(216,230,214,.25);border-radius:8px;margin-top:32px;padding:26px 30px;color:#e3eadf}
.notfor h3{font-size:17px;color:#fff}
.notfor ul{font-size:14px;columns:2;column-gap:40px;margin:15px 0}
.notfor li{break-inside:avoid;margin-bottom:5px}
.notfor p{font-size:14px;color:#d3e1d6}

/* Prismatic light stays behind the price introduction, away from the figures. */
.pricing{position:relative;background:#edf1e9}
.pricing::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(246,247,242,.74);pointer-events:none}
.pricing-layout{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.4fr);gap:clamp(36px,6vw,90px);align-items:start}
.section-intro{position:sticky;top:128px}
.pricing h2{font-size:clamp(50px,7vw,90px);margin-bottom:28px}
.section-intro p{font-size:16px;line-height:2.1}
.sheet{max-width:none;min-width:0;border:0;border-radius:12px;padding:clamp(24px,3vw,42px);box-shadow:0 20px 60px rgba(27,48,45,.06)}
.sheet h3{font-size:17px;letter-spacing:.035em;margin-bottom:15px}
.sheet h3:not(:first-child){margin-top:42px;padding-top:30px;border-top:1px solid var(--rule)}
.price-table{font-size:14px}
.price-table th,.price-table td{padding:15px 0}
.price-table .yen{font-family:var(--sans);font-size:26px;font-weight:500;letter-spacing:-.04em}
.price-table tr.monthly .yen{font-size:clamp(29px,3vw,38px)}
.price-table .tax{font-size:11px;letter-spacing:.02em;margin-top:5px}
.price-table small{font-size:11px;line-height:1.7}
.includes{font-size:13px;line-height:1.95;columns:1;margin-top:22px}
.includes li{padding-left:2px;margin-bottom:5px}
.mail-opts{gap:9px;grid-template-columns:1fr}
.mail-opts div{display:grid;grid-template-columns:135px 1fr;gap:12px;border:0;border-bottom:1px solid var(--rule);padding:16px;background:#f4f6f0;border-radius:3px}
.mail-opts strong{font-size:13px;line-height:1.7;margin:0}
.mail-opts span{font-size:12px;line-height:1.8}
.fineprint{font-size:12px;line-height:1.95}

/* Contour lines, intentionally pale so long-form reading stays comfortable. */
.process{background:#edf2e9;position:relative}
.process::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(246,247,242,.72);pointer-events:none}
.process-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,7vw,100px);align-items:start}
.process h2{font-size:clamp(32px,4vw,53px);max-width:9em}
.flow{max-width:none;padding-top:6px}
.flow li{grid-template-columns:55px 1fr;gap:20px;padding-bottom:34px}
.flow li::before{width:46px;height:46px;background:var(--paper);border:1px solid #8a9e8e;font-size:17px;font-weight:500}
.flow li:not(:last-child)::after{left:23px;top:48px;border-width:1px}
.flow strong{font-size:19px;padding-top:3px;margin-bottom:7px}
.flow span{font-size:14px;line-height:1.95;display:block}
section[aria-labelledby="faq"] .wrap{display:grid;grid-template-columns:.75fr 1.25fr;gap:60px}
section[aria-labelledby="faq"] h2{font-size:clamp(30px,3.5vw,46px)}
.faq{max-width:none}
.faq summary{font-size:15px;padding:25px 36px 25px 0;font-weight:500}
.faq details p{font-size:14px;line-height:2;padding-right:20px}
.apply{padding:clamp(90px,12vw,170px) 0;background:#06141e}
.apply::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(2,12,19,.85),rgba(2,12,19,.5));pointer-events:none}
.apply .grid{grid-template-columns:1.3fr .7fr;gap:clamp(36px,7vw,100px)}
.apply h2{font-size:clamp(36px,4.9vw,67px);line-height:1.6;letter-spacing:-.04em;margin-bottom:28px}
.apply p,.apply li{font-size:15px;line-height:2;color:#e3ebe7;text-shadow:none}
.apply ul{margin:22px 0 32px}
.apply .btn{font-size:15px;min-height:62px;padding:1em 1.65em}
.apply small{color:#c4d1ca;font-size:11px;line-height:1.95;margin-top:24px;max-width:40em}
.apply .promise{margin-top:16px;padding:28px;border:1px solid rgba(233,244,230,.3);background:rgba(6,22,29,.88);border-radius:8px}
.apply .promise h3{font-size:16px;margin-bottom:16px}
.apply .promise p{font-size:13px;line-height:2;color:#dae6de}
section[aria-labelledby="this"]{padding:64px 0}
.this-page{max-width:none;gap:30px;align-items:flex-start}
.this-page .prose{max-width:56rem}
.this-page h2{font-family:var(--sans);font-size:20px!important;font-weight:500;margin-bottom:14px!important;letter-spacing:0}
.this-page p{font-size:14px;line-height:2;margin-bottom:0}
footer{padding:52px 0;font-size:12px;line-height:1.9;background:#eef1e9}
.foot-logos{gap:28px 42px;margin-bottom:28px}
.foot-logos img{height:30px}
.foot-logos .fw{height:27px}

/* JS applies the hidden state only when observation is ready. No-JS stays visible. */
.reveal-pending{opacity:0;transform:translate3d(0,24px,0)}
.reveal-pending.is-visible{opacity:1;transform:translate3d(0,0,0);transition:opacity .8s cubic-bezier(.2,.65,.3,1),transform .8s cubic-bezier(.2,.65,.3,1);transition-delay:var(--reveal-delay,0ms)}
.hero h1 .reveal-pending{transform:translate3d(0,32px,0)}
.hero h1 .is-visible{transform:translate3d(0,0,0)}

@media(min-width:1600px){.hero-copy{padding-top:125px}.hero h1{font-size:96px}}
@media(max-width:1000px){
  .benefits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pricing-layout{grid-template-columns:.6fr 1fr;gap:32px}
  .apply .grid{grid-template-columns:1.25fr .75fr;gap:30px}
  section[aria-labelledby="faq"] .wrap{grid-template-columns:1fr 1.6fr;gap:30px}
}
@media(max-width:820px){
  body{font-size:16px}
  .site-head .wrap{height:70px}
  .brand{font-size:14px;gap:8px}
  .brand svg{width:25px;height:25px}
  .hero-visual{min-height:760px}
  .hero-copy{padding-top:70px;padding-bottom:210px}
  .hero h1{font-size:clamp(37px,7.1vw,59px)}
  .hero .lead{max-width:33em;font-size:16px;margin-top:25px}
  .hero-cta{align-items:flex-start;flex-direction:column;gap:16px}
  .hero-cta .note{max-width:30em}
  .hero-visual::before{background:linear-gradient(180deg,rgba(243,247,243,.95),rgba(243,247,243,.85) 60%,rgba(243,247,243,.06) 100%)}
  .doors{grid-template-columns:1fr;gap:18px}
  .door-col{padding:28px}
  .arrow svg{width:30px;height:30px}
  .incident,.pricing-layout,.process-layout,.apply .grid,section[aria-labelledby="faq"] .wrap{grid-template-columns:1fr;gap:30px}
  .incident h2{max-width:15em}
  .incident-scene .incident{align-items:start}
  .incident-scene .prose{padding:25px}
  .check{padding:16px 26px 28px}
  .check ul{grid-template-columns:1fr}
  .check label{padding:18px 0}
  .notfor ul{columns:1}
  .section-intro{position:static;max-width:40rem}
  .process h2{max-width:none}
  .pricing h2{font-size:64px;margin-bottom:20px}
  .apply h2{font-size:clamp(34px,6.3vw,49px)}
  .apply .promise{max-width:36rem;margin-top:20px}
  .this-page{gap:20px}
  .this-page svg{width:30px;height:30px}
}
@media(max-width:520px){
  :root{--gutter:22px}
  .site-head .wrap{gap:8px;height:66px}
  .site-head .brand{font-size:12px;letter-spacing:0;gap:7px}
  .site-head .brand svg{width:22px;height:22px}
  .site-head .btn--small{font-size:11px;padding:10px 9px;min-height:38px;white-space:nowrap}
  .site-head .btn--small::after{display:none}
  .hero-copy{padding-top:65px;padding-bottom:200px}
  .hero h1{font-size:clamp(31px,7.6vw,40px);line-height:1.65;letter-spacing:-.06em}
  .hero h1 .nb:first-child{font-size:.6em;margin-bottom:.5em}
  .hero .lead{font-size:15px;line-height:2;max-width:25em}
  .hero .btn{font-size:14px}
  .hero-cta .note{font-size:12px;max-width:24em}
  .hero-visual{min-height:760px}
  h2,.incident h2{font-size:30px;line-height:1.65;letter-spacing:-.04em}
  .door-col{padding:23px}
  .door-col h3{font-size:17px}
  .door-list li{font-size:13px;padding:11px 10px;gap:6px}
  .after-main strong{font-size:20px}
  .check{padding:12px 20px 25px}
  .incident-scene .prose{padding:22px 20px}
  .check label{font-size:14px}
  .tally .num{font-size:56px}
  .benefits{grid-template-columns:1fr;gap:12px}
  .benefits div{padding:27px}
  .benefits dt svg{margin-bottom:18px}
  .merits h2{font-size:32px;line-height:1.65;margin-bottom:32px}
  .notfor{padding:24px}
  .sheet{padding:24px 20px}
  .price-table th,.price-table td{padding:12px 0}
  .price-table .yen{font-size:24px}
  .mail-opts div{grid-template-columns:1fr;gap:5px;padding:14px}
  .flow li{grid-template-columns:42px 1fr;gap:14px}
  .flow li::before{width:36px;height:36px;font-size:14px}
  .flow li:not(:last-child)::after{left:18px;top:38px}
  .flow strong{font-size:18px;padding-top:0}
  .apply h2{font-size:34px}
  .apply .btn{font-size:14px;width:100%;padding:1em}
  .apply .promise{padding:24px}
  .this-page{display:block}
  .this-page svg{margin-bottom:20px}
  .this-page h2{font-size:18px!important;line-height:1.8}
  .foot-logos img{max-width:100%;height:auto;max-height:28px}
  .foot-logos .fw{height:25px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
  .reveal-pending{opacity:1!important;transform:none!important}
}
@media print{
  .site-head{position:static}.section-intro{position:static}
  .shader-bg canvas{display:none}.reveal-pending{opacity:1!important;transform:none!important}
  .shader-bg{background:#fff!important;color:#1b302d!important}
  .shader-bg::before{display:none}.shader-bg h2,.shader-bg h3,.shader-bg p,.shader-bg li{color:#1b302d!important}
  .benefits div,.notfor,.apply .promise{background:#fff;color:#1b302d;border-color:#ccc}
  .benefits dd,.notfor p,.apply .promise p{color:#1b302d}
  section{padding:35px 0;break-inside:avoid}
}