#gr-home {
  --gr-bg:light-dark(#fff,#202124);
  --gr-ink:light-dark(#202124,#f5f5f5);
  --gr-soft:light-dark(#f3f3f1,#2b2c2d);
  --gr-line:light-dark(#e5e5e2,#454647);
  --gr-muted:light-dark(#62656a,#b9bbbd);
  --gr-accent:#c52932;
  color:var(--gr-ink);
  background:var(--gr-bg);
  font:15px/1.5 Arial,sans-serif;
  border-radius:8px;
  overflow:hidden}
#gr-home * {
  box-sizing:border-box}
#gr-home button,#gr-home input {
  font:inherit}
#gr-home button,#gr-home a {
  touch-action:manipulation}
#gr-home a {
  color:inherit;
  text-decoration:none}
#gr-home .gr-wrap {
  padding:0 40px}
#gr-home .gr-top {
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:9px 40px;
  background:var(--gr-soft);
  color:var(--gr-muted);
  font-size:12px}
#gr-home .gr-head {
  display:flex;
  align-items:center;
  gap:20px;
  padding:23px 40px}
#gr-home .gr-brand {
  font-size:24px;
  font-weight:800;
  letter-spacing:-1px}
#gr-home .gr-brand span {
  color:var(--gr-accent)}
#gr-home .gr-tag {
  font-size:11px;
  letter-spacing:1.3px;
  display:block;
  color:var(--gr-muted);
  font-weight:400}
#gr-home .gr-search {
  flex:1;
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--gr-soft);
  border-radius:5px;
  padding:10px 14px}
#gr-home input {
  min-width:0;
  width:100%;
  border:0;
  background:transparent;
  color:var(--gr-ink);
  outline-offset:4px}
#gr-home .gr-cart {
  border:0;
  background:transparent;
  color:var(--gr-ink);
  display:flex;
  gap:7px;
  align-items:center}
#gr-home .gr-nav {
  display:flex;
  gap:26px;
  padding:14px 40px;
  border-top:1px solid var(--gr-line);
  border-bottom:1px solid var(--gr-line);
  font-size:13px;
  flex-wrap:wrap}
#gr-home .gr-hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#1d2025;
  color:#fff;
  min-height:380px}
#gr-home .gr-hero-copy {
  padding:45px 0 40px 40px;
  z-index:1}
#gr-home .gr-kicker {
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--gr-accent);
  font-weight:700}
#gr-home .gr-hero .gr-kicker {
  color:#ff8d92}
#gr-home h1 {
  font-size:clamp(28px,4.2vw,46px);
  line-height:1.08;
  letter-spacing:-1.7px;
  margin:17px 0 20px;
  font-weight:700}
#gr-home .gr-hero p {
  color:#c7c9cc;
  max-width:350px;
  font-size:14px}
#gr-home .gr-hero-img {
  width:100%;
  height:100%;
  min-height:380px;
  object-fit:cover;
  object-position:44% center}
#gr-home .gr-actions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:25px}
#gr-home .gr-action {
  border:1px solid transparent;
  border-radius:4px;
  background:var(--gr-accent);
  color:#fff;
  padding:12px 17px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-size:13px;
  font-weight:700}
#gr-home .gr-action.gr-alt {
  background:transparent;
  color:inherit;
  border:1px solid #75777b}
#gr-home .gr-section {
  padding:38px 40px}
#gr-home .gr-section-head {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:15px;
  margin-bottom:22px}
#gr-home h2 {
  font-size:26px;
  line-height:1.2;
  letter-spacing:-.7px;
  margin:0}
#gr-home h3 {
  font-size:17px;
  margin:0 0 8px}
#gr-home .gr-link {
  font-size:13px;
  color:var(--gr-accent)}
#gr-home .gr-categories {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px}
#gr-home .gr-cat {
  background:var(--gr-soft);
  border-radius:6px;
  min-height:135px;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden}
#gr-home .gr-cat i {
  width:31px;
  height:31px;
  color:var(--gr-muted);
  margin-bottom:20px}
#gr-home .gr-cat strong {
  font-size:14px;
  font-weight:500;
  z-index:1}
#gr-home .gr-cat span {
  position:absolute;
  right:18px;
  bottom:18px;
  color:var(--gr-muted)}
