
    :root {
      --bg: #ffffff;
      --bg-soft: #f5f5f3;
      --text: #222222;
      --muted: #626262;
      --border: #e7e5e0;
      --accent: #d52b32;
      --accent-dark: #b32026;
      --shadow: 0 24px 60px rgba(24, 24, 24, 0.08);
      --radius: 22px;
      --radius-sm: 16px;
      --container: 1320px;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
      background: var(--bg);
      color: var(--text);
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }
    img { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }
    button { font: inherit; }
    .container { width: min(var(--container), calc(100% - 40px)); margin: 0 auto; }
    .section { padding: 100px 0; }
    .eyebrow {
      display: inline-flex; align-items: center; gap: 10px; text-transform: uppercase;
      letter-spacing: .14em; font-size: 12px; font-weight: 700; color: var(--muted);
    }
    .eyebrow::before { content: ''; width: 28px; height: 1px; background: var(--accent); display: inline-block; }
    .section-head { display: grid; grid-template-columns: 1.1fr .9fr; gap: 28px; align-items: end; margin-bottom: 36px; }
    .section-title { margin: 12px 0 0; font-size: clamp(32px, 4vw, 52px); line-height: 1.02; letter-spacing: -0.04em; font-weight: 800; }
    .section-copy { margin: 0; color: var(--muted); max-width: 620px; }

    .topbar {
      position: sticky; top: 0; z-index: 20;
      background: rgba(255,255,255,.92); backdrop-filter: blur(14px);
      border-bottom: 1px solid rgba(231,229,224,.7);
    }
    .nav { display: flex; align-items: center; justify-content: space-between; height: 82px; gap: 24px; }
    .brand { display: flex; align-items: center; gap: 14px; min-width: 0; }
    .brand-mark {
      width: 42px; height: 42px; border-radius: 10px; background: linear-gradient(145deg, var(--accent), #ea575e);
      display: grid; place-items: center; color: white; font-size: 22px; font-weight: 800; box-shadow: 0 12px 20px rgba(213,43,50,.18);
      flex: 0 0 auto;
    }
    .brand-text strong { display: block; font-size: 15px; letter-spacing: -0.02em; }
    .brand-text span { display: block; font-size: 12px; color: var(--muted); }
    .nav-links { display: flex; align-items: center; gap: 26px; }
    .nav-links a { font-size: 14px; color: #333; position: relative; }
    .nav-links a::after { content: ''; position: absolute; left: 0; bottom: -10px; width: 0; height: 1.5px; background: var(--accent); transition: width .2s ease; }
    .nav-links a:hover::after, .nav-links a:focus-visible::after { width: 100%; }
    .nav-actions { display: flex; align-items: center; gap: 12px; }
    .btn {
      display: inline-flex; align-items: center; justify-content: center; gap: 10px;
      min-height: 48px; padding: 0 20px; border-radius: 999px; border: 1px solid transparent;
      font-weight: 600; font-size: 14px; transition: .2s ease; cursor: pointer;
    }
    .btn-primary { background: var(--accent); color: white; box-shadow: 0 12px 24px rgba(213,43,50,.18); }
    .btn-primary:hover, .btn-primary:focus-visible { background: var(--accent-dark); transform: translateY(-1px); }
    .btn-secondary { background: transparent; color: var(--text); border-color: var(--border); }
    .btn-secondary:hover, .btn-secondary:focus-visible { border-color: #cfc9c0; background: #fafaf8; }
    .mobile-toggle { display: none; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--border); background: white; }
    .mobile-toggle span, .mobile-toggle::before, .mobile-toggle::after { content: ''; display: block; width: 18px; height: 2px; background: var(--text); margin: 4px auto; border-radius: 4px; }

    .hero-wrap { padding: 34px 0 70px; }
    .hero {
      position: relative; overflow: clip; background: linear-gradient(180deg, #ffffff 0%, #fbfbfa 100%);
      border: 1px solid var(--border); border-radius: 36px; box-shadow: var(--shadow);
      min-height: 760px;
    }
    .hero-grid { position: relative; display: grid; grid-template-columns: 1fr 1.06fr; min-height: 760px; }
    .hero-copy { position: relative; z-index: 2; padding: 82px 60px 60px; display: flex; flex-direction: column; justify-content: center; }
    .hero-copy .eyebrow { margin-bottom: 18px; }
    .hero-copy h1 { margin: 0; font-size: clamp(52px, 8vw, 108px); line-height: .92; letter-spacing: -0.075em; font-weight: 800; max-width: 7ch; }
    .hero-copy h1 span { display: block; }
    .hero-subline { margin: 14px 0 0; font-size: clamp(18px, 2vw, 22px); letter-spacing: -0.04em; color: #444; font-weight: 500; }
    .hero-lead { margin: 24px 0 0; max-width: 560px; color: var(--muted); font-size: 16px; }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
    .hero-meta { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; margin-top: 42px; max-width: 560px; }
    .hero-meta-card { padding-top: 16px; border-top: 1px solid var(--border); }
    .hero-meta-card strong { display: block; margin-bottom: 6px; font-size: 15px; }
    .hero-meta-card p { margin: 0; font-size: 13px; color: var(--muted); }
    .hero-stage { position: relative; min-height: 760px; }
    .hero-stage::before {
      content: 'ФАРБАРА ШАРА'; position: absolute; top: 44px; right: 44px; left: 0; text-align: right;
      font-size: clamp(76px, 12vw, 164px); line-height: .88; letter-spacing: -0.08em; font-weight: 800;
      color: rgba(34,34,34,0.06); z-index: 0; pointer-events: none;
    }
    .stage-soft { position: absolute; inset: 0; background: radial-gradient(circle at 68% 42%, rgba(213,43,50,.10), transparent 23%), radial-gradient(circle at 72% 62%, rgba(0,0,0,.06), transparent 24%); pointer-events: none; }
    #modelStage { position: absolute; inset: 0; z-index: 1; }
    .hero-note {
      position: absolute; right: 36px; bottom: 34px; z-index: 2; width: min(280px, calc(100% - 72px));
      background: rgba(255,255,255,.88); backdrop-filter: blur(10px); border: 1px solid rgba(231,229,224,.9);
      border-radius: 22px; padding: 18px 18px 16px; box-shadow: 0 16px 26px rgba(30,30,30,.06);
    }
    .hero-note strong { display: block; font-size: 15px; margin-bottom: 6px; }
    .hero-note p { margin: 0; font-size: 13px; color: var(--muted); }

    .category-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }
    .category-card {
      grid-column: span 3; position: relative; overflow: hidden; min-height: 360px; border-radius: 24px; background: #fff;
      border: 1px solid var(--border); box-shadow: 0 14px 32px rgba(23,23,23,.05);
      display: flex; flex-direction: column; justify-content: end;
    }
    .category-image { position: absolute; inset: 0; }
    .category-image img { width: 100%; height: 100%; object-fit: cover; }
    .category-image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.03) 20%, rgba(10,10,10,.58) 100%); }
    .category-card-content { position: relative; z-index: 1; padding: 24px; color: #fff; }
    .category-card h3 { margin: 0 0 8px; font-size: 24px; line-height: 1.04; letter-spacing: -0.04em; }
    .category-card p { margin: 0 0 14px; font-size: 14px; color: rgba(255,255,255,.84); max-width: 28ch; }
    .inline-link { display: inline-flex; gap: 8px; align-items: center; font-size: 14px; font-weight: 600; }
    .inline-link::after { content: '→'; transition: transform .2s ease; }
    .inline-link:hover::after { transform: translateX(4px); }

    .feature-panel { display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: stretch; }
    .feature-panel.reverse { grid-template-columns: .95fr 1.05fr; }
    .feature-media { position: relative; overflow: hidden; border-radius: 30px; min-height: 520px; border: 1px solid var(--border); background: #ddd; }
    .feature-media img { width: 100%; height: 100%; object-fit: cover; }
    .feature-copy { background: var(--bg-soft); border-radius: 30px; padding: 42px; border: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; }
    .feature-copy h2 { margin: 14px 0 0; font-size: clamp(34px, 4vw, 50px); line-height: 1.02; letter-spacing: -0.05em; }
    .feature-copy p { margin: 18px 0 0; color: var(--muted); max-width: 56ch; }
    .feature-list { display: grid; gap: 14px; margin: 28px 0 34px; }
    .feature-item { display: grid; grid-template-columns: 42px 1fr; gap: 14px; align-items: start; }
    .feature-item-bullet { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 1px solid var(--border); color: var(--accent); font-weight: 700; }
    .feature-item strong { display: block; margin-bottom: 4px; font-size: 15px; }
    .feature-item span { color: var(--muted); font-size: 14px; }
    .mini-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-top: 26px; }
    .mini-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; padding: 16px; }
    .mini-card strong { display: block; font-size: 14px; margin-bottom: 6px; }
    .mini-card span { display: block; color: var(--muted); font-size: 13px; }

    .about-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 26px; align-items: stretch; }
    .about-card { background: #fff; border: 1px solid var(--border); border-radius: 28px; padding: 34px; box-shadow: 0 14px 32px rgba(23,23,23,.04); }
    .about-card h2 { margin: 14px 0 0; font-size: clamp(32px, 4vw, 48px); line-height: 1.02; letter-spacing: -0.05em; }
    .about-card p { color: var(--muted); margin: 16px 0 0; }
    .principles { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-top: 30px; }
    .principle { padding: 18px; border-radius: 18px; background: var(--bg-soft); border: 1px solid var(--border); }
    .principle strong { display: block; font-size: 15px; margin-bottom: 6px; }
    .principle span { color: var(--muted); font-size: 14px; }
    .about-photo { position: relative; overflow: hidden; border-radius: 28px; min-height: 520px; border: 1px solid var(--border); }
    .about-photo img { width: 100%; height: 100%; object-fit: cover; }

    .contact-wrap { background: var(--bg-soft); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
    .contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 22px; align-items: stretch; }
    .contact-card { background: #fff; border: 1px solid var(--border); border-radius: 28px; padding: 34px; }
    .contact-card h2 { margin: 14px 0 0; font-size: clamp(30px, 4vw, 46px); line-height: 1.03; letter-spacing: -0.05em; }
    .contact-list { display: grid; gap: 18px; margin-top: 28px; }
    .contact-row { padding-bottom: 16px; border-bottom: 1px solid var(--border); }
    .contact-row:last-child { border-bottom: 0; padding-bottom: 0; }
    .contact-row strong { display: block; margin-bottom: 5px; font-size: 14px; color: #444; }
    .contact-row span, .contact-row a { color: var(--text); font-size: 17px; font-weight: 500; }
    .contact-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
    .map-frame { overflow: hidden; border: 1px solid var(--border); border-radius: 28px; min-height: 100%; background: #ddd; }
    .map-frame iframe { width: 100%; height: 100%; min-height: 520px; border: 0; display: block; }

    footer { padding: 28px 0 38px; }
    .footer-grid { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 24px; align-items: start; }
    .footer-brand p, .footer-col p, .footer-col a { color: var(--muted); font-size: 14px; }
    .footer-col strong { display: block; margin-bottom: 12px; font-size: 14px; }
    .footer-links { display: grid; gap: 10px; }
    .copyright { margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--border); color: var(--muted); font-size: 13px; }

    @media (max-width: 1180px) {
      .hero-grid, .feature-panel, .feature-panel.reverse, .about-grid, .contact-grid, .section-head, .footer-grid { grid-template-columns: 1fr; }
      .hero { min-height: auto; }
      .hero-stage, .hero-grid { min-height: auto; }
      .hero-stage { height: 620px; }
      .hero-copy { padding: 56px 32px 22px; }
      .hero-stage::before { text-align: left; left: 28px; right: 28px; top: 10px; }
      .category-card { grid-column: span 6; }
    }
    @media (max-width: 900px) {
      .nav-links, .nav-actions .btn-primary { display: none; }
      .mobile-toggle { display: inline-block; }
      .nav.open .nav-links { display: flex; }
      .nav.open { position: relative; }
      .nav.open .nav-links { position: absolute; top: calc(100% + 10px); left: 0; right: 0; background: white; border: 1px solid var(--border); border-radius: 22px; box-shadow: var(--shadow); padding: 18px; flex-direction: column; align-items: flex-start; gap: 14px; }
      .section { padding: 78px 0; }
      .hero-wrap { padding: 20px 0 54px; }
      .hero { border-radius: 28px; }
      .hero-copy h1 { max-width: 100%; }
      .hero-note { left: 22px; right: 22px; bottom: 20px; width: auto; }
      .hero-stage { height: 500px; }
      .category-card { grid-column: span 12; min-height: 320px; }
      .feature-media, .about-photo { min-height: 360px; }
      .feature-copy, .contact-card, .about-card { padding: 28px; }
      .principles, .mini-grid, .hero-meta { grid-template-columns: 1fr; }
    }
    @media (max-width: 640px) {
      .container { width: min(var(--container), calc(100% - 24px)); }
      .nav { height: 72px; }
      .brand-mark { width: 38px; height: 38px; font-size: 20px; }
      .hero-copy { padding: 38px 20px 14px; }
      .hero-copy h1 { font-size: clamp(42px, 15vw, 72px); }
      .hero-subline { font-size: 18px; }
      .hero-actions .btn { width: 100%; }
      .hero-stage { height: 410px; }
      .hero-note { padding: 14px; border-radius: 18px; }
      .feature-copy, .contact-card, .about-card { padding: 22px; border-radius: 22px; }
      .feature-media, .about-photo, .map-frame { border-radius: 22px; }
      .category-card { border-radius: 20px; }
      .category-card-content { padding: 20px; }
    }
  
/* Local style refinements: white retail design. Existing sections retained. */
:root { --bg:#fff; --bg-soft:#fff; --shadow:none; }
html { scroll-padding-top:90px; }
body { background:#fff; font-family:Inter,Arial,Helvetica,sans-serif; }
.topbar { background:#fff; backdrop-filter:none; }
.brand-mark { background:#d52b32; box-shadow:none; border-radius:4px; }
.hero-wrap { padding:0 0 62px; }
.hero { min-height:0; border:0; border-radius:0; background:#fff; box-shadow:none; overflow:visible; }
.hero-grid { min-height:clamp(680px,72vw,900px); display:block; position:relative; }
.hero-copy { position:relative; padding:0; display:block; min-height:inherit; max-width:none; pointer-events:none; }
.hero-copy .eyebrow { display:none; }
.hero-text { position:relative; z-index:4; padding-top:clamp(118px,15vw,205px); max-width:none; pointer-events:none; }
.hero-title { font-size:clamp(64px,12.3vw,174px); line-height:.85; letter-spacing:-.087em; font-weight:800; margin:0; white-space:nowrap; text-align:center; color:#202020; position:relative; z-index:4; }
.hero-subline { margin:18px 0 0; text-align:center; font-size:clamp(15px,1.65vw,22px); letter-spacing:-.03em; font-weight:500; color:#484848; position:relative; z-index:4; }
.hero-actions { position:relative; z-index:6; display:flex; align-items:center; justify-content:center; margin-top:30px; pointer-events:auto; }
.hero-actions .btn { border-radius:3px; box-shadow:none; }
.btn { border-radius:3px; box-shadow:none; }
.btn:hover { transform:none; }
#modelStage { position:absolute; inset:0; z-index:2; touch-action:pan-y; cursor:grab; outline:none; }
#modelStage.dragging { cursor:grabbing; touch-action:none; }
#modelStage canvas { display:block; width:100%; height:100%; touch-action:pan-y; }
.hero-interaction-hint { position:absolute; right:2px; bottom:32px; z-index:5; color:#7b7b7b; font-size:12px; letter-spacing:.01em; pointer-events:none; }
.hero-interaction-hint::before { content:'↔'; margin-right:10px; font-size:18px; vertical-align:-1px; }
.section { padding:84px 0; }
.section-head { margin-bottom:30px; }
.section-title { font-weight:700; }
.category-card { border-radius:2px; box-shadow:none; }
.category-image::after { background:linear-gradient(180deg, transparent 34%, rgba(0,0,0,.64)); }
.category-card-content { padding:24px; }
.feature-media,.feature-copy,.about-card,.about-photo,.contact-card,.map-frame { border-radius:2px; box-shadow:none; }
.feature-copy,.contact-wrap,.principle { background:#fff; }
.feature-copy { border:1px solid #e7e5e0; }
.mini-card,.principle { border-radius:2px; }
.feature-item-bullet { border-radius:2px; }
.nav-links a:hover { color:#d52b32; }
:focus-visible { outline:2px solid #d52b32; outline-offset:3px; }
.contact-wrap { border-top:1px solid #e7e5e0; border-bottom:1px solid #e7e5e0; }
.contact-card { padding:35px; }
.contact-row .pending { font-size:14px; font-weight:400; color:#777; }
@media(max-width:1180px) {
 .hero-grid { min-height:740px; }
 .hero-copy { min-height:inherit; padding:0; }
 .hero-text { padding-top:155px; }
 .hero-title { font-size:clamp(54px,12.5vw,126px); }
 .hero-stage { height:auto; min-height:inherit; }
}
@media(max-width:900px) {
 .hero-grid { min-height:680px; }
 .hero-text { padding-top:130px; }
 .hero-title { font-size:clamp(48px,12vw,105px); }
 .hero-interaction-hint { bottom:20px; }
 .hero-actions .btn { width:auto; }
 .section { padding:60px 0; }
}
@media(max-width:640px) {
 .hero-wrap { padding:0 0 36px; }
 .hero-grid { min-height:640px; }
 .hero-text { padding-top:112px; }
 .hero-title { font-size:clamp(39px,11.7vw,76px); letter-spacing:-.065em; }
 .hero-subline { margin-top:16px; font-size:15px; }
 .hero-actions { margin-top:25px; gap:9px; }
 .hero-actions .btn { width:auto; padding:0 12px; min-height:44px; font-size:12px; }
 .hero-interaction-hint { bottom:12px; right:4px; }
}
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto;} }


/* Hero adjustments: reserve a clean, unobstructed typographic zone above the 3D spray. */
.hero-grid { min-height: 850px; }
.hero-text { padding-top: 105px; }
.hero-title, .hero-subline, .hero-actions { position: relative; z-index: 5; }
#modelStage { top: 320px; bottom: 0; left: 0; right: 0; }
.hero-interaction-hint { bottom: 12px; }
@media (min-width: 1500px) {
  .hero-grid { min-height: 940px; }
  #modelStage { top: 330px; }
}
@media (max-width: 900px) {
  .hero-grid { min-height: 800px; }
  .hero-text { padding-top: 98px; }
  #modelStage { top: 320px; }
}
@media (max-width: 640px) {
  .hero-grid { min-height: 720px; }
  .hero-text { padding-top: 88px; }
  #modelStage { top: 270px; }
  .hero-title { white-space: normal; font-size: clamp(44px, 11vw, 70px); }
  .hero-subline { margin-top: 14px; }
  .hero-actions { margin-top: 22px; }
}
@media (max-width: 380px) {
  .hero-grid { min-height: 690px; }
  #modelStage { top: 280px; }
}

/* Finishing pass: center the typography and ground the original 3D spray. */
.hero-copy h1.hero-title {
  width: 100%;
  max-width: none; /* Override old two-column hero's 7ch limit */
  text-align: center;
  margin-inline: auto;
}
.hero-text {
  width: 100%;
  text-align: center;
}
.hero-actions {
  width: 100%;
  justify-content: center;
}
#modelStage { isolation: isolate; }
#modelStage::before {
  content: '';
  position: absolute;
  z-index: 0;
  left: 50%;
  bottom: 7.5%;
  transform: translateX(-50%);
  width: clamp(125px, 19vw, 250px);
  height: clamp(22px, 3vw, 40px);
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(20,20,20,.24) 0%, rgba(20,20,20,.11) 42%, transparent 76%);
  filter: blur(8px);
  pointer-events: none;
}
#modelStage canvas {
  position: relative;
  z-index: 1;
  filter: drop-shadow(12px 19px 15px rgba(20,20,20,.19));
}
@media (max-width: 640px) {
  .hero-copy h1.hero-title { max-width:none; }
  #modelStage::before { bottom: 9%; width: 145px; height: 26px; }
  #modelStage canvas { filter: drop-shadow(7px 12px 11px rgba(20,20,20,.18)); }
}


/* Farbara Šara: editorial 3D hero inspired by the supplied composition. */
html { scroll-padding-top: 82px; }
body { overflow-x: clip; }
.hero-wrap { background:#cec6bb; padding:0; margin:0; }
.hero-wrap > .container { max-width:none; width:100%; }
.hero { background:transparent; border:0; border-radius:0; box-shadow:none; overflow:hidden; }
.hero-grid { position:relative; display:block; width:100%; min-height:0; height:calc(100svh - 82px); min-height:660px; isolation:isolate; overflow:hidden; }
.hero-copy { position:static; padding:0; min-height:0; display:block; pointer-events:none; }
.hero .hero-text { position:static; padding:0; width:100%; text-align:center; pointer-events:none; }
.hero-copy h1.hero-title { position:absolute; z-index:5; top:6.5%; left:50%; transform:translateX(-50%); width:calc(100% - 100px); max-width:none; margin:0; padding:0; white-space:nowrap; font-size:clamp(48px, 9.15vw, 164px); font-weight:800; line-height:.94; letter-spacing:-.078em; color:#181715; text-align:center; animation:hero-title-in 850ms cubic-bezier(.22,1,.36,1) both; }
.hero .hero-subline { position:absolute; z-index:5; top:calc(6.5% + clamp(49px,8.6vw,155px)); left:12px; right:12px; margin:0; color:#403c38; text-align:center; font-size:clamp(14px,1.45vw,20px); font-weight:500; animation:hero-fade-in 800ms 260ms both; }
#modelStage { position:absolute; z-index:2; top:22%; bottom:14%; left:5%; right:5%; isolation:isolate; touch-action:pan-y; cursor:grab; animation:hero-model-in 1100ms 150ms cubic-bezier(.22,1,.36,1) both; }
#modelStage canvas { position:relative; z-index:1; width:100%; height:100%; display:block; filter:drop-shadow(11px 18px 14px rgba(33,27,23,.20)); touch-action:pan-y; }
#modelStage::before { content:''; position:absolute; z-index:0; bottom:2%; left:50%; transform:translateX(-50%); width:clamp(130px,20vw,260px); height:34px; border-radius:50%; background:radial-gradient(ellipse,rgba(50,40,34,.17),transparent 72%); filter:blur(12px); pointer-events:none; }
.hero .hero-actions { position:absolute; z-index:6; left:16px; right:16px; bottom:6.5%; width:auto; margin:0; display:flex; justify-content:center; align-items:center; gap:26px; pointer-events:auto; animation:hero-fade-in 800ms 650ms both; }
.hero .hero-actions .btn { border:0; box-shadow:none; font-size:14px; font-weight:700; transition:transform .23s ease,background .23s ease,color .23s ease; }
.hero .hero-actions .btn-primary { border-radius:999px; background:#d72530; padding:0 28px; min-height:52px; color:#fff; }
.hero .hero-actions .btn-primary:hover { background:#b91b26; transform:translateY(-2px); }
.hero .hero-actions .btn-secondary { border:0; background:transparent; color:#1a1815; border-radius:0; padding:0 4px; min-height:48px; }
.hero .hero-actions .btn-secondary span { font-size:21px; line-height:1; transition:transform .23s ease; }
.hero .hero-actions .btn-secondary:hover { background:transparent; transform:translateY(-2px); }
.hero .hero-actions .btn-secondary:hover span { transform:translate(2px,-2px); }
.hero-index, .hero-interaction-hint, .hero-scroll { position:absolute; z-index:5; color:#453f38; font-size:10px; font-weight:700; letter-spacing:.18em; }
.hero-index { left:clamp(22px,4.5vw,78px); bottom:7.5%; pointer-events:none; }
.hero-interaction-hint { right:clamp(28px,6vw,100px); bottom:18%; color:#5c5148; font-size:10px; letter-spacing:.18em; pointer-events:none; }
.hero-interaction-hint::before { content:'↔'; display:inline-block; font-size:17px; margin-right:9px; font-weight:400; }
.hero-scroll { bottom:7.5%; right:clamp(22px,4.5vw,78px); display:flex; align-items:center; gap:13px; }
.hero-scroll span { font-size:17px; animation:hero-scroll-bob 2.2s ease-in-out infinite; }
.hero-rail { position:absolute; z-index:6; right:18px; top:50%; transform:translateY(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; }
.hero-rail a { width:2px; height:21px; background:rgba(40,34,29,.24); display:block; transition:background .2s,height .2s; }
.hero-rail a.active, .hero-rail a:hover { background:#d72530; height:29px; }
.hero-rail a:focus-visible { outline:2px solid #d72530; outline-offset:5px; }
.hero-scroll:focus-visible,.hero .hero-actions a:focus-visible { outline:2px solid #181715; outline-offset:5px; }
@keyframes hero-title-in { from { opacity:0; transform:translate(-50%,20px); } to { opacity:1; transform:translate(-50%,0); } }
@keyframes hero-model-in { from { opacity:0; transform:translateY(25px) scale(.91); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes hero-fade-in { from { opacity:0; } to { opacity:1; } }
@keyframes hero-scroll-bob { 50% { transform:translateY(5px); } }
@media(max-width:1100px) {
 .hero-grid { min-height:650px; }
 .hero-copy h1.hero-title { top:9%; font-size:clamp(46px,9.5vw,100px); width:calc(100% - 64px); }
 .hero .hero-subline { top:calc(9% + clamp(45px,9.5vw,100px)); }
 #modelStage { top:24%; bottom:15%; left:2%;right:2%; }
 .hero-rail { right:10px; }
}
@media(max-width:700px) {
 .hero-grid { height:calc(100svh - 72px); min-height:590px; }
 .hero-copy h1.hero-title { top:7%; width:calc(100% - 28px); max-width:600px; white-space:normal; font-size:clamp(49px,12.8vw,86px); line-height:.90; letter-spacing:-.075em; }
 .hero .hero-subline { top:calc(7% + clamp(96px,23vw,160px)); padding:0 22px; line-height:1.4; font-size:clamp(13px,3vw,17px); }
 #modelStage { top:28%; bottom:17%; left:0;right:0; }
 .hero .hero-actions { bottom:8.5%; left:10px;right:10px;gap:14px; }
 .hero .hero-actions .btn-primary { min-height:46px;padding:0 17px;font-size:12px; }
 .hero .hero-actions .btn-secondary { min-height:46px;font-size:12px;padding:0; }
 .hero-index { bottom:2.4%; left:16px;font-size:9px; }
 .hero-scroll { bottom:2.4%; right:16px;font-size:9px; }
 .hero-interaction-hint { bottom:19%; right:15px; font-size:8px; }
 .hero-rail { display:none; }
 #modelStage canvas { filter:drop-shadow(7px 12px 9px rgba(33,27,23,.17)); }
}
@media(max-width:380px) { .hero-copy h1.hero-title {font-size:12vw;} .hero .hero-actions{gap:8px;} .hero .hero-actions .btn-primary{padding:0 13px;} .hero-grid{min-height:550px;} }
@media(prefers-reduced-motion:reduce) { .hero-copy h1.hero-title,.hero .hero-subline,#modelStage,.hero .hero-actions,.hero-scroll span {animation:none!important;} }


/* Final correction: natural OBJ proportions and balanced editorial spacing. */
@media (min-width:1101px) {
 .hero-grid { min-height: 740px; }
 .hero-copy h1.hero-title { top:5.7%; font-size:clamp(56px,7.4vw,118px); letter-spacing:-.072em; width:calc(100% - 96px); }
 .hero .hero-subline { top:calc(5.7% + clamp(58px,7.5vw,115px)); }
 #modelStage { top:26%; bottom:16%; }
 .hero .hero-actions { bottom:7%; }
}
@media (min-width:701px) and (max-width:1100px) {
 .hero-copy h1.hero-title { font-size:clamp(52px,7.7vw,90px); }
 #modelStage { top:28%; bottom:17%; }
}
@media (max-width:700px) {
 .hero-grid { min-height:690px; }
 #modelStage { top:32%; bottom:19%; }
 .hero .hero-actions { bottom:9%; }
}

/* November 11: user-provided, fixed viewport artwork. Only the content scrolls. */
body { background: #fff; }
.site-fixed-background {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: #fff url('../images/pozadina-desktop.webp') center center / cover no-repeat;
}
body > header, body > main, body > footer { position: relative; z-index: 1; }
.hero-wrap, .hero, .contact-wrap { background: transparent !important; }
/* Opaque blocks still protect long passages of copy from the colorful artwork. */
.feature-copy, .about-card, .contact-card, .mini-card, .principle { background: rgba(255,255,255,.96); }
.topbar { background: rgba(255,255,255,.94); }
@media (max-width: 700px) {
  .site-fixed-background {
    background-image: url('../images/pozadina-telefon.webp');
    background-position: center center;
  }
}
/* Extra depth for the existing WebGL spray, without changing its geometry or height. */
#modelStage canvas { filter: drop-shadow(11px 19px 15px rgba(15,12,12,.36)); }
#modelStage::before {
  background: radial-gradient(ellipse,rgba(18,16,16,.34),rgba(18,16,16,.14) 43%, transparent 75%);
}
@media (max-width: 700px) {
 #modelStage canvas { filter: drop-shadow(7px 13px 11px rgba(15,12,12,.34)); }
}

/* The supplied original Šara logo in navigation and in the existing hero. */
.topbar .brand { flex-shrink:0; }
.nav-brand-logo { display:block; width:clamp(104px,10.8vw,150px); height:auto; max-height:63px; object-fit:contain; }
.hero-copy h1.hero-title.hero-title-logo { top:3.7%; width:min(660px,72vw); line-height:1; height:auto; }
.hero-title-logo img { display:block; width:100%; height:auto; object-fit:contain; }
.hero .hero-subline { top:calc(3.7% + min(25.6vw,256px)); }
@media (min-width:1101px) {
  .hero-copy h1.hero-title.hero-title-logo { width:min(610px,46vw); top:3.0%; }
  .hero .hero-subline { top:calc(3% + min(17.8vw,237px)); }
}
@media (min-width:701px) and (max-width:1100px) {
  .hero-copy h1.hero-title.hero-title-logo { width:min(515px,54vw); top:4%; }
  .hero .hero-subline { top:calc(4% + min(21vw,200px)); }
}
@media (max-width:700px) {
  .nav-brand-logo { width:108px; max-height:54px; }
  .hero-copy h1.hero-title.hero-title-logo { width:min(330px,75vw); top:6%; }
  .hero .hero-subline { top:calc(6% + min(29.1vw,128px)); }
}
@media(max-width:380px) { .nav-brand-logo { width:98px; } }


/* HERO finesse — preserve existing content, logo, assets, and anchors. */
.hero-grid { overflow: hidden; }
.hero-copy h1.hero-title.hero-title-logo { animation: hero-title-in 850ms cubic-bezier(.22,1,.36,1) both; }
.hero .hero-subline { letter-spacing: .035em; font-weight: 400; line-height: 1.5; color:#292929; }
.hero .hero-actions { bottom: 13%; gap: 24px; }
.hero .hero-actions .btn-primary { transition: transform .22s ease, background-color .22s ease; }
.hero .hero-actions .btn-primary:hover { transform:translateY(-3px); }
.hero .hero-actions .btn-secondary { transition:transform .22s ease; }
.hero .hero-actions .btn-secondary:hover span {transform:translate(4px,-3px);}
#modelStage { top: 17%; bottom: 17.5%; }
#modelStage canvas { filter: drop-shadow(8px 16px 17px rgba(14,12,11,.36)); }
#modelStage::before { bottom:0; width:clamp(120px,14vw,210px); height:30px; background:radial-gradient(ellipse,rgba(18,16,16,.34) 0%,rgba(18,16,16,.17) 43%,transparent 76%); filter:blur(10px); }
.hero-interaction-hint {display:none!important;}
@media (min-width:1101px) {
 .hero-copy h1.hero-title.hero-title-logo { top:3%; }
 .hero .hero-subline { top:calc(3% + min(17.8vw,237px)); }
 #modelStage { top:17%; bottom:17.5%; }
 .hero .hero-actions { bottom:13%; }
}
@media (min-width:701px) and (max-width:1100px) {
 .hero-copy h1.hero-title.hero-title-logo { top:4%; }
 .hero .hero-subline { top:calc(4% + min(21vw,200px)); }
 #modelStage { top:23%; bottom:18%; }
 .hero .hero-actions { bottom:12%; }
}
@media (max-width:700px) {
 .hero-grid { min-height:620px; }
 .hero-copy h1.hero-title.hero-title-logo { top:5%; width:min(330px,75vw); }
 .hero .hero-subline { top:calc(5% + min(29.1vw,128px)); font-size:clamp(12px,3.1vw,16px); letter-spacing:.015em; }
 #modelStage { top:28%; bottom:19%; left:1%; right:1%; }
 #modelStage canvas {filter:drop-shadow(6px 11px 12px rgba(14,12,11,.33));}
 .hero .hero-actions { bottom:10%; gap:14px; }
}
@media (max-width:380px) {
 #modelStage { top:30%; bottom:19%; }
 .hero .hero-actions { bottom:10.5%; }
}
@media (max-height:700px) and (min-width:701px) {
 .hero-grid { min-height:610px; }
 .hero .hero-actions { bottom:8.5%; }
 #modelStage {top:24%; bottom:14%;}
}
@media (prefers-reduced-motion: reduce) {
 .hero-copy h1.hero-title.hero-title-logo, #modelStage, .hero .hero-subline, .hero .hero-actions {animation:none!important;}
 .hero .hero-actions .btn, .hero .hero-actions .btn-secondary span {transition:none!important;}
}

/* White background restoration; keep the rest of the existing site unchanged. */
html, body { background-color:#FFFFFF !important; }
.site-fixed-background { background:#FFFFFF !important; background-image:none !important; }
.hero-wrap, .hero, .contact-wrap { background-color:transparent !important; background-image:none !important; }

/* Latest request: natural proportions, stronger physical shadow and guaranteed text clearance. */
.hero-grid { isolation:isolate; }
#modelStage { overflow:hidden; transition:none; }
#modelStage canvas { filter:drop-shadow(10px 20px 18px rgba(12,10,10,.51)); }
#modelStage::before { width:clamp(140px,18vw,230px); height:38px; bottom:0;
  background:radial-gradient(ellipse,rgba(10,9,9,.51) 0%,rgba(10,9,9,.25) 46%,transparent 78%);filter:blur(11px); }
@media(max-width:700px){#modelStage canvas{filter:drop-shadow(7px 14px 13px rgba(12,10,10,.46));}}

/* Demonstration catalogue — appended without changing existing hero/3D styles. */
.catalog-section{background:#fff;position:relative;z-index:1;border-top:1px solid #eee}
.catalog-intro{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:end;margin-bottom:30px}
.catalog-intro p{color:#525252;font-size:16px;line-height:1.65;max-width:480px;margin:0 0 14px}
.catalog-disclaimer{font-size:12px;color:#787878;line-height:1.5}
.catalog-toolbar{display:flex;align-items:start;gap:18px;justify-content:space-between;margin-bottom:24px}
.catalog-tabs{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.catalog-tabs button{border:1px solid #e6e6e6;background:#fff;color:#303030;padding:10px 15px;border-radius:2px;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.catalog-tabs button:hover,.catalog-tabs button:focus-visible{border-color:#999}
.catalog-tabs button.is-active{background:#222;color:#fff;border-color:#222}
.catalog-search{width:265px;min-width:210px;display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid #ddd;background:white}
.catalog-search svg{width:18px;height:18px;fill:none;stroke:#555;stroke-width:1.6;flex-shrink:0}
.catalog-search input{border:0;background:none;outline:0;width:100%;font:inherit;font-size:13px;min-width:0}
.catalog-search:focus-within{outline:2px solid #d72530;outline-offset:2px}
.catalog-results{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:#777;margin-bottom:16px}
.catalog-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}
.catalog-product{min-width:0;border:1px solid #e7e7e7;background:#fff;display:flex;flex-direction:column;transition:border-color .2s,transform .2s}
.catalog-product:hover{border-color:#bebebe;transform:translateY(-3px)}
.catalog-product-image{aspect-ratio:1/1;background:#f5f5f3;overflow:hidden}
.catalog-product-image img{display:block;width:100%;height:100%;object-fit:contain}
.catalog-product-info{padding:15px;display:flex;flex:1;flex-direction:column}
.catalog-product-category{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:#888;font-weight:700;min-height:18px}
.catalog-product h3{font-size:15px;line-height:1.3;letter-spacing:-.02em;margin:8px 0 8px;font-weight:700;color:#222}
.catalog-product p{font-size:12px;line-height:1.55;color:#777;margin:0 0 22px;flex:1}
.catalog-product-footer{border-top:1px solid #eee;padding-top:11px;display:flex;justify-content:space-between;align-items:center;gap:7px}
.catalog-product-footer>span{font-size:11px;color:#777}
.catalog-product-footer a{font-size:12px;color:#c9222b;font-weight:700;white-space:nowrap}
.catalog-product-footer a:hover{text-decoration:underline}
.catalog-empty{padding:48px 20px;text-align:center;color:#777;border:1px solid #eee}
.catalog-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:24px 0 0;margin-top:27px;border-top:1px solid #e5e5e5}
.catalog-bottom span{font-size:15px;font-weight:600}
.catalog-bottom a{font-size:14px;font-weight:700;color:#d72530}
.catalog-bottom a span{display:inline-block;transition:transform .2s}
.catalog-bottom a:hover span{transform:translate(2px,-2px)}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1200px){.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:950px){.catalog-intro{grid-template-columns:1fr;gap:16px}.catalog-toolbar{flex-direction:column}.catalog-search{width:100%}.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.catalog-product-info{padding:11px}.catalog-product h3{font-size:13px}.catalog-product p{font-size:11px}.catalog-product-footer{align-items:start;flex-direction:column;gap:6px}.catalog-tabs{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:7px;scrollbar-width:thin}.catalog-tabs button{white-space:nowrap;flex-shrink:0;padding:9px 11px}.catalog-results{font-size:11px}}
@media(prefers-reduced-motion:reduce){.catalog-product,.catalog-tabs button,.catalog-bottom a span{transition:none!important}}

/* Категорије: један мени на десктопу, прегледне ставке на мобилном */
.category-nav{position:relative;font-size:14px;color:#333}
.category-nav summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:7px;white-space:nowrap}
.category-nav summary::-webkit-details-marker{display:none}
.category-nav summary:focus-visible,.category-nav-menu a:focus-visible{outline:2px solid #d72530;outline-offset:3px}
.category-nav-menu{position:absolute;left:-14px;top:calc(100% + 18px);min-width:270px;display:grid;gap:0;padding:8px;background:#fff;border:1px solid #e6e6e6;box-shadow:0 14px 32px #00000014;z-index:50}
.category-nav-menu a{font-size:13px!important;display:block;padding:11px 13px;white-space:nowrap}
.category-nav-menu a:hover{background:#f5f5f3}
.category-nav-menu a::after{display:none!important}
.catalog-category-links{display:flex;flex-wrap:wrap;gap:10px 16px;margin:0 0 22px;font-size:12px}
.catalog-category-links a{color:#666;text-decoration:underline;text-decoration-color:#ddd;text-underline-offset:4px}
.catalog-category-links a:hover{color:#d72530}
.category-page-main{padding:70px 0 105px;min-height:60vh;background:#fff}
.category-page-heading{max-width:900px;margin-bottom:38px}
.category-page-heading h1{font-size:clamp(35px,5vw,64px);line-height:1.06;letter-spacing:-.055em;margin:18px 0}
.category-page-heading p{color:#555;font-size:16px;max-width:650px}
.category-page-breadcrumb{color:#777;font-size:13px}
.category-page-breadcrumb a:hover{color:#d72530}
.category-page-results{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:22px 0;font-size:13px;color:#777}
.category-page-contact{margin-top:45px;padding-top:24px;border-top:1px solid #ddd;display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap}
@media(max-width:900px){.category-nav{width:100%}.category-nav-menu{position:static;box-shadow:none;border:0;border-left:2px solid #eee;margin:8px 0 0 4px;min-width:0;padding:0 0 0 10px}.category-nav-menu a{white-space:normal}.nav.open .nav-links{max-height:calc(100svh - 95px);overflow-y:auto}}
@media(max-width:640px){.category-page-main{padding:35px 0 65px}.category-page-heading{margin-bottom:22px}.category-page-contact{align-items:stretch;flex-direction:column}}


/* Farbara Sara — refined navigation, editorial categories and footer */
.topbar{background:rgba(255,255,255,.97);border-bottom:1px solid #eceae7}
.nav{gap:16px}
.nav-links{gap:clamp(11px,1.5vw,24px)}
.nav-links>a,.category-nav summary{font-weight:600;font-size:13px;white-space:nowrap}
.category-nav summary{gap:9px;list-style:none;cursor:pointer;min-height:44px}
.category-nav summary span{transition:transform .2s ease}
.category-nav[open] summary span{transform:rotate(180deg)}
.category-nav-menu{border-radius:4px;padding:8px;box-shadow:0 18px 45px rgba(0,0,0,.12);max-height:min(70vh,510px);overflow:auto}
.category-nav-menu a[aria-current=page]{background:#fceced;color:#bd1d28}
.nav .btn{white-space:nowrap}
.wow-categories{padding:clamp(74px,9vw,124px) 0 110px;background:#fff;position:relative;isolation:isolate}
.wow-heading{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(220px,.6fr);gap:35px;align-items:end;margin-bottom:34px}
.wow-kicker{font-size:11px;font-weight:800;letter-spacing:.18em;color:#cf2430;margin:0 0 17px}
.wow-heading h2{font-weight:800;font-size:clamp(44px,6.6vw,94px);letter-spacing:-.07em;line-height:.98;margin:0;max-width:920px}
.wow-heading h2 em{font-style:normal;color:#d72530}
.wow-heading>p{max-width:330px;color:#666;font-size:15px;line-height:1.7;margin:0 0 5px}
.wow-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.wow-category{display:flex;position:relative;flex-direction:column;justify-content:space-between;min-height:280px;overflow:hidden;padding:22px;background:#f0efec;color:#181818;border:1px solid #e8e7e3;transition:transform .32s cubic-bezier(.2,.8,.2,1),background .25s,border-color .25s;isolation:isolate}
.wow-category--1,.wow-category--2{grid-column:span 2;min-height:455px}
.wow-category--1{background:#e8ded8}.wow-category--2{background:#e8e9e6}
.wow-category--4,.wow-category--7{background:#f6eae8}
.wow-number{position:relative;z-index:3;font-weight:700;letter-spacing:.13em;font-size:10px;color:#716d69}
.wow-product-art{position:absolute;z-index:0;object-fit:contain;width:60%;height:67%;top:10%;right:-4%;filter:drop-shadow(12px 21px 12px rgba(0,0,0,.14));transform:rotate(-12deg);transition:transform .48s cubic-bezier(.2,.8,.2,1)}
.wow-category--1 .wow-product-art,.wow-category--2 .wow-product-art{width:52%;height:76%;top:3%;right:7%}
.wow-category--2 .wow-product-art{transform:rotate(10deg)}
.wow-card-copy{position:relative;z-index:2;padding:8px 0 0;max-width:70%;margin-top:auto}
.wow-category--1 .wow-card-copy,.wow-category--2 .wow-card-copy{max-width:52%}
.wow-card-copy h3{font-size:clamp(19px,2vw,29px);line-height:1.09;letter-spacing:-.045em;margin:0 0 9px}
.wow-category--1 h3,.wow-category--2 h3{font-size:clamp(29px,3.3vw,49px)}
.wow-card-copy p{font-size:12px;line-height:1.45;color:#65625f;margin:0}
.wow-arrow{position:absolute;z-index:2;right:21px;bottom:18px;font-size:23px;font-weight:500;transition:transform .25s;color:#cb2630}
.wow-category:hover,.wow-category:focus-visible{transform:translateY(-5px);border-color:#cfc9c3;background:#e7e1dc;outline-offset:3px}
.wow-category:hover .wow-product-art,.wow-category:focus-visible .wow-product-art{transform:translate(-7px,-8px) rotate(-5deg) scale(1.07)}
.wow-category--2:hover .wow-product-art{transform:translate(-7px,-8px) rotate(5deg) scale(1.07)}
.wow-category:hover .wow-arrow{transform:translate(4px,-4px)}
.sara-footer{background:#212121;color:white;padding:0!important;margin:0;position:relative}
.sara-footer .container{width:min(1320px,calc(100% - 40px))}
.sara-footer-top{display:flex;justify-content:space-between;align-items:end;gap:30px;padding:65px 0 45px;border-bottom:1px solid #444}
.sara-footer-title{max-width:710px}
.sara-footer-title span{font-size:11px;letter-spacing:.16em;color:#aaa;font-weight:700}
.sara-footer-title h2{font-weight:800;font-size:clamp(31px,4.7vw,66px);line-height:1.05;letter-spacing:-.05em;margin:12px 0 0;color:#fff}
.sara-footer-call{display:inline-flex;align-items:center;justify-content:center;background:#d72530;color:white!important;border-radius:999px;padding:15px 22px;white-space:nowrap;font-size:14px;font-weight:700;transition:transform .2s,background .2s}
.sara-footer-call:hover{background:#b91e27;transform:translateY(-3px)}
.sara-footer-columns{display:grid;grid-template-columns:1.1fr 1.2fr .8fr;gap:clamp(30px,6vw,90px);padding:50px 0 65px}
.sara-footer-about img{width:min(210px,75%);height:auto;filter:brightness(0) invert(1);margin-bottom:24px}
.sara-footer-about p{max-width:290px;color:#bfbfbf;font-size:14px;line-height:1.75}
.sara-footer-links{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.sara-footer-links h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#fff;margin:0 0 8px}
.sara-footer-links h3:not(:first-child){margin-top:22px}
.sara-footer-links a,.sara-footer-links p{font-size:14px;line-height:1.5;color:#bdbdbd;margin:0;transition:color .2s}
.sara-footer-links a:hover{color:#fff}
.sara-footer-bottom{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #444;padding:22px 0 28px;font-size:12px;color:#999}
.sara-footer-bottom a{color:#ccc}
.sara-footer-bottom a:hover{color:white}
@media(max-width:1150px){.nav-links{gap:12px}.nav-links>a,.category-nav summary{font-size:12px}.nav-brand-logo{width:112px}}
@media(max-width:900px){.nav-links{gap:0}.nav.open .nav-links{gap:6px;border-radius:8px}.nav-links>a,.category-nav summary{font-size:15px;padding:9px 5px}.category-nav{width:100%}.category-nav-menu{position:static;box-shadow:none;max-height:320px;border:0;border-left:2px solid #e7e7e7;margin:4px 0 8px 6px}.wow-heading{grid-template-columns:1fr;gap:18px}.wow-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wow-category--1,.wow-category--2{min-height:385px}.sara-footer-columns{grid-template-columns:repeat(2,minmax(0,1fr))}.sara-footer-about{grid-column:span 2}.sara-footer-top{padding-top:46px}}
@media(max-width:600px){.wow-categories{padding:70px 0}.wow-heading h2{font-size:clamp(44px,12vw,68px)}.wow-grid{gap:9px}.wow-category{min-height:235px;padding:14px}.wow-category--1,.wow-category--2{grid-column:span 2;min-height:350px}.wow-product-art{width:73%;height:64%;right:-11%;top:5%}.wow-category--1 .wow-product-art,.wow-category--2 .wow-product-art{width:53%;height:79%;right:4%}.wow-card-copy{max-width:82%}.wow-card-copy h3{font-size:18px}.wow-category--1 h3,.wow-category--2 h3{font-size:clamp(26px,8vw,38px)}.wow-card-copy p{font-size:11px}.wow-category--1 .wow-card-copy,.wow-category--2 .wow-card-copy{max-width:55%}.wow-arrow{right:10px;bottom:10px;font-size:19px}.sara-footer .container{width:calc(100% - 32px)}.sara-footer-top{display:block}.sara-footer-call{margin-top:26px}.sara-footer-columns{grid-template-columns:1fr;gap:35px;padding:35px 0 42px}.sara-footer-about{grid-column:auto}.sara-footer-bottom{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.wow-category,.wow-product-art,.wow-arrow,.sara-footer-call{transition:none!important}.wow-category:hover{transform:none}.wow-category:hover .wow-product-art{transform:none}}

/* Polished dropdown chevron: same on every category page and mobile */
.category-nav summary .category-nav-chevron{display:block;width:17px;height:17px;flex:none;color:#444;transition:transform .22s ease,color .22s ease;transform-origin:center}
.category-nav[open] summary .category-nav-chevron{transform:rotate(180deg);color:#d72530}
.category-nav summary:hover .category-nav-chevron{color:#d72530}
@media(prefers-reduced-motion:reduce){.category-nav summary .category-nav-chevron{transition:none}}
