/* Autoservis Barbarić — styles */

/* ===== Fonts (self-hosted, SIL Open Font License) ===== */
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/barlow-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/barlow-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/barlow-condensed-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/barlow-condensed-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/barlow-condensed-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/barlow-condensed-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ===== Tokens ===== */
:root {
  --color-bg: #16171a;
  --color-surface: #1d1e22;
  --color-text: #ecebe8;
  --color-accent: #c8201e;
  --color-divider: rgba(236,235,232,.13);

  --color-accent-100: #fdecea;
  --color-accent-200: #f9cdc9;
  --color-accent-300: #f3a19a;
  --color-accent-400: #ea6a62;
  --color-accent-500: #d8342e;
  --color-accent-600: #b01b19;
  --color-accent-700: #8a1513;
  --color-accent-800: #5e100f;
  --color-accent-900: #3a0c0b;

  --font-heading: "Barlow Condensed", system-ui, sans-serif;
  --font-heading-weight: 600;
  --font-body: "Barlow", system-ui, sans-serif;

  --space-2: 6.8px;
  --space-3: 10.2px;
}

/* ===== Base ===== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body {
  margin: 0; font-family: var(--font-body); font-size: 15px; line-height: 1.55; font-weight: 400;
  background: var(--color-bg); color: var(--color-text);
  scroll-behavior: smooth; scroll-padding-top: 84px;
  scrollbar-gutter: stable; -webkit-font-smoothing: antialiased;
  -webkit-user-select: none; user-select: none; overflow-x: hidden;
}
h1, h2, h3 {
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  line-height: 1.12; letter-spacing: -0.015em; margin: 0 0 var(--space-2);
}
h1 { font-size: 42px; }
h2 { font-size: 32px; }
h3 { font-size: 25px; }
p { margin: 0 0 var(--space-3); }
a { color: var(--color-accent-400); text-underline-offset: 3px; }
a:hover { color: #ffffff; }
img { display: block; max-width: 100%; -webkit-user-drag: none; user-drag: none; }
figure { margin: 0; }
section[id] { scroll-margin-top: 84px; }
input, textarea, select, [contenteditable], a[href^="tel:"], address { -webkit-user-select: text; user-select: text; }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
::selection { background: rgba(200,32,30,.45); color: #fff; }

@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(234,106,98,.7)}100%{box-shadow:0 0 0 12px rgba(234,106,98,0)}}
@keyframes glowPulse{0%,100%{opacity:.45;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ===== Components ===== */
.blueprint { position: relative; border: 1px solid var(--color-divider); border-radius: 0; }
.blueprint > .corner {
  position: absolute; width: 11px; height: 11px;
  color: color-mix(in srgb, var(--color-text) 55%, transparent);
}
.blueprint > .corner::before, .blueprint > .corner::after { content: ""; position: absolute; background: currentColor; }
.blueprint > .corner::before { left: 5px; top: 0; width: 1px; height: 100%; }
.blueprint > .corner::after  { top: 5px; left: 0; width: 100%; height: 1px; }
.blueprint > .corner.tl { top: -6px; left: -6px; }
.blueprint > .corner.tr { top: -6px; right: -6px; }
.blueprint > .corner.bl { bottom: -6px; left: -6px; }
.blueprint > .corner.br { bottom: -6px; right: -6px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  cursor: pointer; text-decoration: none;
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  font-size: 14px; line-height: 1.2; color: var(--color-text);
  background: transparent; border: 1px solid var(--color-divider); border-radius: 0;
  padding: var(--space-2) calc(var(--space-3) * 1.2);
}
.btn svg { display: block; }
.btn-primary { background: var(--color-accent); color: var(--color-bg); border-color: var(--color-accent); }
.btn-primary:hover { background: var(--color-accent-600); }
.btn-primary:active { background: var(--color-accent-700); }
.btn-secondary:hover { background: color-mix(in srgb, var(--color-text) 7%, transparent); }
.btn-secondary:active { background: color-mix(in srgb, var(--color-text) 14%, transparent); }