#gr-home .gr-cat.photo {
  min-height:0;
  padding:0;
  aspect-ratio:2 / 1;
  isolation:isolate;
  color:#fff;
  background:#21242a}
#gr-home .gr-cat.photo::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(9,13,19,.9),rgba(9,13,19,.35) 36%,transparent 70%);
  pointer-events:none}
#gr-home .gr-cat.photo img {
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center}
#gr-home .gr-cat.photo strong {
  position:absolute;
  left:14px;
  right:36px;
  bottom:14px;
  font-weight:600;
  line-height:1.3;
  text-shadow:0 1px 4px rgba(0,0,0,.45)}
#gr-home .gr-cat.photo span {
  color:#fff;
  z-index:1}
#gr-home .gr-about {
  background:var(--gr-soft);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:35px}
#gr-home .gr-about h2 {
  margin:10px 0 17px}
#gr-home .gr-about p {
  color:var(--gr-muted);
  font-size:14px}
#gr-home .gr-building {
  width:100%;
  height:auto;
  display:block;
  background:transparent;
  border-radius:5px}
#gr-home .gr-stats {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:22px}
#gr-home .gr-stats strong {
  font-size:24px;
  display:block;
  letter-spacing:-1px}
#gr-home .gr-stats span {
  font-size:11px;
  color:var(--gr-muted);
  display:block}
#gr-home .gr-factory {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px;
  align-items:center}
#gr-home .gr-factory p {
  color:var(--gr-muted);
  font-size:14px}
#gr-home .gr-factory-pics {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  width:100%;
  max-width:480px;
  justify-self:center;
  gap:12px;
  height:auto}
#gr-home .gr-factory-pics img {
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  border-radius:6px}
#gr-home .gr-opt {
  background:#202328;
  color:#fff;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:35px}
#gr-home .gr-opt h2 {
  margin:10px 0 14px}
#gr-home .gr-opt p {
  font-size:14px;
  color:#c7c9cc}
#gr-home .gr-opt ul {
  padding-left:18px;
  font-size:14px;
  color:#c7c9cc;
  line-height:2}
#gr-home .gr-quality {
  display:flex;
  align-items:center;
  gap:22px;
  border-bottom:1px solid var(--gr-line)}
#gr-home .gr-quality>i {
  width:40px;
  height:40px;
  color:var(--gr-accent);
  flex-shrink:0}
#gr-home .gr-quality p {
  font-size:13px;
  color:var(--gr-muted);
  margin-bottom:0}
#gr-home .gr-quality .gr-link {
  margin-left:auto;
  white-space:nowrap}
#gr-home .gr-contact-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px;
  margin-top:25px}
#gr-home .gr-contact-grid p {
  font-size:14px}
#gr-home .gr-contact-grid small {
  color:var(--gr-muted)}
#gr-home .gr-map-placeholder {
  background:var(--gr-soft);
  border:1px solid var(--gr-line);
  min-height:220px;
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:8px;
  color:var(--gr-muted);
  text-align:center;
  padding:20px}
#gr-home .gr-map-placeholder i {
  color:var(--gr-accent);
  width:32px;
  height:32px}
#gr-home .gr-footer {
  padding:24px 40px;
  background:var(--gr-soft);
  display:flex;
  justify-content:space-between;
  gap:15px;
  font-size:11px;
  color:var(--gr-muted);
  flex-wrap:wrap}
#gr-home [hidden] {
  display:none!important}

@media(max-width:650px) {
  #gr-home .gr-top {
  padding:9px 20px;
  flex-wrap:wrap}
#gr-home .gr-head {
  padding:20px;
  flex-wrap:wrap;
  gap:15px}
#gr-home .gr-brand {
  font-size:22px}
#gr-home .gr-search {
  order:3;
  flex-basis:100%}
#gr-home .gr-cart {
  margin-left:auto}
#gr-home .gr-nav {
  padding:12px 20px;
  gap:12px 20px}
#gr-home .gr-hero {
  grid-template-columns:1fr}
#gr-home .gr-hero-copy {
  padding:30px 20px 10px}
#gr-home h1 {
  font-size:34px;
  letter-spacing:-1px}
#gr-home .gr-hero-img {
  height:230px;
  min-height:0;
  object-position:center}
#gr-home .gr-section {
  padding:30px 20px}
#gr-home .gr-categories {
  grid-template-columns:repeat(2,minmax(0,1fr))}
