:root { color-scheme: light; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #183047; background: #f5f8fa; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.55; }
a { color: #126d9f; }
.seo-header { background: #fff; border-bottom: 1px solid #dce5eb; padding: 1rem max(1rem, calc((100vw - 1100px) / 2)); font-weight: 700; }
.seo-header a { color: #183047; text-decoration: none; }
.seo-wrap { max-width: 1100px; margin: auto; padding: 1.5rem 1rem 4rem; }
.seo-wrap nav { margin-bottom: 1.5rem; }
.seo-product { display: grid; grid-template-columns: minmax(0, 430px) minmax(0, 1fr); gap: 2rem; padding: 1.5rem; background: #fff; border: 1px solid #dce5eb; border-radius: 1.25rem; }
.seo-product img { display: block; width: 100%; height: auto; object-fit: contain; }
.seo-photo-placeholder { display: grid; min-height: 300px; place-items: center; padding: 2rem; border-radius: 1rem; background: #edf3f6; color: #526879; font-weight: 700; text-align: center; }
h1 { font-size: clamp(1.8rem, 3vw, 2.7rem); line-height: 1.2; margin: 0 0 1rem; }
h2 { margin-top: 2rem; }
.seo-price { font-size: 1.8rem; font-weight: 750; margin-bottom: 0; }
.seo-price-row { display: flex; align-items: center; gap: .55rem; }
.seo-price-row .seo-price { margin: 0; }
.seo-currency-control { position: relative; display: flex; align-items: center; }
.seo-currency-toggle { display: grid; width: 2.4rem; height: 2.4rem; place-items: center; border: 1px solid #dce5eb; border-radius: 50%; background: #fff; color: #526879; cursor: pointer; }
.seo-currency-toggle:hover { background: #edf3f6; }
.seo-currency-toggle svg { width: 1.55rem; height: 1.55rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.seo-currency-toggle { position: relative; }
.seo-currency-toggle__symbol { position: absolute; z-index: 1; display: grid; min-width: 14px; height: 14px; place-items: center; padding: 0 2px; border: 1px solid currentColor; border-radius: 7px; background: #fff; color: #526879; font-size: .55rem; font-weight: 750; line-height: 1; }
.seo-currency-toggle__symbol--from { top: 0; left: 0; }
.seo-currency-toggle__symbol--to { right: 0; bottom: 0; }
.seo-currency-picker { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 1.25rem; }
.seo-currency-picker[hidden] { display: none; }
.seo-currency-picker__backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(15, 24, 31, .5); cursor: default; }
.seo-currency-picker__panel { position: relative; z-index: 1; width: min(22rem, 100%); padding: 1.25rem; border: 1px solid #dce5eb; border-radius: 1rem; background: #fff; color: #183047; box-shadow: 0 1.4rem 4rem #10233440; }
.seo-currency-picker__panel h2 { margin: 0 0 .9rem; font-size: 1.15rem; }
.seo-currency-picker__rate-status { margin: -.35rem 0 .9rem; color: #5d6d7b; font-size: .8rem; line-height: 1.45; }
.seo-currency-picker__options { display: grid; gap: .5rem; }
.seo-currency-option { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .1rem .75rem; width: 100%; min-height: 3.4rem; padding: .55rem .75rem; border: 1px solid #dce5eb; border-radius: .7rem; background: #fff; color: #183047; text-align: left; font: inherit; cursor: pointer; }
.seo-currency-option strong { grid-row: 1 / 3; }
.seo-currency-option small { color: #5d6d7b; font-size: .75rem; }
.seo-currency-option::after { content: ""; width: .55rem; height: .55rem; grid-column: 2; grid-row: 1 / 3; border: 1px solid #9aabb8; border-radius: 50%; }
.seo-currency-option.is-selected { border-color: #6787a0; background: #eff5f8; }
.seo-currency-option.is-selected::after { border: 2px solid #367da8; background: #367da8; box-shadow: inset 0 0 0 2px #eff5f8; }
.seo-currency-option:disabled { opacity: .5; cursor: not-allowed; }
.seo-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.seo-stock { color: #176740; font-weight: 700; white-space: nowrap; }
dl { display: grid; grid-template-columns: minmax(110px, 170px) 1fr; gap: .5rem 1rem; }
dt { color: #5d6d7b; }
dd { margin: 0; font-weight: 600; }
.seo-cta { display: inline-block; background: #168ac4; color: white; text-decoration: none; font-weight: 700; padding: .85rem 1.25rem; border-radius: .7rem; }
@media (max-width: 700px) { .seo-product { grid-template-columns: 1fr; padding: 1rem; } .seo-product img { max-height: 350px; } }