/* ===== Site ===== */
#site .s1{position:sticky;top:0;z-index:50;background:rgba(22,23,26,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--color-divider);}
#site .s2{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,48px);height:76px;display:flex;align-items:center;gap:clamp(10px,2.4vw,32px);}
#site .s3{display:flex;align-items:center;margin-right:auto;}
#site .s4{height:52px;width:auto;display:block;}
#site .s5{display:flex;gap:4px;}
#site .s6{color:var(--color-text);text-decoration:none;font-family:var(--font-heading);font-size:17px;letter-spacing:.02em;padding:10px 14px;transition:color .2s;}
#site .s15{width:46px;height:46px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:transparent;border:1px solid var(--color-divider);cursor:pointer;padding:0;}
#site .s16{display:block;width:20px;height:1.5px;background:var(--color-text);transition:transform .35s cubic-bezier(.2,.7,.2,1);transform:none;}
#site .s17{display:block;width:20px;height:1.5px;background:var(--color-text);transition:opacity .2s;opacity:1;}
#site .s18{position:fixed;left:0;right:0;top:77px;bottom:0;z-index:49;background:var(--color-bg);padding:28px clamp(20px,4vw,48px);display:flex;flex-direction:column;gap:6px;transition:opacity .35s ease, transform .35s cubic-bezier(.2,.7,.2,1);opacity:0;transform:translateY(-12px);overflow-y:auto;}
#site .s19{font-family:var(--font-heading);font-size:44px;color:var(--color-text);text-decoration:none;padding:6px 0;border-bottom:1px solid var(--color-divider);}
#site .s20{display:flex;flex-direction:column;gap:14px;margin-top:28px;}
#site .s21{color:var(--color-text);text-decoration:none;font-size:17px;}
#site .s22{color:var(--color-accent-400);}
#site .s23{position:relative;z-index:3;}
#site .s24{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
#site .s25{position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 60% at 50% 45%,rgba(200,32,30,.16) 0%,rgba(200,32,30,0) 70%),radial-gradient(80% 50% at 70% 100%,rgba(236,235,232,.05) 0%,rgba(236,235,232,0) 70%),linear-gradient(180deg,#16171a 0%,#121315 100%);}
#site .s26{position:absolute;left:0;right:0;bottom:0;height:45%;pointer-events:none;background-image:linear-gradient(rgba(236,235,232,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(236,235,232,.045) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(to top,#000 0%,transparent 100%);mask-image:linear-gradient(to top,#000 0%,transparent 100%);}
#site .s27{position:relative;max-width:1320px;margin:0 auto;padding:clamp(32px,5vw,72px) clamp(20px,4vw,48px) 0;}
#site .s28{display:flex;flex-direction:column;align-items:center;text-align:center;gap:28px;padding:clamp(24px,5vw,72px) 0 clamp(8px,2vw,24px);position:relative;z-index:2;}
#site .s29{margin:0;display:flex;align-items:center;gap:12px;font-size:15px;color:rgba(236,235,232,.72);}
#site .s30{width:9px;height:9px;border-radius:50%;background:var(--color-accent-400);animation:pulse 1.8s ease-out infinite;flex:none;}
#site .s31{margin:0;font-size:clamp(58px,8.4vw,128px);line-height:.86;letter-spacing:-.01em;text-transform:uppercase;font-weight:600;}
#site .s32{display:block;overflow:hidden;padding-bottom:.04em;}
#site .s33{display:block;}
#site .s34{display:block;color:var(--color-accent-500);}
#site .s35{margin:0;font-family:var(--font-heading);font-size:clamp(22px,2.3vw,30px);line-height:1.22;max-width:30ch;text-wrap:pretty;}
#site .s36{margin:0;font-size:17px;line-height:1.65;color:rgba(236,235,232,.74);max-width:52ch;text-wrap:pretty;}
#site .s37{display:flex;flex-wrap:wrap;gap:10px;width:100%;max-width:600px;margin-top:6px;text-align:left;}
#site .s38{flex:1 1 220px;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px;padding:12px 18px;text-decoration:none;color:#fff;background:rgba(22,23,26,.72);border:1px solid rgba(236,235,232,.16);transition:border-color .25s,background .25s,transform .25s;}
#site .s39{display:flex;flex-direction:column;gap:2px;}
#site .s40{font-size:13px;color:rgba(236,235,232,.7);}
#site .s41{font-family:var(--font-heading);font-weight:600;font-size:clamp(22px,2.2vw,28px);line-height:1.05;letter-spacing:.01em;}
#site .s42{flex:none;}
#site .s43{color:var(--color-text);font-size:18px;padding:15px 26px;gap:12px;background:linear-gradient(#c8201e,#c8201e) no-repeat 50% 100% / 100% 0%;border-color:rgba(236,235,232,.28);transition:background-size .45s cubic-bezier(.2,.7,.2,1),border-color .3s,transform .3s,box-shadow .3s,letter-spacing .3s;}
#site .s44{margin-top:clamp(32px,5vw,56px);height:18px;background-image:repeating-linear-gradient(90deg,rgba(236,235,232,.34) 0 1px,transparent 1px 80px),repeating-linear-gradient(90deg,rgba(236,235,232,.16) 0 1px,transparent 1px 10px);background-size:100% 18px,100% 8px;background-repeat:repeat-x;}
#site .s45{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,48px);}
#site .s46{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:1px;background:var(--color-divider);border:1px solid var(--color-divider);border-top:0;}
#site .s47{background:var(--color-bg);padding:32px 28px;display:flex;flex-direction:column;gap:6px;}
#site .s48{font-family:var(--font-heading);font-weight:600;font-size:clamp(52px,5vw,72px);line-height:1;}
#site .s49{font-size:16px;color:rgba(236,235,232,.72);}
#site .s50{margin-top:6px;display:inline-flex;align-items:center;gap:6px;font-size:15px;color:var(--color-accent-400);text-decoration:none;align-self:flex-start;border-bottom:1px solid rgba(234,106,98,.4);padding-bottom:2px;transition:color .2s,border-color .2s;}
#site .s51{max-width:1320px;margin:0 auto;padding:clamp(80px,11vw,150px) clamp(20px,4vw,48px) 0;}
#site .s52{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:24px 64px;align-items:end;margin-bottom:clamp(36px,5vw,56px);}
#site .s53{margin:0;font-size:clamp(44px,6vw,84px);line-height:.92;text-transform:uppercase;}
#site .s54{margin:0;font-size:17px;line-height:1.65;color:rgba(236,235,232,.74);max-width:56ch;text-wrap:pretty;}
#site .s55{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1px;background:var(--color-divider);border:1px solid var(--color-divider);}
#site .s56{display:flex;background:var(--color-bg);}
#site .s57{position:relative;overflow:hidden;flex:1;padding:clamp(28px,3vw,40px);display:flex;flex-direction:column;gap:14px;min-height:240px;background:var(--color-bg);transition:background .45s cubic-bezier(.2,.7,.2,1);}
#site .s58{position:absolute;left:0;bottom:0;height:2px;width:100%;background:#c8201e;transform-origin:left;transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.7,.2,1);}
#site .s59{position:absolute;top:clamp(28px,3vw,40px);right:clamp(28px,3vw,40px);font-family:var(--font-heading);font-size:14px;letter-spacing:.14em;color:rgba(236,235,232,.3);transition:color .4s;}
#site .s60{width:52px;height:52px;display:grid;place-items:center;border:1px solid rgba(234,106,98,.45);background:transparent;color:var(--color-accent-400);margin-bottom:18px;transform:none;transition:background .4s cubic-bezier(.2,.7,.2,1),border-color .4s,color .4s,transform .6s cubic-bezier(.2,.7,.2,1);}
#site .s61{margin:0;font-size:28px;line-height:1.05;transform:none;transition:transform .5s cubic-bezier(.2,.7,.2,1);}
#site .s62{margin:0;font-size:16px;line-height:1.6;color:rgba(236,235,232,.72);text-wrap:pretty;transform:none;transition:transform .5s cubic-bezier(.2,.7,.2,1) .04s,color .4s;}
#site .s63{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px 40px;margin-bottom:clamp(32px,4vw,48px);}
#site .s64{display:flex;flex-direction:column;gap:14px;max-width:640px;}
#site .s65{margin:0;font-size:17px;line-height:1.65;color:rgba(236,235,232,.74);text-wrap:pretty;}
#site .s66{color:var(--color-text);font-size:17px;padding:14px 22px;gap:10px;}
#site .s67{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(20px,2.4vw,32px);}
#site .s68{display:flex;flex-direction:column;gap:14px;text-decoration:none;color:var(--color-text);}
#site .s69{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--color-surface);}
#site .s70{width:100%;height:100%;object-fit:cover;filter:saturate(.7);transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .6s;}
#site .s71{display:flex;flex-direction:column;gap:4px;}
#site .s72{font-family:var(--font-heading);font-size:22px;line-height:1.1;}
#site .s73{font-size:15px;line-height:1.5;color:rgba(236,235,232,.7);}
#site .s74{position:relative;overflow:hidden;border:1px solid var(--color-divider);background:#1a1b1e;}
#site .s75{position:absolute;width:18px;height:18px;top:-1px;left:-1px;border-top:1px solid rgba(234,106,98,.75);border-left:1px solid rgba(234,106,98,.75);}
#site .s76{position:absolute;width:18px;height:18px;top:-1px;right:-1px;border-top:1px solid rgba(234,106,98,.75);border-right:1px solid rgba(234,106,98,.75);}
#site .s77{position:absolute;width:18px;height:18px;bottom:-1px;left:-1px;border-bottom:1px solid rgba(234,106,98,.75);border-left:1px solid rgba(234,106,98,.75);}
#site .s78{position:absolute;width:18px;height:18px;bottom:-1px;right:-1px;border-bottom:1px solid rgba(234,106,98,.75);border-right:1px solid rgba(234,106,98,.75);}
#site .s79{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(236,235,232,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(236,235,232,.035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:linear-gradient(to left,#000 0%,transparent 70%);mask-image:linear-gradient(to left,#000 0%,transparent 70%);}
#site .s80{position:absolute;inset:0;pointer-events:none;transform-origin:0% 100%;background:radial-gradient(55% 80% at 0% 100%,rgba(200,32,30,.3) 0%,rgba(200,32,30,0) 70%);animation:glowPulse 3.2s ease-in-out infinite;}
#site .s81{position:relative;padding:clamp(40px,6vw,80px) clamp(24px,5vw,72px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:36px 64px;align-items:center;}
#site .s82{display:flex;flex-direction:column;gap:20px;}
#site .s83{margin:0;font-size:clamp(56px,8vw,120px);line-height:.84;text-transform:uppercase;color:#fff;}
#site .s84{margin:0;font-size:18px;line-height:1.6;max-width:42ch;color:rgba(236,235,232,.74);text-wrap:pretty;}
#site .s85{display:flex;flex-direction:column;gap:10px;width:100%;max-width:460px;justify-self:center;}
#site .s86{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px;padding:16px 20px;text-decoration:none;color:#fff;background:var(--color-bg);border:1px solid var(--color-divider);transition:border-color .25s,background .25s,transform .25s;}
#site .s87{font-size:14px;color:rgba(236,235,232,.7);}
#site .s88{font-family:var(--font-heading);font-weight:600;font-size:clamp(28px,3vw,38px);line-height:1.05;letter-spacing:.01em;}
#site .s89{max-width:1320px;margin:0 auto;padding:clamp(80px,11vw,150px) clamp(20px,4vw,48px);}
#site .s90{margin:0;font-size:17px;line-height:1.65;color:rgba(236,235,232,.74);max-width:52ch;}
#site .s91{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:clamp(32px,4vw,56px);align-items:stretch;}
#site .s92{margin:0;display:grid;grid-template-columns:1fr;gap:1px;background:var(--color-divider);border:1px solid var(--color-divider);align-content:stretch;}
#site .s93{background:var(--color-bg);padding:22px 24px;display:grid;grid-template-columns:28px 1fr;gap:4px 16px;align-content:start;}
#site .s94{grid-row:span 2;margin-top:2px;}
#site .s95{font-size:14px;color:rgba(236,235,232,.6);}
#site .s96{margin:0;display:flex;flex-direction:column;gap:4px;font-size:18px;}
#site .s97{color:var(--color-text);text-decoration:none;}
#site .s99{margin:0;font-size:18px;}
#site .s100{font-style:normal;}
#site .s101{margin:0;font-size:18px;display:flex;flex-direction:column;gap:2px;}
#site .s102{color:rgba(236,235,232,.72);font-size:16px;}
#site .s103{display:flex;flex-direction:column;gap:18px;}
#site .s104{flex:1;min-height:380px;}
#site .s105{display:block;width:100%;height:100%;min-height:380px;border:0;}
#site .s106{display:flex;flex-wrap:wrap;gap:12px;}
#site .s107{position:relative;color:var(--color-text);font-size:17px;padding:14px 22px;gap:10px;background:transparent;border-color:rgba(236,235,232,.28);transition:background .35s ease,border-color .35s ease;}
#site .s108{margin-left:-15px;opacity:0;transform:translate(-6px,6px);transition:margin .4s cubic-bezier(.2,.7,.2,1),opacity .3s ease,transform .4s cubic-bezier(.2,.7,.2,1);}
#site .s109{position:absolute;top:-1px;left:-1px;border-top:1px solid #ea6a62;border-left:1px solid #ea6a62;width:0px;height:0px;opacity:0;transition:width .45s cubic-bezier(.2,.7,.2,1),height .45s cubic-bezier(.2,.7,.2,1),opacity .3s ease;pointer-events:none;}
#site .s110{position:absolute;top:-1px;right:-1px;border-top:1px solid #ea6a62;border-right:1px solid #ea6a62;width:0px;height:0px;opacity:0;transition:width .45s cubic-bezier(.2,.7,.2,1),height .45s cubic-bezier(.2,.7,.2,1),opacity .3s ease;pointer-events:none;}
#site .s111{position:absolute;bottom:-1px;left:-1px;border-bottom:1px solid #ea6a62;border-left:1px solid #ea6a62;width:0px;height:0px;opacity:0;transition:width .45s cubic-bezier(.2,.7,.2,1),height .45s cubic-bezier(.2,.7,.2,1),opacity .3s ease;pointer-events:none;}
#site .s112{position:absolute;bottom:-1px;right:-1px;border-bottom:1px solid #ea6a62;border-right:1px solid #ea6a62;width:0px;height:0px;opacity:0;transition:width .45s cubic-bezier(.2,.7,.2,1),height .45s cubic-bezier(.2,.7,.2,1),opacity .3s ease;pointer-events:none;}
#site .s113{max-width:1320px;margin:0 auto;padding:clamp(48px,8vw,110px) clamp(20px,4vw,48px) clamp(80px,10vw,140px);}
#site .s114{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:24px 64px;align-items:end;margin-bottom:clamp(32px,4vw,48px);}
#site .s115{margin:0;font-size:clamp(56px,8.4vw,124px);line-height:.86;text-transform:uppercase;font-weight:600;}
#site .s116{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(28px,3.5vw,44px);}
#site .s117{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:clamp(28px,3vw,40px) clamp(20px,2.4vw,32px);}
#site .s118{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px 32px;margin:clamp(72px,9vw,120px) 0 clamp(24px,3vw,36px);}
#site .s119{margin:0;font-size:clamp(40px,5vw,68px);line-height:.92;text-transform:uppercase;}
#site .s120{margin:0;font-size:16px;color:rgba(236,235,232,.72);}
#site .s121{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(46%,200px),1fr));gap:clamp(8px,1.2vw,14px);}
#site .s122{position:fixed;inset:0;z-index:100;background:rgba(12,12,14,.94);display:flex;flex-direction:column;opacity:0;transition:opacity .35s ease;}
#site .s123{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(16px,3vw,32px);}
#site .s124{font-size:15px;color:rgba(236,235,232,.7);}
#site .s125{width:46px;height:46px;display:grid;place-items:center;background:transparent;border:1px solid var(--color-divider);color:var(--color-text);cursor:pointer;transition:border-color .2s;}
#site .s126{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:clamp(8px,2vw,24px);padding:0 clamp(8px,2vw,24px);}
#site .s127{flex:none;width:48px;height:48px;display:grid;place-items:center;background:rgba(22,23,26,.7);border:1px solid var(--color-divider);color:var(--color-text);cursor:pointer;visibility:visible;transition:border-color .2s,background .2s;}
#site .s128{margin:0;flex:1;min-width:0;height:100%;display:flex;align-items:center;justify-content:center;}
#site .s129{padding:18px clamp(16px,3vw,32px) 28px;text-align:center;display:flex;flex-direction:column;gap:4px;}
#site .s130{font-family:var(--font-heading);font-size:26px;}
#site .s131{font-size:15px;color:rgba(236,235,232,.72);}
#site .s132{position:fixed;inset:0;z-index:200;visibility:hidden;pointer-events:none;display:grid;place-items:center;background:#c8201e;transform-origin:bottom;transform:scaleY(0);transition:none;}
#site .s133{position:absolute;inset:0;background:repeating-linear-gradient(-45deg,rgba(0,0,0,.14) 0 22px,rgba(0,0,0,0) 22px 44px);}
#site .s134{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px;opacity:0;transform:translateY(16px);transition:opacity .3s ease,transform .5s cubic-bezier(.2,.7,.2,1);}
#site .s135{height:55px;width:56px;display:block;}
#site .s136{font-family:var(--font-heading);font-weight:600;font-size:clamp(28px,4vw,44px);line-height:1;letter-spacing:.06em;text-transform:uppercase;color:#fff;}
#site .s137{border-top:1px solid var(--color-divider);background:#121315;}
#site .s138{max-width:1320px;margin:0 auto;padding:clamp(56px,7vw,88px) clamp(20px,4vw,48px) 32px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:40px;}
#site .s139{display:flex;flex-direction:column;gap:18px;grid-column:span 1;min-width:0;}
#site .s140{height:72px;width:auto;display:block;}
#site .s141{margin:0;font-size:15px;line-height:1.6;color:rgba(236,235,232,.66);max-width:34ch;}
#site .s142{display:flex;gap:10px;}
#site .s143{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-heading);font-size:16px;padding:10px 16px;text-decoration:none;color:var(--color-text);border:1px solid rgba(234,106,98,.55);background:rgba(200,32,30,.08);transition:background .25s,border-color .25s,color .25s;}
#site .s144{display:flex;flex-direction:column;gap:12px;}
#site .s145{margin:0 0 6px;font-size:20px;}
#site .s146{color:rgba(236,235,232,.72);text-decoration:none;font-size:15px;}
#site .s148{margin:0;font-size:15px;line-height:1.6;color:rgba(236,235,232,.72);}
#site .s149{max-width:1320px;margin:0 auto;padding:22px clamp(20px,4vw,48px) 28px;border-top:1px solid var(--color-divider);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;}
#site .s150{margin:0;font-size:14px;color:rgba(236,235,232,.6);}
#site .s151{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:rgba(236,235,232,.6);text-decoration:none;transition:color .2s;}
#site .s6:hover{color:var(--color-accent-400);}
#site .s38:hover{border-color:rgba(234,106,98,.7);background:rgba(200,32,30,.14);color:#fff;transform:translateY(-2px);}
#site .s43:hover{color:#fff;background-size:100% 100%;border-color:#c8201e;transform:translateY(-2px);box-shadow:0 14px 34px rgba(200,32,30,.35);letter-spacing:.03em;}
#site .s50:hover{color:#fff;border-color:#fff;}
#site .s66:hover{border-color:rgba(236,235,232,.4);color:var(--color-text);}
#site .s70:hover{transform:scale(1.05);filter:saturate(1);}
#site .s86:hover{border-color:rgba(234,106,98,.7);background:rgba(200,32,30,.14);color:#fff;transform:translateY(-2px);}
#site .s97:hover{color:var(--color-accent-400);}
#site .s125:hover{border-color:rgba(236,235,232,.5);}
#site .s127:hover{border-color:var(--color-accent);background:rgba(200,32,30,.2);}
#site .s143:hover{background:var(--color-accent);border-color:var(--color-accent);color:#ffffff;}
#site .s146:hover{color:var(--color-accent-400);}
#site .s151:hover{color:#ffffff;}
#site .s107:active{transform:scale(.98);}

