:root { color-scheme:light; --blue:#4d63cf; --ink:#172033; --muted:#4f596c; --line:#dfe3eb; --background:#fff; --sky:#edf6ff; --paper:#fffaf0; --trail:#f0f7e9; }
:root[data-theme="dark"] { color-scheme:dark; --blue:#aab7ff; --ink:#edf1fa; --muted:#b6bece; --line:#394152; --background:#141821; --sky:#1d2b38; --paper:#302a21; --trail:#202c20; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--background); color:var(--ink); font:16px/1.45 Arial,Helvetica,sans-serif; display:flex; flex-direction:column; transition:background-color .15s ease,color .15s ease; }
.site-header { width:100%; max-width:1120px; margin:0 auto; padding:46px 24px 30px; }
.site-header img { display:block; width:213px; height:40px; }
.brand-block { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.tagline { color:var(--muted); font-size:13px; }
.theme-toggle { position:fixed; top:20px; right:20px; z-index:10; width:42px; height:42px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:var(--background); color:var(--ink); padding:0; font:24px/1 Arial,Helvetica,sans-serif; cursor:pointer; box-shadow:0 2px 10px rgba(0,0,0,.08); transition:background-color .15s ease,color .15s ease,border-color .15s ease; }
.theme-toggle:hover,.theme-toggle:focus-visible { border-color:var(--blue); outline:2px solid transparent; }
.theme-toggle span { grid-area:1/1; }
.moon-icon,:root[data-theme="dark"] .sun-icon { display:none; }
:root[data-theme="dark"] .moon-icon { display:block; }
main { width:100%; max-width:1120px; margin:0 auto; padding:18px 24px 56px; flex:1; }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.product-card { min-height:340px; padding:30px; border:1px solid var(--line); border-radius:12px; color:var(--ink); text-decoration:none; display:flex; flex-direction:column; justify-content:space-between; transition:border-color .15s ease,transform .15s ease; }
.product-card:hover,.product-card:focus-visible { border-color:var(--blue); transform:translateY(-2px); outline:none; }
.meteo { background:var(--sky); }.stories { background:var(--paper); }.mudtracks { background:var(--trail); }
.tile-logo { height:104px; display:flex; align-items:center; }
.tile-logo img { display:block; max-width:220px; max-height:90px; object-fit:contain; object-position:left center; }
.tile-logo.lamp img { width:76px; height:auto; }
.mudtracks-logo { color:#31422b; font-size:30px; font-weight:normal; letter-spacing:-1.5px; }
.mudtracks-logo span { font-weight:normal; }.mudtracks-logo b { font-weight:bold; }
.product-card h1 { margin:0 0 10px; font-size:28px; line-height:1.1; }
.product-card p { margin:0; max-width:28ch; color:var(--muted); }
.product-detail { max-width:680px; padding:42px 0; }
.back { display:inline-block; margin-bottom:54px; color:var(--muted); text-decoration:none; }
.back:hover { text-decoration:underline; }
.product-detail h1 { margin:0 0 18px; font-size:48px; }
.product-detail .lead { margin:0 0 30px; color:var(--muted); font-size:21px; }
.product-detail .body { margin-bottom:36px; }
.cta { display:inline-block; padding:12px 18px; border-radius:7px; background:var(--blue); color:#fff; font-weight:bold; text-decoration:none; }
.cta:hover { background:#394caf; }
.product-status { display:inline-block; color:var(--muted); font-weight:bold; }
footer { width:calc(100% - 48px); max-width:1072px; margin:0 auto; padding:22px 0 38px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; }
footer a { color:inherit; }
@media(max-width:760px){.site-header{padding-top:30px;padding-right:78px}.theme-toggle{top:16px;right:16px}.tagline{font-size:12px}.product-grid{grid-template-columns:1fr}.product-card{min-height:220px}.product-detail h1{font-size:38px}}
@media(prefers-reduced-motion:reduce){.product-card{transition:none}}