.options-overview__hero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(18rem, 0.7fr); align-items: center; gap: clamp(2rem, 6vw, 6rem); min-height: calc(100vh - var(--header-height)); padding-block: clamp(3rem, 8vw, 7rem); }
.options-overview__breadcrumb { display: flex; gap: 0.75rem; margin-bottom: 2rem; color: #d8d3e4; font-size: 0.8rem; }
.options-overview__eyebrow { margin: 0 0 0.8rem; color: var(--color-violet-bright); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.11em; }
.options-overview__hero h1 { max-width: 55rem; margin: 0 0 1.2rem; font-size: clamp(2.7rem, 5vw, 5.5rem); line-height: 1.03; letter-spacing: -0.045em; }
.options-overview__lede { max-width: 49rem; margin: 0 0 1.5rem; color: #e4deeb; font-size: 1.08rem; line-height: 1.7; }
.options-overview__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; }
.options-overview__hero aside { padding: 2rem; border: 1px solid var(--color-line); border-radius: var(--radius-md); background: radial-gradient(circle at 50% 0, rgba(162, 60, 255, 0.2), transparent 15rem), rgba(8, 10, 30, 0.86); box-shadow: var(--shadow-violet); }
.options-overview__hero aside i { margin-bottom: 1.4rem; color: var(--color-violet-bright); font-size: 2.3rem; }
.options-overview__hero aside h2 { margin: 0 0 0.8rem; font-size: 1.45rem; }
.options-overview__hero aside p { margin: 0; color: #d8d3e4; line-height: 1.7; }
.options-overview__section { padding-block: clamp(3rem, 7vw, 6rem); border-block: 1px solid var(--color-line); }
.options-overview__section > header { max-width: 52rem; margin-bottom: 2rem; }
.options-overview__section h2, .options-overview__compare h2, .options-overview__cta h2 { margin: 0 0 1rem; font-size: clamp(2rem, 3vw, 3.2rem); line-height: 1.12; letter-spacing: -0.035em; }
.options-overview__section > header > p:last-child, .options-overview__cta p { color: #d8d3e4; line-height: 1.7; }
.options-overview__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.options-overview__grid article { position: relative; padding: 1.7rem; border: 1px solid var(--color-line); border-radius: var(--radius-md); background: radial-gradient(circle at 90% 0, rgba(162, 60, 255, 0.14), transparent 15rem), rgba(8, 10, 30, 0.72); }
.options-overview__grid article > span { position: absolute; top: 1.4rem; right: 1.4rem; color: rgba(220, 184, 255, 0.52); font-size: 1.1rem; font-weight: 900; }
.options-overview__grid article > i { margin-bottom: 1.3rem; color: var(--color-violet-bright); font-size: 1.8rem; }
.options-overview__grid h3 { max-width: 31rem; margin: 0 0 0.8rem; font-size: 1.35rem; }
.options-overview__grid article > p { margin: 0 0 1.3rem; color: #d8d3e4; line-height: 1.65; }
.options-overview__grid dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem; margin: 0; }
.options-overview__grid dl div { padding: 0.8rem; border: 1px solid rgba(176, 124, 255, 0.15); border-radius: var(--radius-sm); background: rgba(2, 5, 19, 0.42); }
.options-overview__grid dt { color: #aaa4b8; font-size: 0.68rem; font-weight: 850; text-transform: uppercase; }
.options-overview__grid dd { margin: 0.4rem 0 0; color: #e8e2ef; font-size: 0.78rem; line-height: 1.5; }
.options-overview__grid article > a { display: inline-flex; margin-top: 1rem; color: var(--color-focus); font-size: 0.8rem; font-weight: 850; text-decoration: underline; text-underline-offset: 0.2rem; }
.options-overview__compare { display: grid; grid-template-columns: minmax(16rem, 0.7fr) minmax(0, 1.3fr); gap: clamp(2rem, 6vw, 6rem); padding-block: clamp(3rem, 7vw, 6rem); border-bottom: 1px solid var(--color-line); }
.options-overview__compare ol { display: grid; gap: 0; padding: 0; margin: 0; list-style: none; }
.options-overview__compare li { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1rem 0; border-top: 1px solid var(--color-line); }
.options-overview__compare li:last-child { border-bottom: 1px solid var(--color-line); }
.options-overview__compare span { color: var(--color-violet-bright); font-weight: 900; }
.options-overview__compare p { margin: 0; color: #d8d3e4; line-height: 1.55; }
.options-overview__cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2rem; padding-block: clamp(3rem, 7vw, 6rem); }
@media (max-width: 62rem) { .options-overview__hero { grid-template-columns: 1fr; min-height: auto; } }
@media (max-width: 47.5rem) { .options-overview__hero h1 { font-size: clamp(2.35rem, 11vw, 3.1rem); overflow-wrap: anywhere; } .options-overview__grid, .options-overview__compare, .options-overview__cta { grid-template-columns: 1fr; } .options-overview__grid dl { grid-template-columns: 1fr; } }