:root{
  /* Liverey ブランドカラー */
  --paper:#EAE7DC;
  --paper-2:#E3DFD2;
  --card:#F3F1E8;
  --ink:#22272B;
  --charcoal:#2C3338;
  --olive:#6B7B3A;
  --olive-d:#566026;
  --olive-l:#94A64E;
  --gold:#C9A24B;
  --gold-d:#B08A34;
  --muted:#6E6A5C;
  --line:#CFC9B8;
  --white:#FFFFFF;
  --serif:"Noto Serif JP", Georgia, "Times New Roman", serif;
  --sans:"Noto Sans JP", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fs-base:17px;
  --lh-base:1.9;
  --radius:14px;
  --radius-sm:8px;
  --shadow:0 6px 24px rgba(34,39,43,.08);
  --shadow-sm:0 2px 8px rgba(34,39,43,.06);
  --container:1080px;
  --gap:clamp(48px, 8vw, 96px);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
.skip-link{position:absolute; left:12px; top:12px; z-index:100; background:var(--olive); color:#fff; padding:10px 16px; border-radius:var(--radius-sm); text-decoration:none; line-height:1; transform:translateY(-150%); transition:transform .15s ease}
.skip-link:focus{transform:translateY(0); color:#fff}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:var(--fs-base); line-height:var(--lh-base);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:var(--serif); font-weight:600; line-height:1.4; color:var(--charcoal)}
h1{font-size:clamp(28px,5vw,44px)}
h2{font-size:clamp(24px,4vw,34px)}
h3{font-size:clamp(19px,2.6vw,22px)}
a{color:var(--olive-d)}
img{max-width:100%; height:auto; display:block}
.container{max-width:var(--container); margin-inline:auto; padding-inline:20px}
section{padding-block:var(--gap)}
.section-alt{background:var(--paper-2)}
.lead{font-size:1.06rem; color:var(--muted)}
.center{text-align:center}
.disclaimer{
  font-size:.86rem; color:var(--muted); border-left:3px solid var(--gold);
  padding:10px 14px; background:var(--card); border-radius:var(--radius-sm);
}

.site-header{position:sticky; top:0; z-index:50; background:rgba(234,231,220,.92); backdrop-filter:blur(6px); border-bottom:1px solid var(--line)}
.header-inner{display:flex; align-items:center; justify-content:space-between; min-height:76px; gap:18px}
.brand img{height:40px; width:auto}
.site-nav{display:flex; align-items:center; gap:18px}
.site-nav a{text-decoration:none; color:var(--charcoal); font-weight:700}
.site-nav a[aria-current="page"]{color:var(--olive-d); text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:6px}
.nav-cta{color:var(--charcoal)!important}
.nav-toggle{display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--card); padding:10px}
.nav-toggle span{display:block; height:2px; background:var(--charcoal); margin:6px 0}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:14px 26px; border-radius:999px; border:2px solid var(--olive); background:var(--olive); color:var(--white); font-weight:700; text-decoration:none; cursor:pointer; transition:.2s ease}
.btn:hover{background:var(--olive-d); border-color:var(--olive-d); color:var(--white)}
.btn-outline{background:transparent; color:var(--olive-d)}
.btn-outline:hover{background:var(--olive); color:var(--white)}
.btn-gold{background:var(--gold); border-color:var(--gold); color:var(--charcoal)}
.btn-gold:hover{background:var(--gold-d); border-color:var(--gold-d); color:var(--charcoal)}
.button-row{display:flex; flex-wrap:wrap; gap:14px; align-items:center}

.hero{position:relative; min-height:calc(100svh - 76px); display:grid; align-items:center; color:var(--white); background:url("/assets/img/hero.jpg") center/cover no-repeat}
.hero::before{content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(34,39,43,.78),rgba(34,39,43,.42),rgba(34,39,43,.12))}
.hero .container{position:relative; z-index:1}
.hero h1,.hero .lead{color:var(--white)}
.hero h1{max-width:12em}
.hero .lead{max-width:720px; font-size:1.12rem}
.disclaimer-on-dark{background:rgba(44,51,56,.78); color:#F3F1E8; max-width:680px; border-color:var(--gold)}

.page-hero{padding-block:clamp(48px,8vw,84px); background:linear-gradient(180deg,var(--paper-2),var(--paper))}
.page-hero .lead{max-width:760px}
.badge{display:inline-flex; align-items:center; width:max-content; max-width:100%; padding:4px 12px; border-radius:999px; background:rgba(201,162,75,.22); color:var(--charcoal); font-size:.84rem; font-weight:700}
.card{background:var(--card); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-sm); border-top:4px solid var(--olive)}
.karte-card{border:2px solid var(--gold); box-shadow:var(--shadow)}
.price{display:block; font-family:var(--serif); color:var(--olive-d); font-size:clamp(28px,5vw,42px); line-height:1.2; margin:.25em 0}
.grid-3{display:grid; gap:24px; grid-template-columns:repeat(3,1fr)}
.grid-2{display:grid; gap:28px; grid-template-columns:repeat(2,1fr)}
.value-diagram{display:grid; gap:12px; grid-template-columns:repeat(3,1fr); align-items:center; text-align:center}
.value-node{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:18px 10px; font-weight:700}
.value-node strong{display:block; font-family:var(--serif); font-size:1.15rem}