/* States */
#site [hidden]{display:none!important}
@media (max-width:1023px){#site .hide-m{display:none}}
@media (min-width:1024px){#site .show-m{display:none}}
#site.menu-open .bar1{transform:translateY(7.5px) rotate(45deg)}
#site.menu-open .bar2{opacity:0}
#site.menu-open .bar3{transform:translateY(-7.5px) rotate(-45deg)}
#site #mnav.open{opacity:1;transform:none}

/* Service cards */
#site .svc:hover{background:#1c1d21}
#site .svc:hover .svc-bar{transform:scaleX(1)}
#site .svc:hover .svc-num{color:#ea6a62}
#site .svc:hover .svc-ic{border-color:#c8201e;background:#c8201e;color:#fff;transform:translateY(-4px) rotate(-6deg)}
#site .svc:hover .svc-t{transform:translateX(6px)}
#site .svc:hover .svc-p{transform:translateX(6px);color:rgba(236,235,232,.9)}

/* Map buttons */
#site .mapbtn:hover{background:rgba(200,32,30,.1);border-color:rgba(234,106,98,.55)}
#site .mapbtn:hover > span{width:12px;height:12px;opacity:1}
#site .mapbtn:hover > svg{margin-left:2px;opacity:1;transform:none}

/* Gallery: brand filter */
#site .gb{font-family:var(--font-heading);font-size:16px;padding:9px 16px;cursor:pointer;border:1px solid var(--color-divider);background:transparent;color:var(--color-text);transition:background .25s,border-color .25s,color .25s}
#site .gb:hover{border-color:rgba(236,235,232,.45)}
#site .gb.on{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}

/* Gallery: job cards */
#site .job{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:14px;width:100%;transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
#site .job-frame{display:block}
#site .job-media{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--color-surface);position:relative}
#site .job-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.7);transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .6s}
#site .job-media img:hover{transform:scale(1.05);filter:saturate(1)}
#site .job-count{position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:rgba(22,23,26,.82);font-size:13px;color:var(--color-text)}
#site .job-text{display:flex;flex-direction:column;gap:4px}
#site .job-title{font-family:var(--font-heading);font-size:22px;line-height:1.1;color:var(--color-text)}
#site .job-work{font-size:15px;line-height:1.5;color:rgba(236,235,232,.7)}

/* Gallery: workshop grid */
#site .shop-btn{all:unset;cursor:pointer;display:block;width:100%;aspect-ratio:1;overflow:hidden;background:var(--color-surface);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
#site .shop-btn img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.7);transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .6s}
#site .shop-btn img:hover{transform:scale(1.06);filter:saturate(1)}

/* Keyboard focus for gallery buttons (all:unset removes the default ring) */
#site .job:focus-visible,#site .shop-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}

/* Lightbox image */
#site .lb-img{max-width:100%;max-height:calc(100vh - 220px);object-fit:contain;display:block;opacity:0;transform:scale(.97);transition:opacity .3s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
#site .lb-img.in{opacity:1;transform:scale(1)}