/* The private options-and-prices page (/opciones, D159, 2-nov-2026). On top of style.css: its tokens, nothing new.
   At 390 px the header with three language links (es-AR shows EN, ES, DE) is wider than the screen on every page of
   the site; here (only on these two pages) the links get a smaller gap. */
.opc{max-width:var(--wrap);margin:0 auto;padding:48px var(--m) 72px}
.opc-head{max-width:68ch}
.opc-head h1{font-size:var(--step-h2);line-height:1.08;margin:0 0 18px}
.opc-lead{color:var(--ink2);font-size:var(--step-lead);line-height:1.5;margin:0 0 10px}
.opc-market{margin-top:16px}
.opc-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:36px 0 0}
.opc-card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);padding:24px}
.opc-card.is-main{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.opc-card h2{font-size:var(--step-h3);margin:0}
.opc-price{font-size:1.6rem;font-weight:700;letter-spacing:-.02em;margin:10px 0 6px;color:var(--ink)}
.opc-card-lead{color:var(--ink2);margin:0 0 10px}
.opc-pre{margin:4px 0 0}
.opc-card ul{margin:6px 0 12px;padding-inline-start:1.1em;color:var(--ink2);font-size:var(--step-small)}
.opc-card li{margin:0 0 6px}
.opc-btn{margin-top:auto;padding-top:8px}
.opc-btn .btn{width:100%}
.opc-dep{margin-top:56px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:28px}
.opc-dep h2{font-size:var(--step-h3);margin:0 0 14px}
.opc-dep h3{font-size:1.1rem;margin:22px 0 10px}
.opc-dep ol{margin:0;padding-inline-start:1.3em;color:var(--ink2)}
.opc-dep ol li{margin:0 0 10px}.opc-dep b{color:var(--ink)}
.opc-prof{list-style:none;margin:0;padding:0}
.opc-prof li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 18px;padding:10px 0;border-bottom:1px solid var(--line);color:var(--ink2)}
.opc-prof li b{white-space:nowrap}
.opc-notes{margin-top:28px;max-width:72ch;color:var(--ink2)}
.opc-notes a{color:var(--accent2)}
.opc-form .opts{flex-direction:column;align-items:flex-start}
.opc-form .opc-back{grid-column:1/-1;margin:0}
@media (max-width:520px){.top{gap:12px}.top nav{gap:8px;flex-wrap:wrap;justify-content:flex-end}.opc{padding-top:28px}.opc-card{padding:18px}.opc-dep{padding:20px}}