.steps{counter-reset:step; display:grid; gap:16px; margin:0; padding:0; list-style:none}
.steps li{counter-increment:step; display:grid; grid-template-columns:44px 1fr; gap:14px; align-items:start; background:var(--card); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow-sm)}
.steps li::before{content:counter(step); display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:var(--olive); color:var(--white); font-weight:700}

.table-wrap{overflow-x:auto; border-radius:var(--radius); box-shadow:var(--shadow-sm)}
table{width:100%; border-collapse:collapse; min-width:640px; background:var(--card)}
th,td{padding:14px 16px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top}
thead th{background:#DDE5C4; color:var(--charcoal)}
th[scope="row"]{background:rgba(107,123,58,.10); color:var(--charcoal); font-weight:700; white-space:nowrap}
tbody tr:nth-child(even) td{background:rgba(255,255,255,.28)}

ul.check-list{padding-left:1.2em}
ul.check-list li{margin:.35em 0}
.cta-band{background:var(--olive); color:var(--white); padding-block:clamp(44px,7vw,72px)}
.cta-band h2,.cta-band p{color:var(--white)}
.cta-band .btn-outline{border-color:var(--white); color:var(--white)}
.cta-band .btn-outline:hover{background:var(--white); color:var(--olive-d)}

.faq{display:grid; gap:14px}
.faq details{background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow-sm); overflow:hidden}
.faq summary{list-style:none; cursor:pointer; color:var(--olive-d); font-weight:700; padding:18px 52px 18px 20px; position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:20px; top:18px; font-size:1.4rem; line-height:1; color:var(--gold-d)}
.faq details[open] summary::after{content:"−"}
.faq-body{padding:0 20px 20px}

.contact-form{display:grid; gap:18px; max-width:760px}
label,legend{font-weight:700}
input,textarea,select{width:100%; margin-top:6px; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--white); font:inherit; font-size:16px; color:var(--ink)}
textarea{resize:vertical}
fieldset{border:1px solid var(--line); border-radius:var(--radius); padding:16px; background:var(--card)}
.inline{display:inline-flex; align-items:center; gap:8px; margin-right:18px}
.inline input{width:auto; margin:0}
.consent{display:flex}
.tel-large{font-size:clamp(24px,5vw,34px); font-family:var(--serif); font-weight:700}

.site-footer{background:var(--charcoal); color:#D9D5C7; padding:54px 0 28px}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:28px}
.footer-note{max-width:420px}
.footer-nav{display:grid; gap:6px}
.site-footer a{color:#F3F1E8}
.site-footer a:hover{color:var(--gold)}
.footer-bottom{display:flex; justify-content:space-between; gap:18px; align-items:center; border-top:1px solid rgba(255,255,255,.16); margin-top:32px; padding-top:20px; font-size:.9rem}
.footer-bottom nav{display:flex; flex-wrap:wrap; gap:16px}
.copyright{margin:0}

@media (max-width:900px){
  .nav-toggle{display:block}
  .site-nav{position:absolute; top:76px; left:0; right:0; display:none; grid-template-columns:1fr; gap:0; padding:12px 20px 20px; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:var(--shadow)}
  .site-nav.is-open{display:grid}
  .site-nav a{padding:10px 0}
  .site-nav .btn{margin-top:8px}
}
@media (max-width:820px){
  .grid-3,.grid-2,.footer-grid{grid-template-columns:1fr}
  .value-diagram{grid-template-columns:1fr}
  .footer-bottom{display:block}
}
@media (max-width:600px){
  .brand img{height:32px}
  .header-inner{min-height:68px}
  .site-nav{top:68px}
  .hero{min-height:calc(100svh - 68px)}
  .button-row .btn{width:100%}
  .card{padding:22px}
  .steps li{grid-template-columns:38px 1fr; padding:16px}
  .steps li::before{width:38px; height:38px}
}
