/* ===== CLAIR HOME — shared style (R+house-structure redesign) ===== */
:root{
  --bg:#f9f9f6;
  --ink:#2b2d2f;
  --black:#1c1c1c;
  --gray:#6f6e6c;
  --gray-l:#9a9894;
  --line:#e3e1dc;
  --gold:#b08d57;
  --gold-d:#8f7040;
  --white:#fff;
  --radius:4px;
  --shadow:0 10px 30px rgba(28,28,28,.06);
  --shadow-lg:0 18px 50px rgba(28,28,28,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Noto Sans JP",sans-serif;color:var(--ink);
  line-height:1.9;background:var(--bg);-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px}
.en{font-family:"Montserrat",sans-serif;letter-spacing:.05em}
.serif{font-family:"Noto Serif JP",serif}

/* ---------- Header ---------- */
header{
  position:sticky;top:0;left:0;right:0;z-index:100;
  background:var(--bg);border-bottom:1px solid var(--line);transition:.3s;
}
header.fixed-shadow{box-shadow:0 4px 20px rgba(28,28,28,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:20px 32px;flex-wrap:wrap;gap:14px}
.logo{display:flex;align-items:center;gap:12px}
.logo .mark{
  width:52px;height:52px;flex:none;border-radius:6px;background:var(--black);
  display:flex;align-items:center;justify-content:center;
}
.logo .mark img{width:40px;height:40px;object-fit:contain}
.logo .txt-block{line-height:1.3}
.logo .tagline{display:block;font-size:10.5px;color:var(--gray);font-weight:500;letter-spacing:.05em;margin-bottom:2px}
.logo .name{font-family:"Noto Serif JP",serif;font-size:21px;font-weight:700;color:var(--ink);letter-spacing:.02em}
.head-sub{text-align:right;font-size:12px;color:var(--gray-l);line-height:1.7}
.gnav{display:flex;align-items:center;gap:2px;flex-wrap:wrap;justify-content:flex-end}
.gnav a.menu{
  padding:10px 13px;font-size:13px;font-weight:500;color:var(--ink);
  transition:.2s;letter-spacing:.02em;border-radius:999px;white-space:nowrap;
}
.gnav a.menu:hover{color:var(--gold-d);background:#efece4}
.gnav a.menu.active{background:var(--black);color:#fff}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px}
.hamburger span{width:24px;height:1.5px;background:var(--black);transition:.3s}

/* ---------- Dropdown nav group (R+house "About" mega-menu style) ---------- */
.gnav .has-drop{position:relative}
.gnav .has-drop>.menu::after{content:"";display:inline-block;margin-left:6px;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
.drop-menu{
  position:absolute;top:100%;left:50%;transform:translateX(-50%);min-width:220px;background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:10px;
  opacity:0;pointer-events:none;transition:.2s;z-index:120;
}
.gnav .has-drop:hover .drop-menu{opacity:1;pointer-events:auto}
.drop-menu a{display:block;padding:12px 16px;font-size:13.5px;border-radius:4px;color:var(--ink);transition:.15s}
.drop-menu a:hover{background:#efece4;color:var(--gold-d)}

/* ---------- Fixed side tabs (R+house-style) ---------- */
.side-tabs{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:150;display:flex;flex-direction:column;box-shadow:var(--shadow-lg)}
.side-tabs a{
  width:92px;padding:16px 8px;background:var(--black);color:#fff;text-align:center;
  font-size:11px;letter-spacing:.04em;display:flex;flex-direction:column;align-items:center;gap:8px;
  border-bottom:1px solid rgba(255,255,255,.14);transition:.2s;
}
.side-tabs a:last-child{border-bottom:none}
.side-tabs a:hover{background:var(--gold-d)}
.side-tabs a svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6}

/* ---------- Hero (split-screen, R+house-style) ---------- */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hero-split{position:relative;display:grid;grid-template-columns:1fr 1fr;height:88vh;min-height:520px;background:var(--black);overflow:hidden}
.hero-split .panel{position:relative;overflow:hidden}
.hero-split .panel img{width:100%;height:100%;object-fit:cover}
.hero-split .panel::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.18)}
.hero-mark{
  position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);z-index:3;text-align:center;color:#fff;
  pointer-events:none;
}
.hero-mark .brand{font-family:"Noto Serif JP",serif;font-size:clamp(30px,5vw,58px);font-weight:700;letter-spacing:.03em}
.hero-mark .brand .plus{color:var(--gold-l,#e4cf9c)}
.hero-mark .sub{display:block;margin-top:8px;font-size:13px;letter-spacing:.55em;padding-left:.55em;color:rgba(255,255,255,.86)}
.hero-tagline{position:absolute;left:32px;bottom:44px;z-index:3;color:#fff}
.hero-tagline .en-sub{font-size:12px;letter-spacing:.22em;color:#e7ded0;display:block;margin-bottom:12px}
.hero-tagline h1{font-family:"Noto Serif JP",serif;font-weight:700;line-height:1.55;font-size:clamp(20px,2.6vw,30px)}
.hero-scroll{
  position:absolute;right:32px;bottom:30px;z-index:3;color:#fff;font-size:11px;letter-spacing:.28em;
  writing-mode:vertical-rl;display:flex;align-items:center;gap:10px;opacity:.85;
}
.hero-scroll::after{content:"";width:1px;height:44px;background:#fff}

/* ---------- Sections ---------- */
section{padding:110px 0}
.sec-head{text-align:center;margin-bottom:64px}
.sec-head .label{
  font-family:"Montserrat";font-weight:600;font-size:12.5px;letter-spacing:.28em;
  color:var(--gold-d);display:block;margin-bottom:16px;
}
.sec-head h2{font-family:"Noto Serif JP",serif;font-size:clamp(26px,3.4vw,38px);font-weight:700;color:var(--ink);line-height:1.5}
.sec-head p{color:var(--gray);margin-top:18px;font-size:14.5px}
.sec-head.left{text-align:left}

/* intro / stats band (sketch + copy + CTA) */
.intro-stat{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.intro-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.intro-stat .num-line{font-size:clamp(20px,2.6vw,28px);font-weight:700;margin-bottom:22px}
.intro-stat .num-line .num{font-family:"Montserrat";font-weight:800;font-size:clamp(30px,4vw,46px);color:var(--gold-d);margin:0 6px}
.intro-stat p{font-size:14px;color:var(--ink);line-height:2.1;margin-bottom:28px}
.intro-stat .photo{aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius)}
.intro-stat .photo img{width:100%;height:100%;object-fit:cover}

/* ---------- Gallery card grid (R+house works-grid style) ---------- */
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:56px 40px}
.gallery-card{display:block}
.gallery-card .photo{position:relative;overflow:hidden;border-radius:var(--radius);aspect-ratio:4/3;background:#000}
.gallery-card .photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.gallery-card:hover .photo img{transform:scale(1.045)}
.gallery-card .badge{position:absolute;top:14px;left:14px;background:var(--black);color:#fff;font-size:11px;letter-spacing:.06em;padding:6px 12px;border-radius:999px;z-index:2}
.gallery-card h3{font-family:"Noto Serif JP",serif;font-size:19px;font-weight:700;margin-top:20px;color:var(--ink)}
.gallery-card .tag{color:var(--gray);font-size:12.5px;margin-top:6px;letter-spacing:.06em}
.gallery-card .desc{font-size:13.5px;color:var(--gray);margin-top:10px;line-height:1.9}
.gallery-card .price-line{margin-top:14px;font-size:14px;font-weight:700}
.gallery-card .price-line .now{background:var(--black);color:#fff;padding:4px 12px;border-radius:999px;font-size:14px;margin-left:8px}

/* product detail row (used on lineup.html per-item detail) */
.lineup-item{padding:70px 0;border-bottom:1px solid var(--line)}
.lineup-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center}
.lineup-photo{position:relative;overflow:hidden;border-radius:var(--radius);aspect-ratio:16/10}
.lineup-photo img{width:100%;height:100%;object-fit:cover}
.lineup-info{display:flex;flex-direction:column;justify-content:center}
.lineup-info .num{font-family:"Montserrat";font-size:12.5px;letter-spacing:.22em;color:var(--gray-l);margin-bottom:14px}
.lineup-info h3{font-family:"Noto Serif JP",serif;font-size:clamp(24px,2.8vw,32px);color:var(--ink);margin-bottom:6px;font-weight:700}
.lineup-info .jp-name{font-size:13px;color:var(--gray);letter-spacing:.12em;margin-bottom:22px;display:block}
.lineup-info .desc{font-size:14px;line-height:2;color:var(--ink)}
.lineup-info .price-line{
  margin-top:26px;font-size:15px;font-weight:700;color:var(--ink);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.lineup-info .price-line .now{
  background:var(--black);color:#fff;padding:5px 14px;border-radius:999px;font-size:16px;
}
.lineup-info .price-note{font-size:12px;color:var(--gray-l);margin-top:8px}
.lineup-info .btn{margin-top:26px;align-self:flex-start}

/* intro band (plain text) */
.intro-band{background:var(--white);padding:56px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.intro-band p{font-size:14.5px;color:var(--ink);line-height:2.1}

/* buttons — pill outline, R+house style */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:transparent;color:var(--ink);font-weight:600;font-size:14px;
  padding:15px 34px;border-radius:999px;transition:.25s;white-space:nowrap;
  border:1px solid var(--ink);letter-spacing:.03em;
}
.btn:hover{background:var(--ink);color:#fff}
.btn.gold{background:var(--black);color:#fff;border-color:var(--black)}
.btn.gold:hover{background:var(--gold-d);border-color:var(--gold-d)}
.btn.lg{padding:19px 44px;font-size:15px}
.btn.block{width:100%;border-radius:999px}

/* CTA big button */
.cta-gold{
  display:inline-block;background:var(--black);color:#fff;text-align:center;
  border:1px solid var(--black);border-radius:999px;padding:22px 54px;font-size:clamp(16px,2vw,19px);
  font-weight:700;transition:.2s;letter-spacing:.03em;
}
.cta-gold:hover{background:var(--gold-d);border-color:var(--gold-d)}

/* loan advisor section */
.loan-advisor{background:var(--white);border-top:1px solid var(--line)}
.loan-advisor-inner{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.loan-advisor-inner .photo{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3}
.loan-advisor-inner img{width:100%;height:100%;object-fit:cover}
.loan-advisor-copy .tag{color:var(--gold-d);font-weight:600;font-size:13px;letter-spacing:.1em}
.loan-advisor-copy h3{font-family:"Noto Serif JP",serif;font-size:clamp(22px,2.8vw,30px);font-weight:700;margin:10px 0 20px;color:var(--ink)}
.loan-advisor-copy p{font-size:14px;color:var(--gray);line-height:2;margin-bottom:24px}
.loan-badge{background:var(--bg);border:1px solid var(--line);color:var(--ink);font-weight:700;text-align:center;padding:18px;border-radius:var(--radius);max-width:280px}
.loan-badge .cap{font-size:12px;color:var(--gray);font-weight:500}

/* worry icons grid */
.worry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:900px;margin:0 auto;text-align:center}
.worry-grid .w-label{
  display:block;background:var(--white);border:1px solid var(--line);padding:22px 14px;border-radius:var(--radius);font-weight:600;font-size:14.5px;color:var(--ink);
}

/* stats band */
.stats-band{background:var(--black);color:#fff;padding:80px 0}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;align-items:center}
.stat-badge{text-align:center}
.stat-badge .cap{font-size:13px;color:#bfbcb5;font-weight:500;letter-spacing:.08em}
.stat-badge .num{font-family:"Montserrat";font-weight:700;font-size:clamp(34px,5vw,50px);color:#fff}

/* combine loan blocks */
.combine-block{background:var(--white);color:var(--ink);font-weight:700;text-align:center;padding:26px;border:1px solid var(--line);border-radius:var(--radius)}

/* table (company info) */
.info-table{max-width:900px;margin:0 auto}
.info-row{margin-bottom:22px;display:grid;grid-template-columns:180px 1fr;gap:20px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.info-row .k{color:var(--gray);font-weight:600;font-size:13px;letter-spacing:.06em}
.info-row .v{font-size:15px}

/* map */
.map-wrap{background:var(--white);padding:0;height:380px}
.map-wrap iframe{width:100%;height:100%}

/* contact form */
.form-wrap{max-width:760px;margin:0 auto}
.f-row{margin-bottom:26px}
.f-row label{display:block;font-weight:600;font-size:13.5px;margin-bottom:10px;letter-spacing:.02em}
.f-row label .req{color:#a6432f;font-size:11px;margin-left:6px;font-weight:500}
.f-row label .opt{color:var(--gray-l);font-size:11px;margin-left:6px;font-weight:500}
.f-row input[type=text],.f-row input[type=email],.f-row input[type=tel],.f-row select,.f-row textarea{
  width:100%;border:1px solid var(--line);border-radius:2px;padding:14px 16px;font-family:inherit;font-size:15px;
  color:var(--ink);background:#fff;transition:.18s;
}
.f-row input:focus,.f-row select:focus,.f-row textarea:focus{outline:none;border-color:var(--ink)}
.f-row textarea{min-height:140px;resize:vertical}
.f-radio-row{display:flex;flex-wrap:wrap;gap:18px}
.f-radio-row label{display:flex;align-items:center;gap:8px;font-weight:500;font-size:14px}
.form-success{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:60px 30px;text-align:center;font-size:16px;font-weight:600;color:var(--ink);line-height:2;box-shadow:var(--shadow);max-width:760px;margin:0 auto}
.form-success .em{display:block;font-size:38px;margin-bottom:16px}

/* footer */
footer{background:var(--black);color:#a8a6a1;padding:64px 0 30px;font-size:13px}
.foot-top{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.foot-logo{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.foot-logo .mark{width:48px;height:48px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center}
.foot-logo .mark img{width:36px;height:36px}
.foot-logo .tagline{display:block;font-size:10px;color:#726f68}
.foot-logo .name{font-family:"Noto Serif JP",serif;font-size:17px;color:#fff;font-weight:700}
.foot-addr p{margin-bottom:4px}
.foot-biz{margin-top:16px}
.foot-links{margin-top:18px;display:flex;gap:22px;flex-wrap:wrap}
.foot-links a:hover{color:#fff}
.copy{border-top:1px solid #333;padding-top:22px;margin-top:30px;text-align:center;font-family:"Montserrat";letter-spacing:.06em;font-size:12px}

/* reveal */
.reveal{opacity:0;transform:translateY(28px);transition:.7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- About hub (こだわり一覧) ---------- */
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.hub-card{display:block;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.25s}
.hub-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.hub-card .photo{aspect-ratio:4/3;overflow:hidden;background:#000}
.hub-card .photo img{width:100%;height:100%;object-fit:cover;transition:.5s}
.hub-card:hover .photo img{transform:scale(1.05)}
.hub-card .body{padding:24px 22px}
.hub-card .num{font-family:"Montserrat";font-size:11.5px;color:var(--gold-d);letter-spacing:.15em;font-weight:700}
.hub-card h3{font-family:"Noto Serif JP",serif;font-size:18px;font-weight:700;margin:8px 0 10px}
.hub-card p{font-size:13px;color:var(--gray);line-height:1.85}

/* ---------- Process steps (家づくりの流れ) ---------- */
.process-steps{max-width:880px;margin:0 auto}
.process-step{display:grid;grid-template-columns:80px 100px 1fr;gap:26px;align-items:center;padding:34px 0;border-bottom:1px solid var(--line)}
.process-step:last-child{border-bottom:none}
.process-step .thumb{width:100px;height:100px;border-radius:var(--radius);overflow:hidden}
.process-step .thumb img{width:100%;height:100%;object-fit:cover}
.process-step .step-num{font-family:"Montserrat";font-weight:800;font-size:34px;color:var(--gold-d);line-height:1}
.process-step .step-num small{display:block;font-size:11px;color:var(--gray-l);font-weight:600;margin-top:6px;letter-spacing:.1em}
.process-step h3{font-family:"Noto Serif JP",serif;font-size:19px;font-weight:700;margin-bottom:10px}
.process-step p{font-size:13.5px;color:var(--gray);line-height:1.95}

/* ---------- Spec table (選べる仕様) ---------- */
.spec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.spec-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:28px;overflow:hidden}
.spec-card .photo{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;margin:-28px -28px 20px}
.spec-card .photo img{width:100%;height:100%;object-fit:cover}
.spec-card .cat{font-family:"Montserrat";font-size:11.5px;color:var(--gold-d);letter-spacing:.14em;font-weight:700;margin-bottom:10px;display:block}
.spec-card h3{font-family:"Noto Serif JP",serif;font-size:17px;font-weight:700;margin-bottom:10px}
.spec-card p{font-size:13.5px;color:var(--gray);line-height:1.9}

/* ---------- Cost compare (コストパフォーマンス) ---------- */
.cost-compare{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:820px;margin:0 auto}
.cost-compare .cbox{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:30px;text-align:center}
.cost-compare .cbox.us{background:var(--black);color:#fff;border-color:var(--black)}
.cost-compare .cbox .cap{font-size:13px;color:var(--gray);font-weight:600;letter-spacing:.06em}
.cost-compare .cbox.us .cap{color:#c9c6bf}
.cost-compare .cbox .price{font-family:"Montserrat";font-weight:800;font-size:clamp(26px,3.4vw,34px);margin:14px 0}
.cost-reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:50px}
.cost-reasons .r{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:24px;text-align:center;overflow:hidden}
.cost-reasons .r .photo{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;margin:-24px -24px 20px}
.cost-reasons .r .photo img{width:100%;height:100%;object-fit:cover}
.cost-reasons .r .n{font-family:"Montserrat";font-weight:800;color:var(--gold-d);font-size:20px;margin-bottom:10px}
.cost-reasons .r p{font-size:13px;color:var(--gray);line-height:1.85}

/* ---------- Support grid (アフターサポート) ---------- */
.support-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.support-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:30px;overflow:hidden}
.support-card .photo{aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;margin:-30px -30px 20px}
.support-card .photo img{width:100%;height:100%;object-fit:cover}
.support-card .yr{font-family:"Montserrat";font-weight:800;color:var(--gold-d);font-size:26px}
.support-card h3{font-family:"Noto Serif JP",serif;font-size:17px;font-weight:700;margin:10px 0}
.support-card p{font-size:13.5px;color:var(--gray);line-height:1.9}

/* ---------- Column (家づくりコラム) ---------- */
.column-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.column-card{display:block;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.2s}
.column-card:hover{box-shadow:var(--shadow-lg)}
.column-card .photo{aspect-ratio:16/10;overflow:hidden;background:#000}
.column-card .photo img{width:100%;height:100%;object-fit:cover}
.column-card .body{padding:20px}
.column-card .date{font-family:"Montserrat";font-size:11px;color:var(--gray-l);letter-spacing:.06em}
.column-card .cat{color:var(--gold-d);font-size:11.5px;font-weight:700;margin-left:10px}
.column-card h3{font-family:"Noto Serif JP",serif;font-size:15.5px;font-weight:700;margin-top:10px;line-height:1.6}

/* ---------- Event list (イベント情報) ---------- */
.event-list{display:flex;flex-direction:column;gap:22px}
.event-item{display:grid;grid-template-columns:120px 140px 1fr auto;gap:24px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px}
.event-item .thumb{width:120px;height:120px;border-radius:var(--radius);overflow:hidden}
.event-item .thumb img{width:100%;height:100%;object-fit:cover}
.event-item .date-badge{text-align:center;background:var(--black);color:#fff;border-radius:var(--radius);padding:14px 8px}
.event-item .date-badge .m{font-size:11px;letter-spacing:.1em;color:#c9c6bf}
.event-item .date-badge .d{font-family:"Montserrat";font-weight:800;font-size:26px}
.event-item h3{font-family:"Noto Serif JP",serif;font-size:16.5px;font-weight:700;margin-bottom:8px}
.event-item p{font-size:13px;color:var(--gray)}
.event-item .tag{display:inline-block;background:#efece4;color:var(--gold-d);font-size:11px;font-weight:700;padding:5px 12px;border-radius:999px;margin-bottom:8px}

/* ---------- Category circle icons (R+house-style) ---------- */
.category-row{display:grid;grid-template-columns:repeat(6,1fr);gap:28px 18px}
.category-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.category-item .category-item__image{width:136px;height:136px;border-radius:50%;overflow:hidden;background:#000;flex:none;transition:.3s}
.category-item .category-item__image img{width:100%;height:100%;object-fit:cover;transition:.5s}
.category-item:hover .category-item__image{box-shadow:var(--shadow-lg)}
.category-item:hover .category-item__image img{transform:scale(1.08)}
.category-item span{font-size:13px;font-weight:600;color:var(--ink);line-height:1.5}
.category-row.cols-4{grid-template-columns:repeat(4,1fr);gap:36px 20px}
.category-row.cols-4 .category-item__image{width:150px;height:150px}

/* ---------- Promo circles (メールマガジン／施工事例, R+house circle-style) ---------- */
.promo-circles{display:flex;justify-content:center;gap:70px;flex-wrap:wrap}
.promo-circles .category-item__image{width:180px;height:180px}

/* ---------- Breadcrumb ---------- */
.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12.5px;color:var(--gray-l);margin-bottom:34px}
.breadcrumb a{color:var(--gray-l)}
.breadcrumb a:hover{color:var(--gold-d)}
.breadcrumb .sep{color:var(--line)}
.breadcrumb .current{color:var(--ink);font-weight:600}

/* ---------- Article (コラム記事詳細) ---------- */
.article-head{max-width:820px;margin:0 auto 40px}
.article-head .cat-tag{display:inline-block;background:#efece4;color:var(--gold-d);font-size:12px;font-weight:700;padding:6px 16px;border-radius:999px;margin-bottom:18px}
.article-head .date{display:block;font-family:"Montserrat";font-size:12px;color:var(--gray-l);letter-spacing:.06em;margin-bottom:14px}
.article-head h1{font-family:"Noto Serif JP",serif;font-size:clamp(24px,3.4vw,34px);font-weight:700;line-height:1.6}
.article-hero{max-width:900px;margin:0 auto 50px;border-radius:var(--radius);overflow:hidden;aspect-ratio:16/9;background:#000}
.article-hero img{width:100%;height:100%;object-fit:cover}
.article-body{max-width:820px;margin:0 auto}
.article-body h2{font-family:"Noto Serif JP",serif;font-size:clamp(18px,2.2vw,22px);font-weight:700;margin:44px 0 18px;padding-top:6px}
.article-body p{font-size:15px;color:var(--ink);line-height:2.1;margin-bottom:22px}
.article-body ul{margin:0 0 22px 22px;font-size:15px;color:var(--ink);line-height:2}
.article-body li{margin-bottom:6px}
.article-body .lead{font-size:16px;color:var(--gray);line-height:2;margin-bottom:36px;padding-bottom:36px;border-bottom:1px solid var(--line)}
.article-cta{max-width:820px;margin:50px auto 0;background:var(--bg-alt,#f3f1ea);border-radius:var(--radius);padding:36px;text-align:center}
.article-cta h3{font-family:"Noto Serif JP",serif;font-size:clamp(17px,2.2vw,20px);font-weight:700;margin-bottom:20px}
.related-heading{max-width:820px;margin:70px auto 30px;text-align:left}
.related-heading span{font-family:"Montserrat";font-weight:600;font-size:12px;letter-spacing:.2em;color:var(--gold-d)}
.related-heading h3{font-family:"Noto Serif JP",serif;font-size:20px;font-weight:700;margin-top:10px}
.related-grid{max-width:820px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:24px}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .lineup-grid{grid-template-columns:1fr;gap:28px}
  .gallery-grid{grid-template-columns:1fr;gap:44px}
  .intro-stat-grid{grid-template-columns:1fr;gap:32px}
  .worry-grid{grid-template-columns:repeat(2,1fr)}
  .stats-grid{grid-template-columns:1fr;gap:34px}
  .loan-advisor-inner{grid-template-columns:1fr}
  .gnav{display:none}
  .info-row{grid-template-columns:1fr;gap:6px}
  .hero-split{height:70vh}
  .side-tabs a{width:76px;font-size:10px;padding:12px 6px}
  .side-tabs a svg{width:18px;height:18px}
  .hub-grid{grid-template-columns:1fr 1fr;gap:22px}
  .spec-grid{grid-template-columns:1fr}
  .cost-compare{grid-template-columns:1fr}
  .cost-reasons{grid-template-columns:1fr}
  .support-grid{grid-template-columns:1fr}
  .column-grid{grid-template-columns:1fr 1fr;gap:20px}
  .event-item{grid-template-columns:1fr;text-align:center}
  .event-item .thumb{justify-self:center;width:100%;max-width:280px;height:180px}
  .event-item .date-badge{justify-self:center;width:100px}
  .category-row{grid-template-columns:repeat(3,1fr);gap:24px 14px}
  .category-item .category-item__image{width:96px;height:96px}
  .category-row.cols-4{grid-template-columns:repeat(4,1fr);gap:26px 14px}
  .category-row.cols-4 .category-item__image{width:88px;height:88px}
  .related-grid{grid-template-columns:1fr 1fr;gap:18px}
}
@media(max-width:720px){
  .hamburger{display:flex}
  .nav{padding:14px 20px}
  .logo .mark{width:44px;height:44px}
  .logo .mark img{width:32px;height:32px}
  .logo .name{font-size:17px}
  .head-sub{display:none}
  section{padding:64px 0}
  .worry-grid{grid-template-columns:1fr 1fr;gap:14px}
  .hero-split{grid-template-columns:1fr;height:60vh}
  .hero-split .panel:last-child{display:none}
  .side-tabs{display:none}
  .gnav{
    display:flex;position:fixed;top:0;left:-100%;bottom:0;width:80%;max-width:320px;background:var(--bg);
    flex-direction:column;padding:90px 24px 24px;box-shadow:var(--shadow-lg);
    transition:.3s;z-index:99;overflow-y:auto;gap:0;
  }
  .gnav.open{left:0}
  .gnav .menu{display:block;width:100%;text-align:left;border-bottom:1px solid var(--line);border-radius:0;padding:16px 4px}
  .nav-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:98}
  .nav-overlay.show{display:block}
  .hub-grid{grid-template-columns:1fr}
  .column-grid{grid-template-columns:1fr}
  .process-step{grid-template-columns:56px 1fr;gap:16px}
  .process-step .thumb{display:none}
  .process-step .step-num{font-size:24px}
  .drop-menu{position:static;transform:none;opacity:1;pointer-events:auto;box-shadow:none;border:none;border-radius:0;padding:0 0 8px 18px;display:block;background:transparent}
  .drop-menu a{padding:10px 4px;font-size:13px;color:var(--gray)}
  .gnav .has-drop>.menu::after{display:none}
  .category-row{grid-template-columns:repeat(2,1fr);gap:20px 12px}
  .category-item .category-item__image{width:104px;height:104px}
  .category-item span{font-size:12px}
  .category-row.cols-4{grid-template-columns:repeat(2,1fr);gap:24px 14px}
  .category-row.cols-4 .category-item__image{width:104px;height:104px}
  .related-grid{grid-template-columns:1fr}
  .promo-circles{gap:32px}
  .promo-circles .category-item__image{width:120px;height:120px}
}