/* 2026-10-16: type, colours and button treatment observed on Sekisui House's
   public /kodate/ and /kodate/start/ pages. Authored for the iekatsu prototype. */
:root {
  --paper: #fff;
  --white: #fff;
  --ink: #242424;
  --green: #242424;
  --muted: #707070;
  --line: #d8d8d8;
  --accent: #242424;
  --wash: #f4f4f4;
  --font: "游ゴシック体 Std", YuGothicStd, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 16px/1.8 var(--font); letter-spacing: .4px; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { touch-action: manipulation; }
button { cursor: pointer; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid #0a5798; outline-offset: 5px; }
a:hover { text-decoration: underline; text-underline-offset: 5px; }
.proposal { background: var(--wash); color: #54545e; display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 7px 28px; border-bottom: 1px solid var(--line); font-size: 10px; }
.proposal nav { display: flex; gap: 5px; }
.proposal a { padding: 4px 12px; border: 1px solid transparent; border-radius: 3px; white-space: nowrap; }
.proposal a[aria-current=page] { border-color: #707070; color: var(--ink); background: #fff; }
.sitehead { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: auto; padding: 22px max(32px, calc((100vw - 1320px)/2)); min-height: 106px; border-bottom: 1px solid var(--line); background: #fff; }
.brand { font-family: var(--font); font-size: 31px; font-weight: 700; line-height: 1.15; letter-spacing: .5px; }
.brand small { display: block; font-size: 9px; font-weight: 500; letter-spacing: .4px; line-height: 1.8; margin-top: 8px; }
.mainnav { display: flex; align-items: center; gap: 25px; font-size: 13px; font-weight: 700; }
.mainnav a { padding: 8px 0; }
.headcta, .btn { display: inline-flex; align-items: center; justify-content: center; gap: 34px; color: #242424; background: transparent; border: 2px solid currentColor; border-radius: 5px; padding: 13px 24px; min-height: 50px; font-size: 15px; font-weight: 500; line-height: 24px; letter-spacing: .4px; transition: color .2s, background .2s; }
.headcta { font-size: 13px; gap: 24px; }
.btn::after, .headcta::after { content: ''; width: 7px; height: 7px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg); flex: 0 0 auto; }
.btn:hover, .headcta:hover { background: #242424; color: #fff; text-decoration: none; }
.btn.light { background: #fff; color: #242424; }
.view[hidden] { display: none; }
.layout { max-width: 1280px; margin: auto; padding: 0 50px; }
.hero { width: 100%; min-height: 660px; height: min(760px, 75vw); position: relative; display: flex; align-items: center; overflow: hidden; background: #363737; }
.hero-photo { margin: 0; position: absolute; inset: 0; z-index: 0; }
.hero-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.63), rgba(0,0,0,.27) 54%, rgba(0,0,0,.05)); }
.hero-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 53%; }
.hero-photo figcaption { position: absolute; z-index: 1; bottom: 20px; right: 35px; color: #fff; font-size: 10px; letter-spacing: .7px; text-shadow: 0 1px 5px #000; }
.hero-copy { position: relative; z-index: 1; padding: 65px max(50px, calc((100vw - 1180px)/2)); color: #fff; width: 100%; }
.kicker { display: block; font-size: 12px; font-weight: 500; color: var(--muted); line-height: 1.6; letter-spacing: 1.3px; }
.hero .kicker { color: #fff; font-size: 12px; }
.hero h1 { font-family: var(--font); font-size: 45px; font-weight: 700; letter-spacing: .4px; line-height: 1.6; margin: 25px 0 24px; }
.hero p { font-size: 16px; line-height: 1.9; font-weight: 500; margin: 0 0 31px; }
.hero .btn { color: #fff; min-width: 330px; }
.hero .btn:hover { background: #fff; color: #242424; }
.hero .quietlink { display: block; width: fit-content; font-size: 13px; text-decoration: underline; text-underline-offset: 5px; margin-top: 18px; }
.section { padding: 90px 0; border-bottom: 1px solid var(--line); }
h2 { font-family: var(--font); font-size: 32px; line-height: 1.6; font-weight: 700; letter-spacing: 1.1px; margin: 15px 0 35px; }
.section-title { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 35px; }
.section-title h2 { margin-bottom: 0; }
.tiny { font-size: 12px; color: #707070; }
.four { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border: 1px solid var(--line); border-radius: 0; }
.guide { display: block; position: relative; padding: 30px 24px; min-height: 210px; border-right: 1px solid var(--line); background: #fff; transition: background .2s; }
.guide:last-child { border-right: 0; }
.guide .num { font-size: 11px; letter-spacing: .7px; font-weight: 500; color: #707070; }
.guide h3 { font-size: 19px; line-height: 1.6; margin: 23px 0 14px; font-weight: 700; }
.guide p { font-size: 13px; color: #54545e; line-height: 1.8; margin: 0; }
.guide .arrow { position: absolute; top: 27px; right: 20px; font-size: 0; width: 7px; height: 7px; border-top: 1px solid #242424; border-right: 1px solid #242424; transform: rotate(45deg); }
.guide:hover { background: var(--wash); text-decoration: none; }
.three { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 35px; }
.reading { padding: 26px 0; border-top: 1px solid #242424; }
.reading h3 { font-size: 21px; font-weight: 700; line-height: 1.8; margin: 20px 0 18px; }
.reading p { font-size: 14px; line-height: 1.9; color: #54545e; }
.textlink { display: inline-block; font-size: 14px; border-bottom: 1px solid #707070; padding: 0 0 7px; margin-top: 15px; }
.owner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; border-bottom: 0; }
.owner-photo { width: 100%; height: 370px; object-fit: cover; }
.owner p { font-size: 15px; line-height: 2; }
.cta { padding: 45px 40px; background: var(--wash); display: flex; justify-content: space-between; align-items: center; gap: 30px; margin-bottom: 85px; }
.cta h2 { font-size: 26px; margin: 8px 0 14px; }
.cta p { font-size: 14px; max-width: 610px; margin: 0; }
.cta .btn { flex-shrink: 0; }
.sitefoot { background: var(--wash); border-top: 1px solid var(--line); color: #242424; padding: 45px max(35px, calc((100vw - 1180px)/2)); display: flex; justify-content: space-between; gap: 50px; }
.sitefoot p { font-size: 11px; line-height: 2; max-width: 720px; margin: 0; }
.sitefoot nav { display: flex; gap: 24px; font-size: 12px; margin-top: 18px; }
.mobilebar { display: none; }
.breadcrumb { font-size: 11px; color: #707070; padding: 26px 0; }
.article-layout { display: grid; grid-template-columns: minmax(0,790px) 245px; gap: 60px; justify-content: space-between; padding-bottom: 80px; }
.article-head h1, .referral h1 { font-family: var(--font); font-weight: 700; font-size: 38px; line-height: 1.6; letter-spacing: 1px; margin: 20px 0; }
.article-meta { display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 15px 0 24px; color: #707070; font-size: 11px; }
.article-body { font-size: 16px; line-height: 2; }
.article-body h2 { font-size: 28px; line-height: 1.6; margin: 50px 0 25px; }
.article-body h3 { font-size: 20px; font-weight: 700; }
.article-body p { margin: 0 0 24px; }
.answer { background: var(--wash); padding: 30px; margin: 30px 0; }
.answer b { font-size: 15px; }
.answer p { margin: 13px 0 0; }
.table-wrap { overflow-x: auto; }
.article-body table { width: 100%; min-width: 500px; border-collapse: collapse; font-size: 14px; }
.article-body td, .article-body th { text-align: left; vertical-align: top; padding: 18px 16px; border: 1px solid var(--line); }
.article-body th { font-weight: 700; background: var(--wash); }
.checklist { list-style: none; padding: 0; }
.checklist li { padding: 12px 0; border-bottom: 1px solid var(--line); }
.checklist li::before { content: '□'; margin-right: 14px; color: #707070; }
.article-next { background: var(--wash); border: 1px solid var(--line); padding: 28px 30px; margin: 35px 0; }
.article-next p { font-size: 14px; }
.source { font-size: 12px; color: #707070; padding: 20px 0; }
.source a { text-decoration: underline; }
.sidebar { padding-top: 35px; font-size: 13px; }
.sidebox { border-top: 1px solid var(--line); padding: 22px 0; }
.sidebox h3 { font-size: 14px; }
.sidebox a { display: block; margin: 15px 0; }
.sidebox .btn { display: flex; font-size: 12px; padding: 10px 15px; gap: 14px; }
.review-only { border: 1px dashed #919191; padding: 16px 20px; font-size: 12px; color: #707070; background: #fafafa; margin: 25px 0; }
.referral { max-width: 1100px; padding: 60px 45px 85px; margin: auto; }
.referral-intro { max-width: 850px; }
.referral-intro>p { font-size: 16px; line-height: 2; }
.service-points { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; margin: 45px 0; }
.service-points>div { padding: 25px 0; border-top: 1px solid #242424; }
.service-points h3 { font-size: 18px; font-weight: 700; margin: 20px 0 14px; }
.service-points p { font-size: 14px; color: #54545e; }
.referral h2 { font-size: 28px; }
.steps { display: flex; border: 1px solid var(--line); margin: 30px 0 40px; }
.steps div { flex: 1; border-right: 1px solid var(--line); padding: 22px; font-size: 13px; }
.steps div:last-child { border-right: 0; }
.steps b { display: block; font-size: 24px; font-weight: 500; color: #707070; margin-bottom: 10px; }
.formbox { background: #fff; border: 1px solid var(--line); padding: 42px 45px; max-width: 790px; margin: 45px auto; }
.formbox h2 { margin: 10px 0 20px; }
.field { display: block; font-size: 15px; font-weight: 700; margin: 26px 0; }
.field>span { background: #f4f4f4; color: #54545e; font-size: 11px; font-weight: 500; padding: 3px 7px; margin-left: 10px; }
.field>input, .field>select, .field>textarea { display: block; width: 100%; border: 1px solid #919191; border-radius: 3px; background: #fff; padding: 13px 14px; color: var(--ink); font-size: 16px; font-weight: 400; margin-top: 9px; }
.field>textarea { min-height: 110px; }
.consent { display: flex; align-items: start; gap: 12px; font-size: 13px; margin: 25px 0; }
.consent input { margin-top: 6px; min-width: 18px; min-height: 18px; accent-color: #242424; }
.formbox .btn { width: 100%; }
.form-note { color: #707070; font-size: 12px; }
.form-result { background: var(--wash); border: 1px solid var(--line); padding: 22px; font-size: 13px; margin-top: 22px; }
.form-result[hidden] { display: none; }
.faq { max-width: 790px; margin: 45px auto; }
.faq details { border-bottom: 1px solid var(--line); padding: 22px 0; font-size: 15px; }
.faq summary { cursor: pointer; font-weight: 700; }
.faq p { font-size: 14px; color: #54545e; }
@media(max-width:1100px) {
  .sitehead { padding: 22px 30px; gap: 20px; }
  .mainnav { gap: 18px; font-size: 12px; }
  .headcta { padding: 10px 17px; font-size: 12px; gap: 18px; }
  .layout { padding: 0 35px; }
  .article-layout { grid-template-columns: minmax(0,1fr) 220px; gap: 35px; }
  .hero-copy { padding-left: 50px; padding-right: 50px; }
  .guide { padding: 26px 18px; }
  .guide h3 { font-size: 17px; }
  .cta { flex-direction: column; align-items: start; }
}
@media(max-width:900px) {
  .mainnav { display: none; }
  .hero { min-height: 630px; }
  .hero h1 { font-size: 40px; }
  .four { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .guide { border-bottom: 1px solid var(--line); }
  .guide:nth-child(2) { border-right: 0; }
  .guide:nth-child(3),.guide:nth-child(4) { border-bottom: 0; }
  .three { gap: 24px; }
  .reading h3 { font-size: 18px; }
}
@media(max-width:760px) {
  .proposal { display: block; padding: 8px 14px; font-size: 9px; }
  .proposal>span { display: block; margin-bottom: 5px; }
  .proposal nav { gap: 5px; }
  .proposal a { flex: 1; text-align: center; font-size: 10px; padding: 4px 5px; }
  .sitehead { min-height: 92px; padding: 17px 20px; gap: 15px; }
  .brand { font-size: 27px; }
  .brand small { font-size: 8px; margin-top: 5px; }
  .headcta { font-size: 10px; gap: 16px; padding: 9px 11px; min-height: 42px; }
  .hero { min-height: 645px; height: auto; align-items: center; }
  .hero-copy { padding: 55px 25px 85px; }
  .hero h1 { font-size: 30px; line-height: 1.65; letter-spacing: .4px; margin: 24px 0; }
  .hero .kicker { font-size: 9px; letter-spacing: 1px; }
  .hero p { font-size: 14px; line-height: 2; margin-bottom: 27px; }
  .hero .btn { width: 100%; min-width: 0; font-size: 12px; padding: 12px 10px; gap: 20px; }
  .hero .quietlink { font-size: 11px; margin-top: 17px; }
  .hero-photo img { object-position: 53% center; }
  .hero-photo::after { background: rgba(0,0,0,.48); }
  .hero-photo figcaption { bottom: 40px; right: 20px; left: 25px; font-size: 8px; }
  .layout { padding: 0 22px; }
  .section { padding: 55px 0; }
  .section-title { display: block; margin-bottom: 25px; }
  .section-title h2 { margin-bottom: 12px; }
  h2 { font-size: 25px; line-height: 1.6; letter-spacing: .6px; }
  .kicker { font-size: 10px; }
  .tiny { font-size: 11px; }
  .guide { padding: 22px 15px; min-height: 190px; }
  .guide .num { font-size: 9px; }
  .guide h3 { font-size: 16px; margin: 21px 0 12px; }
  .guide p { font-size: 11px; }
  .guide .arrow { right: 14px; top: 24px; width: 6px; height: 6px; }
  .three { grid-template-columns: 1fr; gap: 10px; }
  .reading { padding: 25px 0; }
  .reading h3 { font-size: 21px; margin: 16px 0; }
  .reading p { font-size: 14px; }
  .owner { grid-template-columns: 1fr; gap: 25px; }
  .owner-photo { height: 270px; }
  .owner p { font-size: 14px; }
  .owner h2 { margin-top: 12px; }
  .cta { padding: 28px 22px; margin-bottom: 50px; gap: 26px; }
  .cta h2 { font-size: 24px; }
  .cta p { font-size: 13px; }
  .cta .btn { font-size: 12px; width: 100%; gap: 25px; padding: 12px; }
  .sitefoot { display: block; padding: 38px 24px 110px; }
  .sitefoot p { margin-top: 25px; }
  .sitefoot nav { gap: 18px; font-size: 11px; }
  .mobilebar { display: block; position: fixed; bottom: 0; left: 0; right: 0; z-index: 5; background: #fffffff7; border-top: 1px solid var(--line); padding: 9px 15px max(9px,env(safe-area-inset-bottom)); }
  .mobilebar .btn { width: 100%; font-size: 12px; padding: 10px; gap: 20px; background: #242424; color: #fff; }
  .breadcrumb { font-size: 9px; padding: 24px 0; }
  .article-layout { display: block; padding-bottom: 30px; }
  .sidebar { display: none; }
  .article-head h1 { font-size: 25px; line-height: 1.65; letter-spacing: 0; }
  .article-meta { display: block; font-size: 10px; }
  .article-meta span { display: block; }
  .article-body { font-size: 16px; line-height: 2; }
  .article-body h2 { font-size: 24px; margin-top: 40px; letter-spacing: .4px; }
  .article-body h3 { font-size: 19px; }
  .answer { padding: 23px; }
  .article-body table { font-size: 13px; }
  .article-next { padding: 24px 22px; }
  .article-next .btn { font-size: 12px; gap: 22px; padding: 11px; width: 100%; }
  .review-only { font-size: 11px; padding: 16px; }
  .referral { padding: 40px 22px 50px; }
  .referral h1 { font-size: 26px; letter-spacing: 0; line-height: 1.7; }
  .referral-intro>p { font-size: 14px; }
  .service-points { grid-template-columns: 1fr; gap: 0; margin: 35px 0; }
  .service-points>div { padding: 22px 0; }
  .service-points h3 { margin: 13px 0; font-size: 18px; }
  .service-points p { font-size: 14px; }
  .referral h2 { font-size: 24px; }
  .steps { display: block; }
  .steps div { display: flex; align-items: center; gap: 18px; border-right: 0; border-bottom: 1px solid var(--line); padding: 18px; }
  .steps div:last-child { border-bottom: 0; }
  .steps b { margin: 0; }
  .formbox { padding: 28px 20px; margin: 35px -6px; }
  .formbox h2 { font-size: 23px; }
  .field { margin: 25px 0; font-size: 14px; }
  .formbox .btn { font-size: 12px; padding: 12px; gap: 18px; }
  .consent { font-size: 12px; }
  .faq { margin-top: 35px; }
  .faq details { font-size: 14px; }
  .faq p { font-size: 13px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } .btn,.headcta { transition: none; } }

/* First-view revision: make the media's promise and four reading paths visible. */
.hero-editorial {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 38px max(32px, calc((100vw - 1280px)/2)) 42px;
  display: grid;
  grid-template-columns: minmax(0,1.13fr) minmax(0,1fr);
  gap: 48px;
  align-items: center;
  min-height: 0;
  height: auto;
  background: #fff;
  overflow: visible;
}
.hero-editorial .hero-copy { padding: 10px 0 0; color: #242424; }
.hero-label { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 700; letter-spacing: .6px; }
.hero-label i { width: 6px; height: 6px; background: #242424; display: inline-block; flex-shrink: 0; }
.hero-editorial h1 { font-size: clamp(34px,3.8vw,54px); line-height: 1.55; letter-spacing: .2px; margin: 24px 0; white-space: nowrap; }
.hero-editorial .hero-description { font-size: 15px; line-height: 2; font-weight: 400; margin: 0 0 28px; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 22px; }
.hero-editorial .hero-primary { min-width: 0; color: #fff; background: #242424; border-color: #242424; padding: 12px 22px; font-size: 13px; gap: 25px; }
.hero-editorial .hero-primary:hover { background: #54545e; border-color: #54545e; color: #fff; }
.hero-consult { font-size: 12px; border-bottom: 1px solid #707070; padding: 8px 0; white-space: nowrap; font-weight: 500; }
.hero-consult span { margin-left: 14px; }
.hero-evidence { display: flex; flex-wrap: wrap; align-items: center; gap: 0; font-size: 10px; color: #707070; margin-top: 24px; }
.hero-evidence span+span { border-left: 1px solid #d8d8d8; padding-left: 14px; margin-left: 14px; }
.hero-editorial .hero-photo { position: relative; inset: auto; margin: 0; background: #f4f4f4; min-width: 0; }
.hero-editorial .hero-photo::after { display: none; }
.hero-photo-crop { height: 390px; overflow: hidden; }
.hero-editorial .hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 58% 50%; transform: none; }
.hero-editorial .hero-photo figcaption { position: static; color: #242424; text-shadow: none; font-size: 12px; padding: 18px 22px; display: flex; justify-content: space-between; align-items: center; gap: 15px; background: #f4f4f4; }
.photo-label { display: block; font-size: 9px; letter-spacing: 1.2px; color: #707070; margin-bottom: 7px; }
.photo-title { display: block; font-size: 15px; line-height: 1.7; font-weight: 700; }
.photo-title br { display: none; }
.hero-photo figcaption a { display: flex; width: 37px; height: 37px; border: 1px solid #b8b8b8; border-radius: 50%; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0; }
.hero-photo figcaption a:hover { color: #fff; background: #242424; text-decoration: none; }
.hero-topics { display: grid; grid-template-columns: 150px repeat(4,minmax(0,1fr)); max-width: 1280px; margin: 0 auto 12px; padding: 25px 32px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; scroll-margin-top: 20px; }
.topics-intro { padding: 4px 18px 4px 0; align-self: center; }
.topics-intro span { display: block; color: #707070; font-size: 10px; }
.topics-intro strong { display: block; font-size: 15px; font-weight: 700; }
.hero-topics>a { display: flex; align-items: center; gap: 11px; padding: 10px 14px; border-left: 1px solid #d8d8d8; }
.hero-topics>a:hover { background: #f4f4f4; text-decoration: none; }
.topic-number { color: #919191; font-size: 10px; align-self: start; margin-top: 5px; }
.hero-topics strong { font-size: 14px; font-weight: 700; white-space: nowrap; }
.hero-topics small { display: block; font-size: 10px; color: #707070; margin-top: 6px; white-space: nowrap; }
.topic-arrow { margin-left: auto; font-size: 15px; }
@media(min-width:1440px) { .hero-editorial { padding-left: 80px; padding-right: 80px; } }
@media(max-width:1100px) {
  .hero-editorial { padding: 32px 30px 36px; gap: 30px; }
  .hero-editorial h1 { font-size: 3.7vw; }
  .hero-photo-crop { height: 350px; }
  .hero-topics { padding: 22px 30px; grid-template-columns: 110px repeat(4,minmax(0,1fr)); }
  .hero-topics>a { padding-left: 12px; padding-right: 12px; gap: 7px; }
  .hero-topics strong { font-size: 12px; }
  .hero-topics small { font-size: 9px; }
  .topic-number { display: none; }
  .topic-arrow { font-size: 12px; }
  .topics-intro strong { font-size: 13px; }
}
@media(max-width:900px) and (min-width:761px) {
  .hero-editorial { grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); gap: 25px; }
  .hero-label { font-size: 10px; gap: 7px; }
  .hero-editorial h1 { font-size: 3.7vw; margin: 20px 0; }
  .hero-editorial .hero-description { font-size: 13px; margin-bottom: 20px; }
  .hero-editorial .hero-primary { font-size: 12px; padding: 10px 15px; gap: 20px; }
  .hero-actions { gap: 9px; }
  .hero-evidence { margin-top: 15px; font-size: 9px; }
  .hero-photo-crop { height: 335px; }
  .hero-topics { padding-left: 25px; padding-right: 25px; grid-template-columns: 95px repeat(4,minmax(0,1fr)); }
  .hero-topics>a { padding-left: 9px; padding-right: 9px; }
  .hero-topics strong { font-size: 11px; }
  .hero-topics small { font-size: 8px; }
}
@media(max-width:760px) {
  .hero-editorial { display: flex; flex-direction: column; align-items: stretch; padding: 30px 22px 25px; gap: 0; min-height: 0; }
  .hero-editorial .hero-copy { padding: 0; }
  .hero-label { font-size: 9px; letter-spacing: .1px; gap: 8px; }
  .hero-label i { width: 5px; height: 5px; }
  .hero-editorial h1 { font-size: clamp(27px,7.55vw,37px); margin: 20px 0; line-height: 1.55; letter-spacing: 0; }
  .hero-editorial .hero-description { font-size: 13px; line-height: 1.9; margin-bottom: 23px; }
  .hero-actions { gap: 12px 16px; }
  .hero-editorial .hero-primary { font-size: 12px; width: 100%; padding: 11px 16px; gap: 25px; }
  .hero-consult { font-size: 11px; margin: 0 auto; padding: 4px 0; }
  .hero-evidence { display: none; }
  .hero-editorial .hero-photo { display: none; }
  .hero-photo-crop { height: 125px; }
  .hero-editorial .hero-photo img { transform: scale(1.2); transform-origin: 50% 25%; object-position: 50% 20%; }
  .hero-editorial .hero-photo figcaption { display: block; padding: 14px 15px; }
  .photo-label { font-size: 8px; margin-bottom: 8px; }
  .photo-title { font-size: 12px; line-height: 1.7; }
  .photo-title br { display: inline; }
  .hero-photo figcaption a { width: 24px; height: 24px; font-size: 12px; position: absolute; right: 10px; bottom: 10px; }
  .hero-topics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0 22px 25px; gap: 0; margin: 0; border-top: 0; }
  .topics-intro { grid-column: 1/-1; padding: 0 0 15px; display: flex; align-items: center; gap: 5px; }
  .topics-intro span { font-size: 10px; }
  .topics-intro strong { font-size: 13px; }
  .hero-topics>a { border: 0; border-top: 1px solid #d8d8d8; padding: 18px 12px 18px 0; gap: 0; }
  .hero-topics>a:nth-of-type(even) { padding-left: 15px; border-left: 1px solid #d8d8d8; }
  .hero-topics strong { font-size: 12px; }
  .hero-topics small { font-size: 9px; margin-top: 4px; }
  .topic-arrow { font-size: 12px; }
}

/* Owner's experience and introduction of the actual sales / design pair. */
.keep-phrase { display: inline-block; }
.hero-value { display: block; margin-top: 5px; }
.hero-editorial .hero-description { font-size: 14px; }
.hero-editorial .hero-primary { padding-left: 20px; padding-right: 20px; font-size: 12px; gap: 20px; }
.hero-editorial .hero-actions { gap: 14px 22px; }
.hero-editorial .photo-title { font-size: 14px; }
.owner-byline { font-size: 12px; color: var(--muted); padding-bottom: 6px; }
.section-lead { font-size: 15px; line-height: 2; margin: 0 0 38px; }
.reason-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; }
.reason-grid article { border-top: 1px solid #242424; padding: 22px 0 5px; }
.reason-number { display: block; font-size: 12px; color: var(--muted); letter-spacing: 1px; }
.reason-grid h3 { font-size: 21px; line-height: 1.85; margin: 18px 0; font-weight: 700; }
.reason-grid p { font-size: 14px; line-height: 2; color: #54545e; margin: 0; }
.home-team .section-title { margin-bottom: 22px; }
.home-team-next { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 38px; padding: 25px 30px; background: var(--wash); }
.home-team-next p { font-size: 14px; margin: 0; line-height: 1.8; }
.home-team-next small { display: block; font-size: 11px; color: var(--muted); margin-top: 6px; }
.home-team-next .btn { font-size: 12px; gap: 22px; flex-shrink: 0; }
.solid { background: #242424; color: #fff; border-color: #242424; }
.solid:hover { background: #54545e; border-color: #54545e; }
.referral-team { max-width: 1280px; padding: 68px 50px 85px; }
.referral-team .referral-intro { max-width: 900px; }
.referral-team .referral-intro h1 { font-size: 44px; margin: 20px 0 24px; line-height: 1.65; }
.referral-team .referral-intro>p { font-size: 15px; line-height: 2; }
.intro-actions { display: flex; align-items: center; gap: 22px; margin: 30px 0 40px; }
.intro-actions .btn { font-size: 13px; gap: 30px; }
.intro-actions>span { font-size: 12px; color: var(--muted); }
.team-house { margin: 0; }
.team-house img { display: block; width: 100%; height: 370px; object-fit: cover; object-position: 50% 50%; }
.team-house figcaption { display: flex; gap: 18px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 12px; color: #54545e; }
.team-house figcaption .kicker { font-size: 9px; }
.referral-section { padding: 76px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 25px; }
.referral-section h2 { font-size: 31px; margin: 13px 0 25px; }
.experience-note { font-size: 11px; line-height: 1.9; color: var(--muted); margin: 28px 0 0; }
.owner-episode { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.2fr); gap: 60px; }
.owner-episode h2 { font-size: 30px; margin-top: 16px; }
.episode-byline { font-size: 12px; color: var(--muted); }
.episode-body p { font-size: 15px; line-height: 2.1; margin: 0 0 24px; }
.episode-body strong { font-weight: 700; text-decoration: underline; text-decoration-color: #b8b8b8; text-underline-offset: 5px; }
.episode-process { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 22px 18px; background: var(--wash); }
.episode-process span { font-size: 10px; line-height: 1.8; text-align: center; }
.episode-process b { font-size: 11px; font-weight: 700; }
.episode-process i { font-style: normal; color: #919191; font-size: 12px; }
.people-pair { display: grid; grid-template-columns: minmax(0,1fr) 34px minmax(0,1fr); gap: 18px; margin-top: 32px; }
.person-card { border: 1px solid var(--line); padding: 32px; }
.person-role { display: block; font-size: 11px; font-weight: 500; letter-spacing: 1px; color: var(--muted); }
.person-card h3 { font-size: 23px; line-height: 1.8; margin: 20px 0; }
.person-card p { font-size: 14px; line-height: 2; color: #54545e; margin: 0; }
.person-fact { display: block; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 18px; font-size: 11px; }
.pair-plus { align-self: center; justify-self: center; font-size: 27px; font-weight: 400; color: #919191; }
.referral-team .source { margin-bottom: 0; }
.team-offer { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 30px; background: var(--wash); margin-top: 22px; }
.team-offer h3 { font-size: 22px; margin: 12px 0; }
.team-offer p { font-size: 12px; margin: 0; max-width: 630px; }
.team-offer .btn { font-size: 12px; flex-shrink: 0; gap: 20px; }
.condition-list { margin: 30px 0; border-top: 1px solid var(--line); }
.condition-list>div { display: grid; grid-template-columns: 200px minmax(0,1fr); gap: 30px; border-bottom: 1px solid var(--line); padding: 22px 0; font-size: 14px; line-height: 1.9; }
.condition-list dt { font-weight: 700; }
.condition-list dd { margin: 0; color: #54545e; }
.flow-title { font-size: 20px; margin: 42px 0 20px; }
.referral-conditions .steps { margin-bottom: 0; }
.referral-team .formbox { margin-top: 76px; }
#referral-form { scroll-margin-top: 30px; }
.production-notes { border-top: 1px dashed var(--line); padding-top: 18px; margin-top: 55px; font-size: 11px; color: var(--muted); }
.production-notes summary { cursor: pointer; }
.production-notes p { line-height: 2; }
@media(max-width:1100px) {
  .referral-team { padding-left: 35px; padding-right: 35px; }
  .home-team-next { align-items: start; flex-direction: column; gap: 20px; }
  .owner-episode { gap: 35px; }
  .reason-grid { gap: 24px; }
  .reason-grid h3 { font-size: 18px; }
  .team-offer { align-items: start; flex-direction: column; }
}
@media(max-width:760px) {
  .hero-editorial .hero-description { font-size: 12px; line-height: 2; }
  .hero-editorial .hero-description br { display: inline; }
  .hero-editorial .hero-primary { font-size: 12px; padding: 11px 10px; gap: 15px; }
  .owner-byline { display: block; margin-top: 15px; font-size: 10px; }
  .section-lead { font-size: 14px; margin-bottom: 26px; }
  .section-lead br { display: none; }
  .reason-grid { grid-template-columns: 1fr; gap: 28px; }
  .reason-grid article { position: relative; padding: 20px 0 0 36px; }
  .reason-number { position: absolute; top: 25px; left: 0; font-size: 10px; }
  .reason-grid h3 { font-size: 20px; margin: 0 0 14px; line-height: 1.7; }
  .reason-grid p { font-size: 14px; }
  .home-team-next { padding: 24px 20px; margin-top: 30px; gap: 20px; }
  .home-team-next p { font-size: 13px; }
  .home-team-next strong { display: block; }
  .home-team-next .btn { width: 100%; font-size: 11px; gap: 15px; padding: 12px 8px; }
  .referral-team { padding: 38px 22px 50px; }
  .referral-team .referral-intro h1 { font-size: clamp(23px,6.4vw,27px); letter-spacing: 0; line-height: 1.7; margin: 18px 0 22px; }
  .referral-team .referral-intro>p { font-size: 13px; line-height: 2.1; }
  .referral-team .referral-intro>p br { display: none; }
  .intro-actions { flex-direction: column; align-items: stretch; gap: 11px; margin: 25px 0 30px; }
  .intro-actions .btn { font-size: 12px; padding: 12px 10px; gap: 18px; }
  .intro-actions>span { font-size: 10px; text-align: center; }
  .team-house img { height: 230px; object-position: 58% 50%; }
  .team-house figcaption { display: block; font-size: 10px; line-height: 1.9; padding: 13px 0; }
  .team-house figcaption .kicker { margin-bottom: 5px; }
  .referral-section { padding: 50px 0; }
  .referral-section h2 { font-size: 25px; margin-bottom: 23px; letter-spacing: .3px; }
  .experience-note { font-size: 10px; margin-top: 24px; }
  .owner-episode { grid-template-columns: 1fr; gap: 18px; }
  .episode-byline { font-size: 10px; margin-top: -5px; }
  .episode-body p { font-size: 14px; margin-bottom: 23px; }
  .episode-process { padding: 18px 10px; gap: 6px; }
  .episode-process span { font-size: 8px; }
  .episode-process b { font-size: 9px; }
  .people-pair { grid-template-columns: 1fr; gap: 12px; margin-top: 28px; }
  .person-card { padding: 25px 22px; }
  .person-role { font-size: 10px; }
  .person-card h3 { font-size: 22px; margin: 18px 0; }
  .person-fact { font-size: 10px; margin-top: 20px; }
  .pair-plus { font-size: 23px; }
  .team-offer { padding: 25px 20px; gap: 23px; margin-top: 16px; }
  .team-offer h3 { font-size: 20px; }
  .team-offer p { font-size: 12px; line-height: 2; }
  .team-offer .btn { width: 100%; font-size: 12px; padding: 12px 8px; }
  .condition-list>div { grid-template-columns: 1fr; gap: 10px; padding: 20px 0; font-size: 13px; }
  .flow-title { font-size: 18px; margin-top: 32px; }
  .referral-team .formbox { margin-top: 50px; }
  .referral-team .formbox h2 { font-size: 22px; }
  .production-notes { font-size: 10px; }
}

/* Owner authorship is the media promise; the introduction follows the story. */
.hero-owner-led h1 { font-size: clamp(33px,3.45vw,49px); line-height: 1.65; letter-spacing: 0; }
.hero-owner-led .hero-description { font-size: 14px; line-height: 2.1; margin-bottom: 27px; }
.hero-owner-led .hero-primary { font-size: 13px; padding: 13px 24px; gap: 35px; }
.owner-signature { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; border-top: 1px solid var(--line); margin-top: 27px; padding-top: 19px; color: #707070; font-size: 10px; line-height: 1.9; }
.signature-name { color: #242424; font-weight: 700; font-size: 12px; }
.signature-name small { display: block; font-size: 11px; font-weight: 400; }
.byline-tiktok { display: block; font-size: 11px; text-decoration: underline; text-underline-offset: 4px; margin-top: 5px; }
.signature-name small a { display: inline-block; padding: 3px 0 0; text-decoration: underline; text-underline-offset: 3px; }
.writer-account { font-size: 12px; margin: 7px 0 0; }
.writer-account a { text-decoration: underline; text-underline-offset: 4px; }
.owner .tiktok-note { font-size: 13px; }
.owner .tiktok-note a { display: inline-block; margin-top: 8px; text-decoration: underline; text-underline-offset: 5px; }
.owner-signature>a { font-size: 10px; text-decoration: underline; text-underline-offset: 5px; }
.hero-owner-led .hero-photo-crop { height: 390px; }
.hero-owner-led .hero-photo figcaption { padding: 17px 22px; }
.hero-owner-led .photo-title { font-size: 15px; }
.photo-context { display: block; font-size: 10px; line-height: 1.8; color: var(--muted); margin-top: 5px; }
.owner-records { scroll-margin-top: 20px; }
.records-lead { font-size: 14px; line-height: 2; margin: 0; color: #54545e; }
.experience-stories { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; }
.experience-stories article { border-top: 1px solid #242424; padding-top: 23px; display: flex; align-items: start; flex-direction: column; }
.story-heading { display: flex; align-items: center; gap: 14px; font-size: 11px; }
.story-index { font-size: 11px; color: var(--muted); }
.story-category { font-weight: 700; }
.experience-stories h3 { font-size: 21px; line-height: 1.85; margin: 22px 0 18px; }
.experience-stories p { font-size: 14px; line-height: 2; margin: 0 0 20px; color: #54545e; }
.experience-stories .textlink { margin-top: auto; font-size: 12px; }
.experience-stories small { display: block; font-size: 9px; color: var(--muted); line-height: 1.9; margin-top: 16px; }
.editorial-promise { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 70px; padding: 65px 0; border-bottom: 1px solid var(--line); }
.editorial-promise h2 { font-size: 29px; margin-bottom: 15px; }
.editorial-promise .textlink { font-size: 12px; }
.promise-list article { display: flex; gap: 20px; padding: 23px 0; border-top: 1px solid var(--line); }
.promise-list article:first-child { padding-top: 0; border-top: 0; }
.promise-list article:last-child { padding-bottom: 0; }
.promise-list b { font-size: 10px; color: var(--muted); padding-top: 5px; }
.promise-list h3 { font-size: 16px; margin: 0 0 10px; line-height: 1.8; }
.promise-list p { font-size: 13px; line-height: 2; color: #54545e; margin: 0; }
.content-origin { display: inline-block; font-size: 11px; font-weight: 700; line-height: 1.9; letter-spacing: .4px; color: #707070; border-bottom: 1px solid #b8b8b8; padding-bottom: 6px; }
.home-team { border-top: 1px solid var(--line); border-bottom: 0; }
.writer-context { margin: 28px 0; padding: 22px 26px; border: 1px solid var(--line); }
.writer-context b { font-size: 13px; }
.writer-context p { font-size: 13px; line-height: 1.95; color: #54545e; margin: 10px 0; }
.writer-context a { font-size: 11px; text-decoration: underline; text-underline-offset: 5px; }
.owner-answer { border-left: 3px solid #242424; padding: 20px 26px; margin: 30px 0; background: var(--wash); }
.article-body .owner-answer p { font-size: 16px; line-height: 2.1; margin: 13px 0 0; }
.experience-detail { padding: 25px 28px; background: var(--wash); margin: 30px 0; }
.experience-detail ol { padding-left: 20px; margin: 25px 0 0; }
.experience-detail li { padding: 0 0 18px 6px; font-size: 14px; }
.experience-detail li:last-child { padding-bottom: 0; }
.experience-detail li b { display: block; font-size: 15px; }
.experience-detail li span { display: block; font-size: 13px; margin-top: 7px; color: #54545e; }
.writer-note { border-top: 1px solid var(--line); padding: 28px 0 0; margin-top: 40px; }
.writer-note>b { font-size: 14px; }
.writer-note p { font-size: 13px; margin: 12px 0 0; color: #54545e; }
.writer-note .textlink { font-size: 12px; }
@media(max-width:1100px) {
  .hero-owner-led h1 { font-size: 3.4vw; }
  .hero-owner-led .hero-description { font-size: 13px; }
  .hero-owner-led .hero-photo-crop { height: 390px; }
  .hero-owner-led .photo-title { font-size: 13px; }
  .owner-signature { gap: 12px; }
  .owner-signature>a { display: none; }
  .experience-stories { gap: 25px; }
  .experience-stories h3 { font-size: 18px; }
  .editorial-promise { gap: 35px; }
}
@media(max-width:900px) and (min-width:761px) {
  .hero-owner-led .hero-description { font-size: 12px; }
  .hero-owner-led .hero-actions { gap: 10px; }
  .hero-owner-led .hero-primary { font-size: 12px; padding: 11px 18px; }
  .hero-owner-led .hero-photo-crop { height: 380px; }
  .owner-signature { font-size: 9px; }
}
@media(max-width:760px) {
  .hero-owner-led { padding: 28px 22px 25px; gap: 26px; }
  .hero-owner-led .hero-label { font-size: 9px; letter-spacing: 0; }
  .hero-owner-led h1 { font-size: clamp(21px,6.7vw,36px); line-height: 1.7; margin: 20px 0; }
  .hero-owner-led .hero-description { font-size: 12px; line-height: 2; margin-bottom: 23px; }
  .hero-owner-led .hero-primary { font-size: 13px; padding: 11px 15px; gap: 30px; }
  .owner-signature { margin-top: 23px; padding-top: 16px; gap: 12px 15px; font-size: 9px; }
  .signature-name { font-size: 11px; }
  .signature-name small { font-size: 10px; }
  .hero-owner-led .hero-photo { display: block; }
  .hero-owner-led .hero-photo-crop { height: 200px; }
  .hero-owner-led .hero-photo img { transform: none; object-position: 58% 50%; }
  .hero-owner-led .hero-photo figcaption { display: flex; align-items: center; padding: 15px 16px; }
  .hero-owner-led .photo-label { font-size: 8px; margin-bottom: 6px; }
  .hero-owner-led .photo-title { font-size: 13px; }
  .hero-owner-led .photo-context { font-size: 9px; }
  .hero-owner-led .hero-photo figcaption a { position: static; width: 30px; height: 30px; font-size: 14px; }
  .hero-topics { padding-top: 5px; }
  .owner-records h2 { font-size: 26px; }
  .records-lead { font-size: 13px; margin-top: 22px; }
  .experience-stories { grid-template-columns: 1fr; gap: 32px; }
  .experience-stories article { padding-top: 20px; }
  .story-heading { font-size: 10px; }
  .experience-stories h3 { font-size: 22px; margin: 18px 0; line-height: 1.75; }
  .experience-stories p { font-size: 14px; margin-bottom: 20px; }
  .experience-stories .textlink { font-size: 12px; }
  .experience-stories small { font-size: 9px; margin-top: 12px; }
  .editorial-promise { grid-template-columns: 1fr; gap: 28px; padding: 50px 0; }
  .editorial-promise h2 { font-size: 25px; }
  .editorial-promise .textlink { font-size: 11px; }
  .promise-list article { gap: 14px; }
  .promise-list h3 { font-size: 16px; }
  .promise-list p { font-size: 13px; }
  .content-origin { font-size: 10px; }
  .writer-context { padding: 20px; margin: 25px 0; }
  .writer-context p { font-size: 12px; }
  .owner-answer { padding: 20px; }
  .article-body .owner-answer p { font-size: 14px; }
  .owner-answer p br { display: none; }
  .experience-detail { padding: 22px 20px; }
  .experience-detail li b { font-size: 14px; }
  .experience-detail li span { font-size: 13px; }
}

/* Full-bleed FV using the owner-supplied living-room photograph. */
.hero-fullbleed {
  display: flex;
  align-items: center;
  position: relative;
  max-width: none;
  width: 100%;
  height: calc(100svh - 148px);
  min-height: 680px;
  max-height: 920px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  background: #37322e;
}
.hero-fullbleed .hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; background: transparent; z-index: -1; }
.hero-fullbleed .hero-photo-crop { height: 100%; }
.hero-fullbleed .hero-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 39%; transform: none; }
.hero-fullbleed .hero-photo::after { display: block; content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.54) 37%,rgba(0,0,0,.14) 72%,rgba(0,0,0,.04) 100%),linear-gradient(0deg,rgba(0,0,0,.48),transparent 28%); pointer-events: none; }
.hero-fullbleed .hero-copy { width: 100%; max-width: 1280px; margin: 0 auto; padding: 54px 50px 66px; color: #fff; z-index: 1; }
.hero-fullbleed .hero-label { color: #fff; font-weight: 500; }
.hero-fullbleed .hero-label i { background: #fff; }
.hero-fullbleed h1 { font-size: clamp(34px,3.65vw,53px); font-weight: 700; line-height: 1.65; margin: 24px 0; text-shadow: 0 2px 16px rgba(0,0,0,.15); }
.hero-fullbleed .hero-description { color: #fff; font-size: 14px; line-height: 2.1; }
.hero-fullbleed .hero-actions { max-width: 660px; gap: 18px 26px; }
.hero-fullbleed .hero-primary { background: #fff; border-color: #fff; color: #242424; font-size: 13px; }
.hero-fullbleed .hero-primary:hover { background: #e9e9e9; color: #242424; border-color: #e9e9e9; }
.hero-fullbleed .hero-consult { color: #fff; border-color: rgba(255,255,255,.8); }
.hero-fullbleed .owner-signature { max-width: 660px; color: rgba(255,255,255,.9); border-color: rgba(255,255,255,.4); margin-top: 28px; padding-top: 20px; }
.hero-fullbleed .signature-name { color: #fff; }
.hero-fullbleed .hero-photo figcaption { position: absolute; inset: auto 40px 28px auto; max-width: 400px; color: #fff; background: transparent; padding: 0; text-shadow: 0 1px 10px rgba(0,0,0,.3); z-index: 2; }
.hero-fullbleed .photo-label, .hero-fullbleed .photo-context { color: rgba(255,255,255,.9); }
.hero-fullbleed .photo-label { font-size: 9px; }
.hero-fullbleed .photo-title { font-size: 14px; }
.hero-fullbleed .hero-photo figcaption a { border-color: rgba(255,255,255,.6); color: #fff; width: 38px; height: 38px; }
.hero-fullbleed .hero-photo figcaption a:hover { color: #242424; background: #fff; }
.hero-fullbleed + .hero-topics { border-top: 0; margin-top: 0; }
@media(min-width:1600px) { .hero-fullbleed .hero-copy { max-width: 1440px; padding-left: 70px; padding-right: 70px; } }
@media(max-width:1100px) {
  .hero-fullbleed { min-height: 650px; }
  .hero-fullbleed .hero-copy { padding: 48px 40px 75px; }
  .hero-fullbleed h1 { font-size: 4.1vw; }
  .hero-fullbleed .owner-signature { max-width: 590px; }
  .hero-fullbleed .hero-photo figcaption { right: 30px; bottom: 23px; }
}
@media(max-width:760px) {
  .hero-fullbleed { display: flex; align-items: center; height: calc(100svh - 174px); min-height: 650px; max-height: none; padding: 0; gap: 0; }
  .hero-fullbleed .hero-copy { padding: 34px 22px 108px; margin: 0; max-width: none; }
  .hero-fullbleed .hero-label { font-size: 9px; }
  .hero-fullbleed h1 { font-size: clamp(21px,6.7vw,36px); line-height: 1.7; margin: 20px 0; }
  .hero-fullbleed .hero-description { font-size: 12px; line-height: 2; margin-bottom: 23px; }
  .hero-fullbleed .hero-actions { gap: 13px; }
  .hero-fullbleed .hero-primary { font-size: 13px; padding: 11px 15px; }
  .hero-fullbleed .hero-consult { padding: 3px 0; }
  .hero-fullbleed .owner-signature { margin-top: 23px; padding-top: 16px; }
  .hero-fullbleed .owner-signature>span:nth-child(2) { display: none; }
  .hero-fullbleed .hero-photo { display: block; position: absolute; inset: 0; height: 100%; }
  .hero-fullbleed .hero-photo-crop { height: 100%; }
  .hero-fullbleed .hero-photo img { object-fit: cover; object-position: 55% 50%; transform: none; }
  .hero-fullbleed .hero-photo::after { background: linear-gradient(90deg,rgba(0,0,0,.63),rgba(0,0,0,.38)),linear-gradient(0deg,rgba(0,0,0,.55),transparent 30%); }
  .hero-fullbleed .hero-photo figcaption { inset: auto 22px 100px 22px; max-width: none; display: flex; align-items: center; padding: 0; }
  .hero-fullbleed .photo-label { font-size: 8px; margin-bottom: 5px; }
  .hero-fullbleed .photo-title { font-size: 12px; }
  .hero-fullbleed .photo-context { font-size: 9px; }
  .hero-fullbleed .hero-photo figcaption a { position: static; width: 32px; height: 32px; }
}

/* Accent colours sampled from Sekisui House's official logo.svg on 2026-10-16.
   Logo fills: blue #2e71c0 / red #ed1343. The action red is slightly darker
   to keep white small text readable. The iekatsu wordmark remains unchanged. */
:root {
  --accent: #2e71c0;
  --accent-blue: #2e71c0;
  --accent-blue-hover: #245a9a;
  --accent-red: #ed1343;
  --accent-red-action: #d9103b;
  --accent-red-hover: #b80d32;
  --accent-red-ink: #c91039;
  --accent-wash: #f3f7fc;
}

/* Introductions and consultation. */
.headcta,
a.btn[href^="#referral"],
.btn.solid,
.mobilebar .btn {
  color: #fff;
  background: var(--accent-red-action);
  border-color: var(--accent-red-action);
}
.headcta:hover,
a.btn[href^="#referral"]:hover,
.btn.solid:hover,
.mobilebar .btn:hover {
  color: #fff;
  background: var(--accent-red-hover);
  border-color: var(--accent-red-hover);
}
.hero-fullbleed .hero-photo figcaption a {
  color: #fff;
  background: var(--accent-red-action);
  border-color: var(--accent-red-action);
  text-shadow: none;
}
.hero-fullbleed .hero-photo figcaption a:hover {
  color: #fff;
  background: var(--accent-red-hover);
  border-color: var(--accent-red-hover);
}
.article-next { border-top: 3px solid var(--accent-red); }
.formbox>.kicker { color: var(--accent-red-ink); }

/* Reading and understanding. */
.hero-fullbleed .hero-primary {
  color: #fff;
  background: var(--accent-blue);
  border-color: var(--accent-blue);
}
.hero-fullbleed .hero-primary:hover {
  color: #fff;
  background: var(--accent-blue-hover);
  border-color: var(--accent-blue-hover);
}
.textlink,
.writer-account a,
.byline-tiktok,
.writer-context a,
.tiktok-note a,
.sidebox>a:not(.btn) { color: var(--accent-blue); }
.textlink { border-bottom-color: var(--accent-blue); }
.textlink:hover,
.writer-account a:hover,
.byline-tiktok:hover,
.writer-context a:hover,
.tiktok-note a:hover,
.sidebox>a:not(.btn):hover { color: var(--accent-blue-hover); }
.mainnav a:hover { color: var(--accent-blue); }
.hero-topics .topic-number,
.hero-topics .topic-arrow,
.story-index,
.reason-number,
.promise-list article>b,
.steps b { color: var(--accent-blue); }
.hero-topics>a[href="#referral"] strong,
.hero-topics>a[href="#referral"] .topic-arrow { color: var(--accent-red-ink); }
.content-origin { color: var(--accent-blue); border-color: var(--accent-blue); }
.owner-answer { border-left-color: var(--accent-blue); background: var(--accent-wash); }
.hero-fullbleed .hero-label i { background: var(--accent-red); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline-color: var(--accent-blue); }

/* Circular author photo: display only the profile-photo area of the supplied
   TikTok screenshot. The original image is not altered. */
.writer-profile-card { display: grid; grid-template-columns: 88px minmax(0,1fr); align-items: start; gap: 24px; }
.author-avatar { display: block; position: relative; width: 88px; height: 88px; border-radius: 50%; overflow: hidden; border: 2px solid #fff; box-shadow: 0 0 0 1px #cbd6e4; background: #f3f7fc; }
.author-avatar img { display: block; position: absolute; max-width: none; width: 478%; height: auto; left: -13.1%; top: -16.3%; }
.writer-profile-copy { min-width: 0; }
.writer-profile-copy .kicker { font-size: 10px; letter-spacing: .6px; margin: 0 0 8px; }
.writer-profile-copy .writer-display-name { display: block; font-size: 16px; font-weight: 700; line-height: 1.7; color: #242424; }
.writer-profile-copy .writer-profile-account { display: inline-block; margin-top: 5px; font-size: 11px; color: var(--accent-blue); text-decoration: underline; text-underline-offset: 4px; }
.writer-profile-copy .writer-profile-account:hover { color: var(--accent-blue-hover); }
.writer-note.writer-profile-card { padding: 28px 0 0; }
@media(max-width:760px) {
  .writer-profile-card { grid-template-columns: 64px minmax(0,1fr); gap: 16px; }
  .author-avatar { width: 64px; height: 64px; }
  .writer-profile-copy .kicker { font-size: 9px; margin-bottom: 7px; }
  .writer-profile-copy .writer-display-name { font-size: 14px; }
  .writer-profile-copy .writer-profile-account { font-size: 10px; }
}

/* Explain the sales role and owner-observed differences before offering the pair. */
.referral-opening-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.9fr); gap: 50px; align-items: start; }
.referral-opening-grid .referral-intro h1 { font-size: clamp(30px,3.05vw,42px); line-height: 1.65; letter-spacing: .3px; margin: 22px 0 26px; }
.referral-opening-grid .referral-intro>p { font-size: 14px; line-height: 2.1; }
.referral-opening-grid .intro-actions { display: block; margin: 28px 0; }
.intro-actions a.sales-read-button { color: #fff; background: var(--accent-blue); border-color: var(--accent-blue); font-size: 12px; padding: 12px 20px; }
.intro-actions a.sales-read-button:hover { background: var(--accent-blue-hover); border-color: var(--accent-blue-hover); }
.intro-contact-link { display: block; width: fit-content; font-size: 12px; color: var(--accent-red-ink); margin-top: 18px; padding-bottom: 4px; border-bottom: 1px solid currentColor; }
.referral-opening-grid .referral-owner-credit { color: var(--muted); font-size: 11px; margin: 28px 0 0; line-height: 1.9; }
.referral-owner-credit a { color: var(--accent-blue); text-decoration: underline; text-underline-offset: 4px; }
.referral-opening-grid .referral-intro .referral-owner-credit br { display: initial; }
.sales-choice-note { background: var(--wash); padding: 32px; border-top: 3px solid var(--accent-red); }
.sales-choice-note h2 { font-size: 20px; line-height: 1.85; margin: 13px 0 25px; letter-spacing: .1px; }
.sales-choice-note ol { margin: 0; padding: 0; list-style: none; }
.sales-choice-note li { display: flex; align-items: start; gap: 14px; padding: 20px 0; border-top: 1px solid var(--line); }
.sales-choice-note li>span { color: var(--accent-blue); font-size: 10px; padding-top: 3px; }
.sales-choice-note li b { font-size: 14px; line-height: 1.9; }
.sales-choice-note li p { font-size: 12px; line-height: 1.9; margin: 7px 0 0; color: #54545e; }
.sales-choice-note .choice-note-source { font-size: 10px; color: var(--muted); line-height: 1.9; margin: 8px 0 0; }
.sales-comparison { border-collapse: collapse; width: 100%; table-layout: fixed; font-size: 13px; line-height: 2; }
.sales-comparison th, .sales-comparison td { text-align: left; vertical-align: top; padding: 24px; border: 1px solid var(--line); }
.sales-comparison thead th { font-weight: 700; padding-top: 16px; padding-bottom: 16px; background: var(--wash); font-size: 12px; }
.sales-comparison thead th:first-child { width: 160px; }
.sales-comparison tbody th { font-size: 14px; font-weight: 700; background: #fafafa; }
.sales-comparison td { color: #54545e; }
.sales-comparison td b { display: block; font-size: 14px; color: #242424; margin-bottom: 12px; line-height: 1.85; }
.sales-comparison thead th:last-child { color: var(--accent-blue-hover); background: #f3f7fc; }
.sales-comparison .sales-actual { background: #f8fafd; }
.sales-personal-view { border-left: 3px solid var(--accent-red); padding: 4px 0 4px 28px; max-width: 850px; margin-top: 42px; }
.sales-personal-view h3 { font-size: 24px; line-height: 1.8; margin: 12px 0 16px; }
.sales-personal-view p { font-size: 14px; line-height: 2.1; margin: 0; }
.ca-definition { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: 55px; margin: 30px 0 10px; }
.ca-definition .ca-plain-answer { font-size: 21px; line-height: 1.9; margin: 0 0 20px; }
.ca-definition p { font-size: 14px; line-height: 2; }
.ca-facts { margin: 0; }
.ca-facts>div { padding: 15px 0; border-top: 1px solid var(--line); }
.ca-facts dt { font-size: 11px; color: var(--muted); margin-bottom: 7px; }
.ca-facts dd { margin: 0; font-size: 14px; }
.ca-owner-link { margin: 30px 0 35px; padding: 26px 30px; background: var(--wash); }
.ca-owner-link h3 { font-size: 24px; line-height: 1.8; margin: 0 0 18px; }
.ca-owner-link p { font-size: 14px; line-height: 2; margin: 12px 0 0; }
@media(max-width:1100px) {
  .referral-opening-grid { gap: 30px; grid-template-columns: minmax(0,1.2fr) minmax(0,.9fr); }
  .referral-opening-grid .referral-intro h1 { font-size: 3.2vw; }
  .referral-opening-grid .referral-intro>p br { display: none; }
  .sales-choice-note { padding: 26px; }
  .sales-choice-note h2 { font-size: 18px; }
  .sales-comparison th, .sales-comparison td { padding: 20px; }
  .sales-comparison thead th:first-child { width: 140px; }
  .ca-definition { gap: 30px; }
}
@media(max-width:760px) {
  .referral-opening-grid { grid-template-columns: 1fr; gap: 34px; }
  .referral-opening-grid .referral-intro h1 { font-size: clamp(23px,6.6vw,30px); letter-spacing: 0; margin: 20px 0 23px; line-height: 1.7; }
  .referral-opening-grid .referral-intro>p { font-size: 14px; line-height: 2; }
  .referral-opening-grid .intro-actions { margin: 25px 0; }
  .intro-actions .sales-read-button { width: 100%; font-size: 11px; padding: 11px 10px; gap: 15px; }
  .intro-contact-link { margin: 18px auto 0; font-size: 11px; }
  .referral-opening-grid .referral-owner-credit { font-size: 10px; margin-top: 23px; }
  .sales-choice-note { padding: 25px 22px; }
  .sales-choice-note h2 { font-size: 20px; }
  .sales-choice-note li { padding: 18px 0; }
  .sales-choice-note li b { font-size: 14px; }
  .sales-comparison, .sales-comparison tbody { display: block; }
  .sales-comparison thead { display: none; }
  .sales-comparison tr { display: block; margin-bottom: 26px; border: 1px solid var(--line); }
  .sales-comparison th, .sales-comparison td { display: block; padding: 20px; border: 0; }
  .sales-comparison tbody th { background: #f1f1f1; font-size: 16px; padding: 16px 20px; }
  .sales-comparison td { border-top: 1px solid var(--line); font-size: 13px; }
  .sales-comparison td::before { content: attr(data-label); display: block; font-size: 10px; font-weight: 700; color: var(--muted); margin-bottom: 11px; }
  .sales-comparison .sales-actual::before { color: var(--accent-blue-hover); }
  .sales-comparison td b { font-size: 14px; margin-bottom: 10px; }
  .sales-personal-view { padding-left: 20px; margin-top: 32px; }
  .sales-personal-view h3 { font-size: 23px; }
  .sales-personal-view p { font-size: 14px; }
  .ca-definition { grid-template-columns: 1fr; gap: 22px; margin-top: 23px; }
  .ca-definition .ca-plain-answer { font-size: 19px; line-height: 1.9; }
  .ca-plain-answer br { display: none; }
  .ca-facts dd { font-size: 13px; }
  .ca-owner-link { padding: 25px 22px; margin-top: 25px; }
  .ca-owner-link h3 { font-size: 22px; }
}