/* GEODOMAS ARCH LAB · Roof Selection Field V4 */
.roof-field-v4{position:relative;overflow:hidden;padding:clamp(76px,8vw,132px) 0;background:#061523;color:#eef7fc;border-block:1px solid rgba(133,205,239,.16)}
.roof-field-v4::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(115,194,231,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(115,194,231,.045) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,transparent,black 16%,black 84%,transparent)}
.roof-field-v4 .rf4-shell{position:relative;z-index:1;width:min(1240px,calc(100% - 40px));margin:auto}
.roof-field-v4 .rf4-head{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(280px,.76fr);gap:clamp(30px,6vw,88px);align-items:end;margin-bottom:44px}
.roof-field-v4 .rf4-eyebrow{margin:0 0 16px;color:#7ed0f2;font:700 12px/1.2 system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.roof-field-v4 h2{margin:0;font:700 clamp(40px,5.2vw,76px)/.98 system-ui,sans-serif;letter-spacing:-.045em;max-width:900px}
.roof-field-v4 .rf4-lead{margin:0;color:#b8cbd6;font:400 clamp(17px,1.45vw,21px)/1.65 system-ui,sans-serif}
.roof-field-v4 .rf4-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);gap:18px;align-items:stretch}
.roof-field-v4 .rf4-figure{margin:0;padding:16px;border:1px solid rgba(126,208,242,.22);border-radius:28px;background:rgba(4,18,30,.74);box-shadow:0 32px 90px rgba(0,0,0,.25)}
.roof-field-v4 .rf4-figure img{display:block;width:100%;height:auto;border-radius:17px;background:#071a29}
.roof-field-v4 figcaption{padding:16px 7px 3px;color:#8fa8b6;font:500 13px/1.55 system-ui,sans-serif}
.roof-field-v4 .rf4-list{display:grid;grid-template-columns:1fr;gap:10px}
.roof-field-v4 .rf4-card{position:relative;padding:21px 22px 21px 66px;border:1px solid rgba(126,208,242,.17);border-radius:20px;background:linear-gradient(135deg,rgba(20,48,68,.78),rgba(8,27,42,.84))}
.roof-field-v4 .rf4-no{position:absolute;left:20px;top:21px;width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(126,208,242,.5);border-radius:50%;color:#7ed0f2;font:700 10px/1 system-ui,sans-serif}
.roof-field-v4 h3{margin:0 0 7px;font:700 17px/1.2 system-ui,sans-serif;letter-spacing:-.01em}
.roof-field-v4 .rf4-card p{margin:0;color:#aabeca;font:400 14px/1.5 system-ui,sans-serif}
.roof-field-v4 .rf4-boundary{grid-column:1/-1;margin-top:18px;padding:18px 20px;border-left:3px solid #7ed0f2;background:rgba(126,208,242,.075);color:#b7cbd5;font:600 12px/1.55 system-ui,sans-serif;letter-spacing:.035em}
.roof-field-v4 .rf4-actions{grid-column:1/-1;display:flex;gap:12px;flex-wrap:wrap;margin-top:5px}
.roof-field-v4 .rf4-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font:700 13px/1 system-ui,sans-serif;text-decoration:none;transition:transform .2s ease,background .2s ease}
.roof-field-v4 .rf4-actions a:hover{transform:translateY(-2px)}
.roof-field-v4 .rf4-primary{background:#7ed0f2;color:#041521}
.roof-field-v4 .rf4-secondary{border:1px solid rgba(126,208,242,.35);color:#dcebf2;background:rgba(126,208,242,.06)}
@media(max-width:900px){.roof-field-v4 .rf4-head,.roof-field-v4 .rf4-layout{grid-template-columns:1fr}.roof-field-v4 .rf4-head{gap:22px}.roof-field-v4 .rf4-list{grid-template-columns:repeat(2,minmax(0,1fr))}.roof-field-v4 .rf4-card:last-child{grid-column:1/-1}}
@media(max-width:620px){.roof-field-v4{padding:68px 0}.roof-field-v4 .rf4-shell{width:min(100% - 24px,1240px)}.roof-field-v4 h2{font-size:clamp(36px,12vw,52px)}.roof-field-v4 .rf4-list{grid-template-columns:1fr}.roof-field-v4 .rf4-card:last-child{grid-column:auto}.roof-field-v4 .rf4-actions a{width:100%}}
@media(prefers-reduced-motion:reduce){.roof-field-v4 .rf4-actions a{transition:none}}