.hero { min-height: 680px; }
.hero-img { object-position: center 65%; }
.hero-bg { background: radial-gradient(ellipse at center,rgba(42,26,14,.65),rgba(42,26,14,.35) 50%,rgba(42,26,14,.08)) !important; }
.hero-illustration { position:absolute; z-index:2; bottom:18px; left:50%; transform:translateX(-50%); max-width:calc(100% - 32px); width:max-content; padding:6px 10px; border-radius:8px; background:rgba(42,26,14,.75); color:#fff; font-size:11px; line-height:1.4; text-align:center; }
.solution-path { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:0; gap:32px; margin-top:48px; text-align:left; }
.solution-path li { border-top:1px solid var(--color-border); padding-top:20px; }
.solution-path span { font-size:14px; color:var(--color-accent); }
.solution-path h3 { font-size:24px; margin:20px 0 12px; line-height:1.3; }
.solution-path p { font-size:16px; color:var(--color-ink-muted); }
.solution-help { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.solution-help p,.solution-help li { font-size:16px; line-height:1.7; }
.solution-help ul { padding-left:20px; margin:24px 0; }
.solution-help .btn { margin-top:24px; }
.solution-photo { position:relative; margin:0; overflow:hidden; border-radius:24px; background:#f6f1e9; aspect-ratio:1; flex-shrink:0; }
.solution-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.solution-photo figcaption { position:absolute; bottom:8px; left:10px; color:#665447; font-size:10px; background:rgba(255,255,255,.9); border-radius:4px; padding:2px 5px; }
.solution-card .solution-photo { margin:20px 0; }
.solution-card > p { font-size:15px; line-height:1.6; }
.solution-card .range-example-note { font-size:12px; margin-top:12px; }
.solution-link { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:48px; margin-top:24px; padding-top:14px; border-top:1px solid var(--color-border); font-size:14px; }
.solution-card { height:100%; }
.solution-card .solution-link { margin-top:auto; }
.solution-preferences { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:20px; padding-top:20px; border-top:1px solid var(--color-border); }
.solution-settings { margin-top:16px; border-top:1px solid var(--color-border); font-size:13px; }
.solution-settings > summary { min-height:48px; cursor:pointer; padding-block:14px; }
.solution-preferences label { display:block; font-size:13px; margin-bottom:8px; color:var(--color-ink-muted); }
.solution-preferences select,.solution-preferences input { width:100%; min-width:0; min-height:48px; padding:10px 12px; background:#fff; border:1px solid var(--color-border); border-radius:12px; color:var(--color-ink); font:inherit; font-size:14px; }
.solution-preferences small { display:block; font-size:12px; margin-top:8px; }
.compact-product .solution-photo { width:96px; height:96px; }
.compact-product .solution-photo figcaption { font-size:8px; bottom:4px; left:4px; }
.solution-confirmation { font-size:12px; line-height:1.6; color:var(--color-ink-muted); margin-top:14px; }
.solution-options { border-top:1px solid var(--color-border); padding-top:14px; margin-top:16px; font-size:13px; }
.solution-options h4 { font-size: 1.02rem; margin: 0 0 8px; }
.solution-option-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); gap:8px; }
.solution-options button { min-width:0; display:flex; flex-direction:column; align-items:start; text-align:left; gap:6px; padding:12px; min-height:48px; border:1px solid var(--color-border); border-radius:12px; overflow-wrap:anywhere; cursor:pointer; }
.solution-options button:hover { border-color:var(--color-accent); background:var(--color-accent-bg); }
.solution-option-action { margin-top:auto; color:var(--color-accent); font-weight:600; }
.compact-product h3 { font-size:24px; overflow-wrap:anywhere; }
.preview-photo.solution-photo { width:96px; height:96px; }
@media(max-width:767px) {
 .hero { min-height:640px; }
 .hero-img { transform:none; object-position:42% center; }
 .solution-path { grid-template-columns:1fr; gap:24px; }
 .solution-help { grid-template-columns:1fr; gap:32px; }
 .solution-preferences { grid-template-columns:1fr; }
 .solution-preferences select,.solution-preferences input { font-size:16px; }
 .compact-product h3 { font-size:23px; }
}
