
:root{
  --ink:#20323c;
  --ink-2:#385363;
  --paper:#f5f3ee;
  --white:#fff;
  --line:rgba(32,50,60,.16);
  --muted:#6d777b;
  --max:1440px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.topbar{
  position:sticky;top:0;z-index:50;height:84px;padding:0 34px;
  display:grid;grid-template-columns:190px 1fr auto;align-items:center;gap:28px;
  background:rgba(245,243,238,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)
}
.brand img{width:134px;height:auto}
.mainnav{display:flex;justify-content:center;gap:28px;font-size:13px;letter-spacing:.04em}
.mainnav a{opacity:.72}.mainnav a:hover{opacity:1}
.catalogue-btn,.primary-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;
  background:var(--ink);color:#fff;border:1px solid var(--ink);font-size:13px;letter-spacing:.05em;
  transition:.2s ease
}
.catalogue-btn:hover,.primary-btn:hover{background:transparent;color:var(--ink)}
.menu-btn{display:none;background:none;border:0;font-size:26px;color:var(--ink)}
.hero{
  min-height:calc(100vh - 84px);display:grid;grid-template-columns:.95fr 1.05fr;max-width:var(--max);margin:auto;
  border-left:1px solid var(--line);border-right:1px solid var(--line)
}
.hero-copy{padding:110px 7vw 80px 6vw;display:flex;flex-direction:column;justify-content:center}
.eyebrow,.section-kicker{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700}
.hero h1{font-size:clamp(58px,7.2vw,112px);line-height:.88;letter-spacing:-.055em;margin:18px 0 28px;font-weight:500}
.lede{font-size:18px;line-height:1.65;max-width:620px;color:#536267}
.hero-actions{display:flex;align-items:center;gap:24px;margin-top:26px}
.text-link{font-size:13px;border-bottom:1px solid currentColor;padding-bottom:4px}
.hero-visual{background:#fff;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.hero-visual img{width:100%;height:100%;object-fit:contain;object-position:center bottom;padding:34px 30px 0}
.intro,.guarantee{max-width:var(--max);margin:auto;padding:100px 6vw;display:grid;grid-template-columns:1.15fr .85fr;gap:8vw;border:1px solid var(--line);border-top:0}
.intro h2,.section-head h2,.technical h2,.guarantee h2{font-size:clamp(38px,5vw,70px);line-height:1;letter-spacing:-.04em;margin:14px 0 0;font-weight:500}
.intro>p,.section-head.split>p,.guarantee>p{font-size:17px;line-height:1.7;color:#657176;align-self:end}
.collections,.swatch-section,.knobs{max-width:var(--max);margin:auto;padding:110px 34px}
.section-head{margin-bottom:46px}
.collection-card{display:grid;grid-template-columns:1.15fr .85fr;border:1px solid var(--line);background:#fff;min-height:540px}
.collection-card.large{min-height:680px;margin-bottom:28px}
.collection-image{display:flex;align-items:center;justify-content:center;background:#fff;overflow:hidden}
.collection-image img{width:100%;height:100%;object-fit:contain;padding:30px}
.collection-copy{padding:48px;display:flex;flex-direction:column;justify-content:flex-end;background:#e9ecec}
.collection-copy span{font-size:11px;opacity:.5;margin-bottom:auto}
.collection-copy h3{font-size:52px;letter-spacing:-.04em;margin:0 0 10px;font-weight:500}
.collection-copy p{max-width:380px;line-height:1.55;color:#58666c}
.collection-copy a{margin-top:24px;font-size:13px;text-decoration:underline;text-underline-offset:5px}
.collection-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.collection-grid .collection-card{grid-template-columns:1fr;min-height:0}
.collection-grid .collection-image{height:470px}
.collection-grid .collection-copy{min-height:260px}
.section-head.split{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:end}
.swatch-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.swatch-card{background:#fff;border:1px solid var(--line);padding:12px;min-height:180px;display:flex;flex-direction:column}
.swatch-card img{width:100%;height:118px;object-fit:cover}
.swatch-meta{display:flex;gap:9px;align-items:baseline;margin-top:12px}
.swatch-code{font-size:12px;font-weight:700}.swatch-name{font-size:13px;color:#5d676c}
.finish-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.finish-card{background:#0f1112;color:white;border:1px solid #232729;padding:14px}
.finish-card img{width:100%;height:120px;object-fit:cover}
.finish-card h3{font-size:15px;margin:13px 0 3px;font-weight:500}.finish-card p{margin:0;opacity:.6;font-size:12px}
.finishes-section{background:#171a1b;color:#eef1f2;max-width:none;padding-left:max(34px,calc((100vw - var(--max))/2 + 34px));padding-right:max(34px,calc((100vw - var(--max))/2 + 34px))}
.finishes-section .section-head.split>p{color:#b5bdc1}
.knob-row{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#fff}
.knob{min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid var(--line)}
.knob:last-child{border-right:0}.knob h3{font-size:14px;font-weight:500;margin:18px 0 0}
.cross-icon,.flower-icon{font-size:80px;color:#999;line-height:1}
.pin-icon{width:16px;height:86px;background:#999;border-radius:8px;position:relative}.pin-icon:before{content:"";position:absolute;width:54px;height:54px;border-radius:50%;background:#999;top:-10px;left:50%;transform:translateX(-50%)}
.drop-icon{width:28px;height:78px;border-radius:14px 14px 20px 20px;background:#999;position:relative}.drop-icon:before{content:"";position:absolute;top:-16px;left:50%;width:44px;height:44px;border-radius:50%;background:#999;transform:translateX(-50%)}
.technical{background:var(--ink);color:#fff;display:grid;grid-template-columns:1fr 1fr;max-width:var(--max);margin:90px auto 0}
.technical-copy{padding:90px 7vw}
.technical-copy p:not(.section-kicker){line-height:1.7;color:#c4ced2;font-size:17px;max-width:560px}
.primary-btn.light{background:white;color:var(--ink);border-color:white;margin-top:18px}
.primary-btn.light:hover{background:transparent;color:white}
.technical-list{padding:55px;border-left:1px solid rgba(255,255,255,.15);display:flex;flex-direction:column;justify-content:center}
.technical-list>div{display:grid;grid-template-columns:55px 1fr;gap:20px;padding:26px 0;border-bottom:1px solid rgba(255,255,255,.15)}
.technical-list>div:last-child{border-bottom:0}.technical-list span{opacity:.45}.technical-list p{margin:0;line-height:1.6;color:#d4dcdf}
footer{background:#e5e8e8;display:grid;grid-template-columns:2fr repeat(3,1fr);gap:40px;padding:70px max(34px,calc((100vw - var(--max))/2 + 34px));border-top:1px solid var(--line)}
.footer-brand img{width:130px}.footer-brand p{font-size:10px;letter-spacing:.2em}
footer h4{font-size:11px;text-transform:uppercase;letter-spacing:.14em;margin:0 0 16px}
footer p,footer a{font-size:14px;line-height:1.7;color:#58656a}
@media(max-width:1000px){
  .topbar{grid-template-columns:1fr auto auto}.mainnav{display:none}.menu-btn{display:block}
  .mainnav.open{position:absolute;display:flex;flex-direction:column;top:84px;left:0;right:0;background:var(--paper);padding:28px 34px;border-bottom:1px solid var(--line)}
  .hero{grid-template-columns:1fr}.hero-copy{padding:80px 34px}.hero-visual{min-height:560px}
  .intro,.guarantee,.section-head.split{grid-template-columns:1fr;gap:34px}
  .collection-grid{grid-template-columns:1fr}
  .swatch-grid{grid-template-columns:repeat(3,1fr)}.finish-grid{grid-template-columns:repeat(3,1fr)}
  .technical{grid-template-columns:1fr}.technical-list{border-left:0;border-top:1px solid rgba(255,255,255,.15)}
  footer{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .topbar{height:72px;padding:0 18px;grid-template-columns:1fr auto}.catalogue-btn{display:none}.menu-btn{display:block}
  .mainnav.open{top:72px}
  .hero{min-height:auto}.hero-copy{padding:64px 20px}.hero h1{font-size:58px}.hero-visual{min-height:420px}
  .intro,.guarantee{padding:70px 20px}
  .collections,.swatch-section,.knobs{padding:80px 18px}
  .collection-card,.collection-card.large{grid-template-columns:1fr;min-height:0}.collection-image,.collection-grid .collection-image{height:380px}
  .collection-copy{padding:28px;min-height:240px}.collection-copy h3{font-size:42px}
  .swatch-grid{grid-template-columns:repeat(2,1fr)}.finish-grid{grid-template-columns:1fr 1fr}
  .knob-row{grid-template-columns:1fr 1fr}.knob:nth-child(2){border-right:0}.knob:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .technical{margin-top:40px}.technical-copy{padding:70px 24px}.technical-list{padding:24px}
  footer{grid-template-columns:1fr;padding:55px 22px}
}


/* ===== CROMO requested corrections ===== */
.brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
.brand img{width:134px;height:auto}
.brand span{
  font-size:8px;
  line-height:1;
  letter-spacing:.18em;
  font-weight:700;
  color:var(--ink);
  white-space:nowrap;
}
.catalogue-btn{
  background:#9b761b !important;
  border-color:#9b761b !important;
  color:#fff !important;
  font-weight:700;
}
.catalogue-btn:hover{
  background:#7f6015 !important;
  border-color:#7f6015 !important;
  color:#fff !important;
}

.hero.hero-clean{
  display:block;
  min-height:76vh;
  max-width:var(--max);
  margin:auto;
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
}
.hero.hero-clean .hero-copy{
  min-height:76vh;
  max-width:1180px;
  padding:116px 6vw 100px;
}
.catalogue-hero-btn{
  min-height:74px;
  padding:0 42px;
  font-size:18px;
  letter-spacing:.085em;
  font-weight:700;
}
.collection-copy > span{display:none !important;}

.accessories-visual{background:#e8ebeb}
.accessory-symbols{
  width:min(350px,65%);
  aspect-ratio:1/1;
  position:relative;
}
.acc-ring{
  position:absolute;
  width:42%;
  height:42%;
  border:18px solid #7d8588;
  border-radius:50%;
  left:6%;
  top:10%;
}
.acc-bar{
  position:absolute;
  width:68%;
  height:18px;
  background:#7d8588;
  right:4%;
  top:58%;
  border-radius:999px;
}
.acc-hook{
  position:absolute;
  width:34%;
  height:50%;
  right:10%;
  top:20%;
  border-right:18px solid #7d8588;
  border-bottom:18px solid #7d8588;
  border-radius:0 0 70px 0;
}

/* Exact knob artwork */
.exact-knobs .knob{
  padding:36px;
  min-height:270px;
}
.exact-knobs .knob img{
  width:auto;
  height:128px;
  max-width:82%;
  object-fit:contain;
}
.exact-knobs .knob h3{display:none}

/* Swatches */
.swatch-grid{gap:24px}
.swatch-card{padding:14px}
.swatch-card img{
  border:1px solid rgba(32,50,60,.12);
  background:#fff;
}
.swatch-card img[src$="colour-201.png"]{
  border:1px solid rgba(32,50,60,.22);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.95),
    0 7px 18px rgba(32,50,60,.06);
}

/* Plating finishes separated clearly */
.finish-grid{
  grid-template-columns:repeat(5,1fr);
  gap:30px;
}
.finish-card{
  background:#101314;
  border:1px solid rgba(255,255,255,.24);
  padding:14px;
}
.finish-card img{
  width:100%;
  height:150px;
  object-fit:cover;
  display:block;
  border:1px solid rgba(255,255,255,.22);
}
.finish-card h3{margin:14px 0 4px;padding:0}
.finish-card p{margin:0;padding:0}
.finish-card img[src$="finish-802.png"]{
  background:#bfc2c4;
}

.footer-brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.footer-brand p{
  margin:0;
  font-size:9px;
  letter-spacing:.18em;
  font-weight:700;
}

@media(max-width:1000px){
  .finish-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:650px){
  .hero.hero-clean,
  .hero.hero-clean .hero-copy{min-height:auto}
  .hero.hero-clean .hero-copy{padding:70px 20px 62px}
  .catalogue-hero-btn{width:100%;min-height:64px;font-size:16px}
  .finish-grid{grid-template-columns:1fr 1fr}
  .exact-knobs .knob{min-height:210px;padding:24px}
  .exact-knobs .knob img{height:94px}
}


/* ===== Latest visual update ===== */
.hero.hero-top-image{
  min-height:calc(100vh - 84px);
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  max-width:var(--max);
  margin:auto;
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
}
.hero.hero-top-image .hero-copy{
  padding:110px 7vw 80px 6vw;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero-up{
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.hero-up img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:28px;
}

/* All collection frames same dimensions */
.collection-card,
.collection-card.large{
  min-height:0;
}
.collections > .collection-card,
.collection-grid .collection-card,
.accessories-card{
  display:grid;
  grid-template-columns:1fr;
  min-height:0;
}
.collections > .collection-card .collection-image,
.collection-grid .collection-image,
.accessories-card .collection-image{
  height:470px;
}
.collections > .collection-card .collection-copy,
.collection-grid .collection-copy,
.accessories-card .collection-copy{
  min-height:260px;
}
.collection-card.large{
  margin-bottom:28px;
}
.collections-separator{
  width:100%;
  height:1px;
  background:var(--line);
  margin:54px 0;
}

/* Accessories uses uploaded photo */
.accessories-card .collection-image{
  background:#fff;
}
.accessories-card .collection-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:28px;
}

/* Balance knob option sizes */
.exact-knobs .knob:nth-child(1) img,
.exact-knobs .knob:nth-child(4) img{
  height:96px;
}
.exact-knobs .knob:nth-child(2) img,
.exact-knobs .knob:nth-child(3) img{
  height:118px;
}

/* Technical area: wider, less cramped text columns */
.technical{
  grid-template-columns:1.12fr .88fr;
}
.technical-copy{
  padding:90px 6vw;
}
.technical-copy p:not(.section-kicker){
  max-width:720px;
}
.technical-list{
  padding:50px 46px;
}
.technical-list > div{
  grid-template-columns:46px minmax(0,1fr);
  gap:18px;
}
.technical-list p{
  max-width:none;
}

/* Make replacement swatches display cleanly */
.swatch-card img[src$="colour-201.png"]{
  object-fit:cover;
  background:#fff;
}
.finish-card img[src$="finish-802.png"]{
  object-fit:cover;
  background:#c9cccf;
}

/* Remove older synthetic accessory shapes */
.accessories-visual,
.accessory-symbols,
.acc-ring,
.acc-bar,
.acc-hook{
  display:none !important;
}

@media(max-width:1000px){
  .hero.hero-top-image{
    grid-template-columns:1fr;
  }
  .hero-up{
    min-height:520px;
  }
  .technical{
    grid-template-columns:1fr;
  }
}
@media(max-width:650px){
  .hero.hero-top-image{
    min-height:auto;
  }
  .hero.hero-top-image .hero-copy{
    padding:68px 20px 56px;
  }
  .hero-up{
    min-height:400px;
  }
  .collections > .collection-card .collection-image,
  .collection-grid .collection-image,
  .accessories-card .collection-image{
    height:360px;
  }
}


/* ===== Requested cleanup update ===== */

/* Remove unrequested vertical side lines */
.hero.hero-top-image,
.hero.hero-clean,
.intro,
.guarantee{
  border-left:0 !important;
  border-right:0 !important;
}

/* First image at top: no white panel */
.hero-up,
.hero-visual{
  background:transparent !important;
}
.hero-up img{
  background:transparent !important;
  padding:0 !important;
  object-fit:contain;
}

/* All collection cards, including Tereza and Accessories, use exactly the same frame */
.collection-grid-all,
.collection-grid,
.accessories-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}
.collection-grid-all .collection-card,
.collection-grid .collection-card,
.accessories-grid .collection-card{
  display:grid;
  grid-template-columns:1fr;
  min-height:0;
}
.collection-grid-all .collection-image,
.collection-grid .collection-image,
.accessories-grid .collection-image{
  height:470px;
  background:#fff;
}
.collection-grid-all .collection-copy,
.collection-grid .collection-copy,
.accessories-grid .collection-copy{
  min-height:260px;
}
.collection-grid-all .collection-image img,
.collection-grid .collection-image img,
.accessories-grid .collection-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:30px;
}
.collections-separator{
  margin:54px 0;
}

/* Accessories stays same frame proportions as collections */
.accessories-grid{
  grid-template-columns:1fr 1fr;
}
.accessories-grid .collection-card{
  grid-column:1 / 2;
}

/* Make knobs a little smaller again */
.exact-knobs .knob:nth-child(1) img,
.exact-knobs .knob:nth-child(4) img{
  height:78px !important;
}
.exact-knobs .knob:nth-child(2) img,
.exact-knobs .knob:nth-child(3) img{
  height:104px !important;
}

/* Technical / Customisation: fix right column layout */
.technical{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  align-items:stretch;
}
.technical-copy{
  padding:86px 64px;
}
.technical-list{
  padding:44px 54px;
  border-left:1px solid rgba(255,255,255,.15);
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}
.technical-list > div{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:20px;
  align-items:start;
  padding:28px 0;
}
.technical-list span{
  line-height:1.6;
}
.technical-list p{
  margin:0;
  line-height:1.65;
  max-width:none !important;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
}
.technical-list strong{
  display:inline;
}

/* Prevent inherited narrow text widths in right technical column */
.technical-list p,
.technical-list div,
.technical-list strong{
  width:auto;
}

@media(max-width:1000px){
  .collection-grid-all,
  .collection-grid,
  .accessories-grid{
    grid-template-columns:1fr;
  }
  .accessories-grid .collection-card{
    grid-column:auto;
  }
  .technical{
    grid-template-columns:1fr;
  }
  .technical-list{
    border-left:0;
    border-top:1px solid rgba(255,255,255,.15);
  }
}
@media(max-width:650px){
  .collection-grid-all .collection-image,
  .collection-grid .collection-image,
  .accessories-grid .collection-image{
    height:360px;
  }
  .technical-copy{
    padding:66px 24px;
  }
  .technical-list{
    padding:28px 24px;
  }
}


/* ===== Latest spacing + sticky-header refinement ===== */

/* Technical / Customisation: give the right copy column much more width */
.technical{
  grid-template-columns:minmax(0,.9fr) minmax(560px,1.1fr) !important;
}
.technical-list{
  padding:46px 64px !important;
  min-width:560px;
}
.technical-list > div{
  grid-template-columns:34px minmax(0,1fr) !important;
  gap:22px !important;
}
.technical-list p{
  width:100% !important;
  max-width:none !important;
  line-height:1.55 !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}
.technical-list strong{
  display:block;
  margin-bottom:2px;
}

/* Move the first/hero image higher inside its panel */
.hero-up{
  align-items:flex-start !important;
  justify-content:center;
}
.hero-up img{
  object-position:center top !important;
  transform:translateY(-22px);
}

/* Soft shadow on the menu bar only after scrolling */
.topbar{
  transition:box-shadow .28s ease, background-color .28s ease;
}
.topbar.is-scrolled{
  box-shadow:0 10px 28px rgba(27,38,44,.10);
}

/* Responsive fallback so technical text never collapses into a narrow word column */
@media(max-width:1180px){
  .technical{
    grid-template-columns:1fr !important;
  }
  .technical-list{
    min-width:0 !important;
    border-left:0 !important;
    border-top:1px solid rgba(255,255,255,.15) !important;
  }
}
@media(max-width:650px){
  .hero-up img{
    transform:translateY(-10px);
  }
  .technical-list{
    padding:28px 24px !important;
  }
}


/* ===== Swatch frame removal ===== */

/* COLOUR FINISHES — no outer card/frame */
.swatch-card{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  min-height:0;
}

/* PLATING FINISHES — no outer card/frame */
.finish-card{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
}

/* Keep the actual material/colour samples clean, without card outlines */
.swatch-card img,
.finish-card img{
  border:0 !important;
  box-shadow:none !important;
}


/* ===== Knob separators only ===== */
.knob-row{
  border:0 !important;
  background:transparent !important;
}
.knob{
  border:0 !important;
  border-right:1px solid var(--line) !important;
  background:transparent !important;
}
.knob:last-child{
  border-right:0 !important;
}

@media(max-width:650px){
  .knob:nth-child(2){
    border-right:0 !important;
  }
  .knob:nth-child(-n+2){
    border-bottom:1px solid var(--line) !important;
  }
}


/* ===== Header alignment + hero tone + technical redesign ===== */

/* Align header contents with the same page grid as the sections below */
.topbar{
  padding-left:max(34px, calc((100vw - var(--max))/2 + 34px)) !important;
  padding-right:max(34px, calc((100vw - var(--max))/2 + 34px)) !important;
}
.brand span,
.footer-brand p{
  letter-spacing:.16em;
}

/* Softer background behind the top product image */
.hero-up,
.hero-visual{
  background:#ecebe6 !important;
}
.hero-up img{
  mix-blend-mode:multiply;
}

/* Completely redesigned Technical / Customisation section */
.technical-redesign{
  max-width:var(--max);
  margin:90px auto 0;
  background:var(--ink);
  color:#fff;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  align-items:stretch;
}
.technical-heading{
  padding:88px 72px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.technical-heading h2{
  font-size:clamp(48px,5vw,76px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:500;
  margin:14px 0 28px;
}
.technical-intro{
  max-width:620px;
  margin:0;
  color:#c5cfd3;
  font-size:17px;
  line-height:1.7;
}
.technical-heading .primary-btn{
  align-self:flex-start;
  margin-top:30px;
}
.technical-measures{
  min-width:0;
  padding:58px 64px;
  border-left:1px solid rgba(255,255,255,.16);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.technical-measures article{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:22px;
  padding:30px 0;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.technical-measures article:last-child{
  border-bottom:0;
}
.technical-measures span{
  color:#8fa0a8;
  font-size:12px;
  padding-top:5px;
}
.technical-measures h3{
  margin:0 0 8px;
  font-size:20px;
  font-weight:500;
}
.technical-measures p{
  margin:0;
  max-width:520px;
  color:#cbd3d6;
  font-size:16px;
  line-height:1.6;
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
}

/* Neutralize older technical rules */
.technical-redesign .technical-list,
.technical-redesign .technical-copy{
  min-width:0 !important;
}

@media(max-width:1000px){
  .technical-redesign{
    grid-template-columns:1fr !important;
  }
  .technical-heading{
    padding:72px 38px;
  }
  .technical-measures{
    min-width:0 !important;
    padding:38px;
    border-left:0;
    border-top:1px solid rgba(255,255,255,.16);
  }
}
@media(max-width:650px){
  .topbar{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  .technical-heading,
  .technical-measures{
    padding:54px 24px;
  }
}


/* ===== V8 unified alignment + technical redesign ===== */
:root{
  --page-gutter:max(34px, calc((100vw - var(--max))/2 + 34px));
}

/* Header logo/button aligned with page content below */
.topbar{
  padding-left:var(--page-gutter) !important;
  padding-right:var(--page-gutter) !important;
}

/* Main hero uses the same left/right content alignment */
.hero.hero-top-image{
  max-width:none !important;
  width:100%;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  border:0 !important;
}
.hero.hero-top-image .hero-copy{
  padding-left:var(--page-gutter) !important;
  padding-right:clamp(34px,5vw,80px) !important;
}
.hero.hero-top-image .hero-up{
  margin-right:var(--page-gutter);
}

/* Softer tone behind top image, close to page background */
.hero-up,
.hero-visual{
  background:#efede8 !important;
}
.hero-up img{
  mix-blend-mode:multiply;
}

/* ARMAOS | CRAFTED FLOW */
.brand span,
.footer-brand p{
  letter-spacing:.16em;
}

/* New Technical / Customisation */
.technical-v8{
  max-width:var(--max);
  margin:90px auto 0;
  padding:0 !important;
  background:var(--ink);
  color:#fff;
  display:grid !important;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr) !important;
}
.technical-v8-head{
  padding:82px 68px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.technical-v8-head h2{
  margin:14px 0 26px;
  font-size:clamp(48px,5vw,72px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:500;
}
.technical-v8-head > p:not(.section-kicker){
  max-width:590px;
  margin:0;
  color:#c8d0d3;
  font-size:17px;
  line-height:1.7;
}
.technical-v8-head .primary-btn{
  align-self:flex-start;
  margin-top:30px;
}
.technical-v8-items{
  padding:48px 62px;
  border-left:1px solid rgba(255,255,255,.16);
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}
.technical-v8-items article{
  display:grid;
  grid-template-columns:42px 180px minmax(0,1fr);
  gap:20px;
  align-items:start;
  padding:30px 0;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.technical-v8-items article:last-child{
  border-bottom:0;
}
.technical-v8-items span{
  font-size:12px;
  color:#91a0a7;
  padding-top:4px;
}
.technical-v8-items h3{
  margin:0;
  font-size:18px;
  line-height:1.45;
  font-weight:500;
}
.technical-v8-items p{
  margin:0;
  width:auto !important;
  max-width:none !important;
  color:#cbd3d6;
  font-size:15px;
  line-height:1.6;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}

/* Footer content also follows the same page gutter */
footer{
  padding-left:var(--page-gutter) !important;
  padding-right:var(--page-gutter) !important;
}

@media(max-width:1100px){
  .technical-v8{
    grid-template-columns:1fr !important;
  }
  .technical-v8-items{
    border-left:0;
    border-top:1px solid rgba(255,255,255,.16);
  }
}
@media(max-width:800px){
  .technical-v8-items article{
    grid-template-columns:36px minmax(0,1fr);
  }
  .technical-v8-items article p{
    grid-column:2;
  }
}
@media(max-width:650px){
  :root{--page-gutter:18px}
  .hero.hero-top-image{
    grid-template-columns:1fr;
  }
  .hero.hero-top-image .hero-copy{
    padding-left:var(--page-gutter) !important;
    padding-right:var(--page-gutter) !important;
  }
  .hero.hero-top-image .hero-up{
    margin-right:0;
  }
  .technical-v8-head,
  .technical-v8-items{
    padding:54px 24px;
  }
}


/* ===== V9 alignment refinements ===== */

/* Intro heading ("Bathroom, kitchen...") aligned to the same left page gutter */
.intro-aligned{
  max-width:none !important;
  width:100%;
  padding-left:var(--page-gutter) !important;
  padding-right:var(--page-gutter) !important;
  border-left:0 !important;
  border-right:0 !important;
}
.intro-aligned > div:first-child{
  padding-left:0 !important;
}
.intro-aligned h2{
  margin-left:0 !important;
}

/* Technical section spans full viewport width like Plating Finishes */
.technical-v8{
  max-width:none !important;
  width:100%;
  margin-left:0 !important;
  margin-right:0 !important;
}
.technical-v8-head{
  padding-left:var(--page-gutter) !important;
}
.technical-v8-items{
  padding-right:var(--page-gutter) !important;
}

/* Guarantee heading aligned to the same left page gutter */
.guarantee-aligned{
  max-width:none !important;
  width:100%;
  padding-left:var(--page-gutter) !important;
  padding-right:var(--page-gutter) !important;
  border-left:0 !important;
  border-right:0 !important;
}
.guarantee-aligned > div:first-child{
  padding-left:0 !important;
}
.guarantee-aligned h2{
  margin-left:0 !important;
}

/* Center the main top image vertically inside its tall panel */
.hero-up{
  align-items:center !important;
  justify-content:center !important;
}
.hero-up img{
  object-position:center center !important;
  transform:none !important;
}

@media(max-width:650px){
  .technical-v8-head{
    padding-left:24px !important;
  }
  .technical-v8-items{
    padding-right:24px !important;
  }
}


/* ===== V10 technical numbering removal ===== */
.technical-v8-items article{
  grid-template-columns:190px minmax(0,1fr) !important;
  gap:24px !important;
}
.technical-v8-items article > h3{
  grid-column:1;
}
.technical-v8-items article > p{
  grid-column:2;
}
@media(max-width:800px){
  .technical-v8-items article{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  .technical-v8-items article > h3,
  .technical-v8-items article > p{
    grid-column:1 !important;
  }
}


/* ===== V11 mobile menu refinement ===== */
@media(max-width:1000px){
  .mainnav.open{
    align-items:center !important;
    text-align:center !important;
    background:#f0eee9 !important;
  }

  .mainnav.open a{
    width:100%;
    text-align:center !important;
  }
}


/* ===== V12 photo-free alternate version ===== */

/* Collections + Accessories without imagery */
.no-photo-collections .text-only-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
}
.no-photo-collections .text-only-card{
  min-height:320px;
  background:#e9ecec;
}
.no-photo-collections .text-only-card .collection-copy{
  min-height:320px;
  padding:44px;
  background:#e9ecec;
}
.no-photo-collections .text-only-card .collection-copy h3{
  font-size:52px;
  margin-bottom:14px;
}
.no-photo-collections .accessories-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.no-photo-collections .accessories-grid .text-only-card{
  grid-column:1 / 2;
}

/* Colours + finishes as typography only */
.name-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  border-top:1px solid var(--line);
}
.name-item{
  min-height:92px;
  padding:20px 0;
  display:flex;
  align-items:baseline;
  gap:12px;
  border-bottom:1px solid var(--line);
}
.name-code{
  min-width:42px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
}
.name-label{
  font-size:15px;
}
.colour-name-grid .name-item{
  color:var(--ink);
}
.no-photo-finishes .name-grid{
  border-top:1px solid rgba(255,255,255,.22);
}
.no-photo-finishes .name-item{
  border-bottom:1px solid rgba(255,255,255,.22);
}
.no-photo-finishes .name-code{
  color:#9aa7ad;
}
.no-photo-finishes .name-label{
  color:#f0f2f2;
}

/* Knobs without imagery */
.text-knobs{
  border:0 !important;
}
.text-knobs .knob{
  min-height:150px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-right:1px solid var(--line) !important;
}
.text-knobs .knob:last-child{
  border-right:0 !important;
}
.text-knobs .knob span{
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#5f6b70;
}

@media(max-width:1000px){
  .no-photo-collections .text-only-grid,
  .no-photo-collections .accessories-grid{
    grid-template-columns:1fr;
  }
  .no-photo-collections .accessories-grid .text-only-card{
    grid-column:auto;
  }
  .name-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:650px){
  .no-photo-collections .text-only-card .collection-copy{
    min-height:260px;
    padding:30px;
  }
  .no-photo-collections .text-only-card .collection-copy h3{
    font-size:42px;
  }
  .name-grid{
    grid-template-columns:1fr;
  }
  .text-knobs{
    grid-template-columns:1fr 1fr;
  }
}


/* ===== V13 no-photo link update ===== */
.code-link{
  display:inline-block;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  padding-bottom:2px;
  cursor:pointer;
  transition:opacity .2s ease;
}
.code-link:hover{
  opacity:.55;
}


/* ===== V14 hero title typography ===== */
/* Stronger modern high-contrast serif treatment, inspired by PF Regal's editorial character */
.hero-copy h1{
  font-family: "Bodoni 72", "Bodoni MT", Didot, "Times New Roman", serif !important;
  font-weight:700 !important;
  letter-spacing:-0.045em !important;
  line-height:.91 !important;
}


/* ===== V15 clickable colour/finish names ===== */
.name-link{
  color:inherit;
  text-decoration:none;
  cursor:pointer;
  transition:opacity .2s ease;
}
.name-link:hover{
  opacity:.55;
}


/* ===== V16 mobile menu bottom shadow ===== */
@media(max-width:1000px){
  .mainnav.open{
    box-shadow:0 16px 24px -14px rgba(27,38,44,.28) !important;
  }
}


/* ===== V17 mobile colours two columns ===== */
@media(max-width:650px){
  .colour-name-grid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    column-gap:20px;
  }
  .colour-name-grid .name-item{
    min-width:0;
  }
  .colour-name-grid .name-label{
    min-width:0;
    overflow-wrap:anywhere;
  }
}


/* ===== V18 accessories highlight ===== */
.no-photo-collections .accessories-highlight,
.no-photo-collections .accessories-highlight .collection-copy{
  background:#f1f2ef !important;
}


/* ===== V19 menu text black ===== */
.mainnav a{
  color:#000 !important;
}
@media(max-width:1000px){
  .mainnav.open a{
    color:#000 !important;
  }
}