#gr-home .gr-cat {
  padding:15px;
  min-height:120px}
#gr-home .gr-cat.photo {
  min-height:0;
  padding:0}
#gr-home .gr-cat.photo strong {
  left:10px;
  right:25px;
  bottom:10px;
  font-size:12px}
#gr-home .gr-cat.photo span {
  right:10px;
  bottom:10px}
#gr-home .gr-about,#gr-home .gr-factory,#gr-home .gr-opt,#gr-home .gr-contact-grid {
  grid-template-columns:1fr;
  gap:22px}
#gr-home .gr-quality {
  flex-wrap:wrap;
  gap:15px}
#gr-home .gr-quality .gr-link {
  margin-left:55px}
#gr-home .gr-section-head {
  align-items:flex-start}
#gr-home h2 {
  font-size:23px}
#gr-home .gr-stats strong {
  font-size:22px}
#gr-home .gr-footer {
  padding:22px 20px}
}


/* Approved homepage layout; isolated from the catalogue application styles. */
html { color-scheme: light; scroll-behavior: smooth; }
body { margin: 0; background: #f3f3f1; }
.gr-icon-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.gr-skip { position: absolute; left: 20px; top: -100px; z-index: 10; padding: 12px; background: white; color: #202124; font-family: Arial, sans-serif; }
.gr-skip:focus { top: 10px; }
#gr-home { max-width: 1440px; margin: auto; border-radius: 0; }
#gr-home .gr-icon { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
#gr-home .gr-search { margin: 0; }
#gr-home .gr-search input { padding: 0; height: 28px; }
#gr-home .gr-search button { border: 0; padding: 3px; color: var(--gr-muted); background: transparent; display: grid; place-items: center; cursor: pointer; }
#gr-home .gr-cart { flex-shrink: 0; font-size: 13px; }
#gr-home .gr-count { min-width: 22px; padding: 2px 5px; border-radius: 12px; background: var(--gr-accent); color: white; text-align: center; font-size: 11px; }
#gr-home .gr-cat > .gr-icon { width: 31px; height: 31px; color: var(--gr-muted); margin-bottom: 20px; }
#gr-home .gr-quality > .gr-icon { width: 40px; height: 40px; color: var(--gr-accent); }
#gr-home .gr-quality h2 { font-size: 17px; letter-spacing: 0; }
#gr-home .gr-map-placeholder > .gr-icon { width: 32px; height: 32px; color: var(--gr-accent); }
#gr-home .gr-map-placeholder .gr-action { margin-top: 10px; color: white; }
#gr-home .gr-contact-title { margin-top: 10px; }
#gr-home .gr-category-links { display: flex; gap: 6px 16px; flex-wrap: wrap; font-size: 12px; color: var(--gr-accent); margin-top: 10px; }
#gr-home .gr-category-links a { padding: 4px 0; }
#gr-home .gr-footer > div { display: flex; flex-wrap: wrap; gap: 8px 20px; }
#gr-home .gr-production-detail { background: var(--gr-soft); }
#gr-home .gr-stages { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); padding: 0; gap: 15px; list-style: none; counter-reset: stages; margin: 25px 0; }
#gr-home .gr-stages li { padding: 20px; background: var(--gr-bg); border-radius: 6px; counter-increment: stages; }
#gr-home .gr-stages li::before { content: '0' counter(stages); color: var(--gr-accent); display: block; font-size: 22px; margin-bottom: 18px; }
#gr-home .gr-stages p { color: var(--gr-muted); font-size: 14px; }
#gr-home a:focus-visible, #gr-home button:focus-visible, #gr-home input:focus-visible { outline: 3px solid var(--gr-accent); outline-offset: 4px; }
#gr-home .gr-action:hover { filter: brightness(.92); }
#gr-home .gr-cat:hover { box-shadow: inset 0 0 0 2px var(--gr-accent); }
#gr-home .gr-link:hover, #gr-home .gr-contact-grid a:hover, #gr-home .gr-footer a:hover { text-decoration: underline; }
#gr-home section[id] { scroll-margin-top: 20px; }
@media (max-width: 650px) {
  #gr-home .gr-search input { font-size: 16px; }
  #gr-home .gr-nav a { padding: 5px 0; }
  #gr-home .gr-stats { gap: 8px; }
  #gr-home .gr-map-placeholder .gr-action { font-size: 12px; padding: 12px; }
  #gr-home .gr-quality > div { flex: 1; min-width: 180px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

#gr-home .gr-about { align-items: center; }
#gr-home .gr-catalog-note { margin:24px 0 0; color:var(--gr-muted); font-size:14px; }
#gr-home .gr-catalog-note a.gr-link { color:var(--gr-accent); white-space:normal; }
#gr-home .gr-production-heading h1 { max-width: 1000px; margin-top: 18px; }
#gr-home .gr-production-lead { max-width: 750px; color: var(--gr-muted); margin-bottom: 30px; }
#gr-home .gr-production-intro, #gr-home .gr-production-metal { background: var(--gr-soft); }
#gr-home .gr-production-page p { font-size: 15px; line-height: 1.7; color: var(--gr-muted); }
#gr-home .gr-production-intro p { max-width: 980px; }
#gr-home .gr-workshop { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 40px; align-items: center; border-bottom: 1px solid var(--gr-line); }
#gr-home .gr-workshop-text h2, #gr-home .gr-production-metal h2 { margin-top: 12px; }
#gr-home .gr-gallery { min-width: 0; }
#gr-home .gr-gallery-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; background: var(--gr-soft); border-radius: 8px; }
#gr-home .gr-gallery-track::-webkit-scrollbar { display: none; }
#gr-home .gr-gallery-track:focus-visible { outline: 3px solid var(--gr-accent); outline-offset: 4px; }
#gr-home .gr-gallery-slide { flex: 0 0 100%; min-width: 0; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; aspect-ratio: 4 / 3; }
#gr-home .gr-gallery-slide picture, #gr-home .gr-gallery-slide img { display: block; width: 100%; height: 100%; }
#gr-home .gr-gallery-slide img { object-fit: contain; }
#gr-home .gr-gallery-overview .gr-gallery-slide { aspect-ratio: 3 / 1; }
#gr-home .gr-gallery-toolbar { display: flex; align-items: center; gap: 14px; padding: 12px 0 0; }
#gr-home .gr-gallery-status { display: flex; flex: 1; justify-content: space-between; align-items: center; gap: 14px; min-width: 0; color: var(--gr-muted); font-size: 12px; }
#gr-home .gr-gallery-status output { white-space: nowrap; font-variant-numeric: tabular-nums; }
#gr-home .gr-gallery-arrow { width: 44px; height: 44px; flex-shrink: 0; border: 1px solid var(--gr-line); border-radius: 50%; color: var(--gr-ink); background: var(--gr-bg); font-size: 22px; cursor: pointer; }
#gr-home .gr-gallery-arrow:hover { color: var(--gr-accent); border-color: var(--gr-accent); }
#gr-home .gr-gallery-dots { display: flex; justify-content: center; flex-wrap: wrap; gap: 0; margin-top: 4px; }
#gr-home .gr-gallery-dots button { display: grid; place-items: center; width: 36px; height: 44px; border: 0; background: transparent; padding: 0; cursor: pointer; }
#gr-home .gr-gallery-dots button span { position: static; width: 7px; height: 7px; border-radius: 10px; background: #c7c7c7; }
#gr-home .gr-gallery-dots button[aria-current] span { width: 20px; background: var(--gr-accent); }
#gr-home .gr-gallery-thumbnails { gap: 10px; margin-top: 15px; }
#gr-home .gr-gallery-thumbnails button { height: 100px; width: 60px; border: 2px solid transparent; border-radius: 5px; overflow: hidden; opacity: .6; }
#gr-home .gr-gallery-thumbnails button[aria-current] { opacity: 1; border-color: var(--gr-accent); }
#gr-home .gr-gallery-thumbnails img { width: 100%; height: 100%; object-fit: cover; }
#gr-home .gr-production-cta { background: var(--gr-soft); }
@media (max-width: 800px) {
  #gr-home .gr-workshop { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}
@media (max-width: 650px) {
  #gr-home .gr-production-heading h1 { font-size: 30px; line-height: 1.15; }
  #gr-home .gr-gallery-overview .gr-gallery-slide { aspect-ratio: 9 / 16; }
  #gr-home .gr-gallery-thumbnails button { width: 48px; height: 80px; }
  #gr-home .gr-gallery-status { flex-direction: column; align-items: flex-start; gap: 3px; }
  #gr-home .gr-gallery-dots button { width: 40px; }
}