@import url('../fonts.css');
*{box-sizing:border-box}body{margin:0;background:#111;color:#fff;font:16px/1.55 Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}.wrap{width:min(1200px,calc(100% - 48px));margin-inline:auto}header{position:sticky;top:0;background:#111;z-index:3;border-bottom:1px solid #333}.bar,.tools,nav,.rail{display:flex;align-items:center}.bar{height:76px;justify-content:space-between;gap:12px}.logo{width:138px;display:block}.tools,.bar>nav{gap:18px}button{font:inherit;cursor:pointer}.order{background:#f17b26;color:#111;padding:10px 20px;border-radius:24px;font-weight:700}.hero{background:linear-gradient(90deg,#111f,#111c),url(background.png) center/cover}.hero .wrap{padding-block:54px;max-width:1200px}.hero small,.plate span,.plate b{color:#ff943e;font-weight:700}.hero small,.plate span{letter-spacing:.09em}.hero h1{font-size:clamp(34px,4.2vw,58px);line-height:1.08;margin:12px 0 18px;letter-spacing:-.045em}.hero .intro-copy,.hero p{max-width:68ch;color:#ddd;margin:0}.intro-copy a{text-decoration:underline;text-underline-offset:3px}.filters{position:sticky;top:76px;z-index:2;background:#111f;border-block:1px solid #333}.rail{gap:10px;overflow:auto;padding:12px 0;scrollbar-width:thin;scrollbar-color:#555 transparent}.rail button{flex:none;min-height:44px;background:#292929;color:#eee;border:0;border-radius:99px;padding:6px 20px;font-weight:600}.rail button[aria-pressed=true]{background:#f17b26;color:#111}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-block:44px;align-items:start}article{overflow:hidden;background:#202020;border:1px solid #353535;border-radius:22px;scroll-margin-top:160px}article[hidden]{display:none}.plate{display:block;position:relative;background:#000;height:192px}.plate img{width:100%;height:100%;object-fit:contain}.plate span,.plate b{position:absolute;top:12px;text-shadow:0 1px 5px #000,0 0 8px #000}.plate span{left:14px;text-transform:uppercase;font-size:12px}.plate b{right:14px}.caption{position:relative;padding:14px 16px}.caption h2{font-size:17px;line-height:1.4;margin:0;padding-right:0}.caption p{margin:6px 0 0;color:#b4b0a6;font-size:14px}footer{padding:30px 0;border-top:1px solid #333;color:#aaa}:focus-visible{outline:3px solid #ffab62;outline-offset:-3px}@media(max-width:1199px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.wrap{width:calc(100% - 32px)}.bar{height:auto;min-height:90px;flex-wrap:wrap;padding:6px 0;gap:0}.logo{width:96px}.tools{gap:5px}.order{font-size:13px;padding:10px}.bar>nav{order:3;width:100%;justify-content:center;gap:24px;font-size:14px}.bar>nav a{padding:5px}.filters{top:90px}.hero .wrap{padding-block:32px}.grid{grid-template-columns:1fr;gap:16px;padding-block:22px}}

/* The Finnish site's lighter Manrope headings and centered navigation. */
body { font-family: 'Manrope', system-ui, sans-serif; }
.hero h1 { font-weight: 500; letter-spacing: -.035em; }
.caption h2, .rail button, .order, .plate b { font-weight: 600; }
.bar > nav { font-weight: 500; }
.tools { gap: clamp(12px, 2vw, 26px); }
.languages {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0;
}
.languages a {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  color: #aaa69e;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .075em;
  border-radius: 4px;
}
.languages a:hover, .languages a[aria-current] { color: #f3f0e9; }
.languages a[aria-current] { font-weight: 700; }
.languages a[aria-current]::after {
  content: '';
  position: absolute;
  bottom: 5px;
  width: 15px;
  height: 2px;
  background: #f17b26;
}
.languages a:focus-visible { outline: 2px solid #ffab62; outline-offset: -3px; }
@media (min-width: 701px) {
  .bar { display: grid; grid-template-columns: 1fr auto 1fr; }
  .tools { justify-self: end; }
}
@media (max-width: 700px) {
  .bar { display: grid; grid-template-columns: auto 1fr; }
  .tools { justify-self: end; gap: 8px; }
  .logo { width: clamp(76px, 22vw, 105px); }
  .bar > nav { grid-column: 1 / -1; }
  .order { white-space: nowrap; }
}
@media (max-width: 359px) {
  .bar.wrap { width: calc(100% - 16px); }
  .bar .logo { width: 68px; }
  .tools { gap: 3px; }
  .order { padding-inline: 8px; }
}

/* Shared homepage palette and quieter product captions. */
body { background: #000; color: #f3f0e9; }
header, .filters { background: #10100f; border-color: #30302d; }
.order, .rail button[aria-pressed=true] { background: #f3f0e9; color: #151513; }
.order { display: inline-flex; align-items: center; min-height: 44px; }
.order:hover { background: #ffab62; }
.hero { background: #000; }
.hero .wrap { padding-block: clamp(32px, 5vw, 72px); }
.hero small { display: none; }
.hero h1 { margin: 0 0 16px; }
.hero .intro-copy, .hero p { color: #bcb9b1; max-width: 63ch; }
.intro-copy a { text-decoration-color: #68665f; }
.rail { gap: 6px; padding-block: 8px; }
.rail button { color: #d4d0c8; background: transparent; padding-inline: 16px; }
.rail button:hover:not([aria-pressed=true]) { background: #282825; }
.grid { gap: clamp(24px, 3vw, 40px); }
article { border: 0; border-bottom: 1px solid #33322f; border-radius: 0; background: #000; }
.plate { height: clamp(190px, 19vw, 250px); }
.caption { padding: 14px 0 20px; }
.product-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 6px; }
.product-meta span { color: #b4b0a6; font-size: 12px; letter-spacing: .04em; }
.product-meta b { font-size: 15px; font-weight: 600; white-space: nowrap; }

@media (max-width: 700px) {
  .hero .wrap { text-align: center; }
  .hero p { margin-inline: auto; font-size: 15px; }
  .grid { gap: 20px; }
  .plate { height: clamp(180px, 54vw, 280px); }
}
#products { scroll-margin-top: 146px; }
@media (max-width:700px) {
  #products { scroll-margin-top: 162px; }
}
@media (max-width: 359px) {
  .bar > nav { gap: 8px; }
}