:root {
  --ink:#101c23;
  --paper:#fff;
  --soft:#f2f4f2;
  --muted:#485760;
  --line:#dbe2df;
  --gold:#f7bd43;
  --header-height:78px;
  font-family: "Segoe UI", Arial, sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-synthesis:none;
}
*, *::before, *::after { box-sizing:border-box; }
html { scroll-padding-top:calc(var(--header-height) + 1rem); }
body { margin:0; padding-top:var(--header-height); }
[hidden] { display:none !important; }
a { color:inherit; }
img { display:block; max-width:100%; }
button, input, select, textarea { font:inherit; }
button, select { cursor:pointer; }
:focus-visible { outline:3px solid #c88105; outline-offset:5px; }
.skip { position:fixed; z-index:12; top:.5rem; left:.5rem; transform:translateY(-160%); background:var(--gold); padding:.8rem 1rem; }
.skip:focus { transform:none; }
.wrap { width:min(100% - 3rem, 1200px); margin-inline:auto; }
.header { background:white; position:fixed; inset:0 0 auto; z-index:10; box-shadow:0 1px 0 #101c231a; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:var(--header-height); }
.brand { display:inline-flex; align-items:center; gap:.7rem; text-decoration:none; font-weight:800; font-size:.87rem; letter-spacing:.025em; line-height:1.1; flex-shrink:0; }
.brand svg { width:43px; height:43px; flex-shrink:0; }
.brand small { display:block; font-weight:700; letter-spacing:.17em; margin-top:.3rem; font-size:.65rem; }
.topbar nav { display:flex; align-items:center; gap:clamp(1rem, 2.45vw, 2.2rem); }
.topbar nav a, .nav-quote { text-decoration:none; font-size:.9rem; font-weight:650; white-space:nowrap; }
.topbar nav a { padding:.65rem 0; border-bottom:2px solid transparent; }
.topbar nav a:hover, .topbar nav a[aria-current] { border-bottom-color:#b87500; }
.topbar .nav-quote { min-height:42px; font-size:.86rem; }

.menu-toggle { display:none; background:var(--soft); color:var(--ink); border:1px solid var(--line); padding:.6rem .75rem; }
h1, h2, h3, p { margin-top:0; }
h1, h2 { letter-spacing:-.052em; }
h1 { font-size:clamp(2.6rem, 6.5vw, 6.1rem); line-height:.99; max-width:18ch; margin-bottom:1.35rem; }
h2 { font-size:clamp(2rem, 4vw, 3.45rem); line-height:1.04; margin-bottom:0; max-width:18ch; }
h3 { font-size:1.06rem; margin-bottom:.35rem; }
.actions { display:flex; gap:.75rem; flex-wrap:wrap; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:.7rem; min-height:48px; padding:.55rem .6rem .55rem 1.15rem; border-radius:999px; background:var(--ink); color:white; border:1px solid transparent; text-decoration:none; font-weight:700; line-height:1.2; }
.button:hover { background:#324750; }
.section { padding-block:clamp(3rem, 7vw, 6.25rem); border-top:1px solid var(--line); }
.section-content { min-width:0; color:var(--muted); font-size:1.075rem; line-height:1.65; }
.section-content > :last-child { margin-bottom:0; }
.section-content h3, .section-content strong { color:var(--ink); }
.soft { background:var(--soft); }
.dark { background:var(--ink); color:white; border-color:var(--ink); }
.dark .section-content { color:#dde5e5; }
.text-link { display:inline-flex; align-items:center; gap:.5rem; font-weight:750; color:var(--ink); text-underline-offset:.22em; }
.dark .text-link { color:var(--gold); }
.facts { display:grid; grid-template-columns:repeat(3, 1fr); gap:1rem; margin-top:1.7rem; border-top:1px solid var(--line); padding-top:1rem; }
.facts strong { display:block; font-size:clamp(1.2rem, 2.65vw, 2.1rem); line-height:1.2; letter-spacing:-.045em; }
.facts span { display:block; font-size:.85rem; margin-top:.3rem; }
.index { border-top:1px solid #c6d0cc; }
.index a { display:grid; grid-template-columns:minmax(85px, 25%) 1fr 1.25rem; align-items:center; gap:clamp(.65rem, 2vw, 1.25rem); padding:.65rem .2rem; text-decoration:none; border-bottom:1px solid #c6d0cc; }
.index a:hover { background:#f7bd4329; }
.index a span { font-weight:700; color:#754900; font-size:.85rem; }
.index a span:last-child { justify-self:end; }
.cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.4rem; }
.cards article { border-top:1px solid #c6d0cc; padding:.85rem 0 0; }
.cards p { font-size:.95rem; margin-bottom:.35rem; }
.feature { width:100%; aspect-ratio:16/8; object-fit:cover; margin-bottom:1.3rem; background:#334650; }
.checks { padding-left:1.2rem; }
.checks li { margin-bottom:.35rem; }
aside { border-left:3px solid #a96a08; padding:.6rem 0 .6rem 1rem; margin:1.25rem 0; }
aside p { margin:0; }
.roster { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.3rem; margin-top:2rem; }
.roster article { border:1px solid var(--line); background:var(--soft); }
.portrait { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; object-position:center 27%; background:#cfd8d5; }
.portrait.victor { object-position:center 72%; }
.portrait.marty, .portrait.martin { object-fit:contain; object-position:center; background:#202e34; }
.roster article div { padding:1rem; }
.roster h3 { margin:0; }
.roster p { margin:.3rem 0 0; color:var(--muted); font-size:.9rem; }
address { margin-bottom:1rem; font-style:normal; }
footer { color:#eef2ef; background:#0b151a; }
footer .brand svg { color:#253641; }
.footer-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2rem; padding-block:3rem; }
.footer-grid p { margin:.9rem 0 0; color:#b9c7c9; line-height:1.65; font-size:.9rem; }
.footer-grid nav, .footer-contact { display:flex; align-content:flex-start; align-items:flex-start; gap:.5rem 1rem; flex-wrap:wrap; }
.footer-contact { flex-direction:column; overflow-wrap:anywhere; }
.footer-grid nav a, .footer-contact a { text-decoration:none; font-size:.9rem; }
.footer-grid nav a:hover, .footer-contact a:hover { text-decoration:underline; }
.footer-bottom { border-top:1px solid #37474c; padding-block:1.1rem; color:#b9c7c9; font-size:.8rem; }
@media (max-width:850px) {
  .topbar .nav-quote { display:none; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:640px) {
  .wrap { width:calc(100% - 2rem); }
  .menu-toggle { display:block; }
  :root { --header-height:66px; }
  .topbar { position:relative; }
  .topbar nav { position:absolute; inset:100% 0 auto; background:white; padding:.55rem 1rem; box-shadow:0 8px 24px #101c2326; flex-wrap:wrap; gap:.25rem 1.15rem; }
  .topbar .menu-toggle[aria-expanded="false"]:not([hidden]) + nav { display:none; }
  .roster { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
  .roster article div { padding:.65rem; }
  .footer-grid { grid-template-columns:1fr; gap:1.3rem; }
}
@media (max-width:380px) {
  .facts { gap:.5rem; }
}


.button > span { display:grid; place-items:center; flex:none; width:1.8rem; height:1.8rem; border-radius:50%; background:#ffffff26; }
.index .feature { margin:0; aspect-ratio:4/3; border-radius:.35rem; }
.roster + .button { margin-top:1.4rem; }
.office-map { display:block; width:100%; min-height:340px; margin-top:1.2rem; border:1px solid var(--line); border-radius:.5rem; }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1.5rem; }
footer { padding-bottom:4.5rem; }
.chat-widget { position:fixed; right:max(1rem, env(safe-area-inset-right)); bottom:max(1rem, env(safe-area-inset-bottom)); z-index:9; max-width:calc(100% - 2rem); margin:0; padding:0; border:0; }
.chat-widget summary { display:flex; align-items:center; gap:.45rem; cursor:pointer; background:#115742; color:white; border-radius:999px; padding:.6rem .9rem; min-height:46px; font-size:.88rem; font-weight:700; box-shadow:0 5px 18px #101c2338; }
.chat-widget summary::-webkit-details-marker { display:none; }
.chat-widget summary::after { content:"+"; font-size:1.1rem; }
.chat-widget [open] summary::after { content:"−"; }
.chat-widget summary svg { width:1.45rem; height:1.45rem; }
.chat-panel { position:absolute; bottom:calc(100% + .65rem); right:0; width:min(300px, calc(100vw - 2rem)); padding:1.1rem; color:var(--ink); background:white; border:1px solid var(--line); border-radius:.65rem; box-shadow:0 10px 32px #101c2333; }
.chat-panel p { margin:.5rem 0 1rem; color:var(--muted); line-height:1.45; }
@media (prefers-reduced-motion: no-preference) {
  [data-reveal].reveal-pending { opacity:0; transform:translateY(18px); }
  [data-reveal].reveal-visible { animation:section-reveal .55s ease-out both; }
  @keyframes section-reveal {
    from { opacity:0; transform:translateY(18px); }
    to { opacity:1; transform:translateY(0); }
  }
}
@media (max-width:640px) {
  .office-map { min-height:295px; }
  .roster:has(+ .button) { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .roster:has(+ .button) h3 { font-size:.9rem; overflow-wrap:anywhere; }
}
.gallery-note { margin:.9rem 0 1.5rem; color:var(--muted); }
.gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.gallery a { display:block; background:white; border-radius:.45rem; border:1px solid var(--line); text-decoration:none; overflow:hidden; }
.gallery a > span { display:flex; justify-content:space-between; padding:.75rem; font-weight:700; }
.gallery a:hover > span { text-decoration:underline; }
.gallery .feature { margin:0; aspect-ratio:4/3; }
@media (max-width:640px) {
  .gallery { grid-template-columns:1fr; }
  .gallery .feature { aspect-ratio:16/9; }
}
.section { padding-block:clamp(2.8rem, 5.4vw, 5rem); }
.section-copy h2, .section > .wrap > h2 { max-width:26ch; line-height:1.12; }
.section-copy h2 { margin-bottom:1rem; }
.section-content > p, .section-content > ul, .section-content > aside { max-width:65ch; }
.section-content { line-height:1.7; }
.section-split { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:clamp(2rem,6vw,6rem); }
.section-split > .feature { aspect-ratio:4/3; border-radius:.5rem; margin:0; }
.section-stack .cards { max-width:1040px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.cards h3 { line-height:1.4; }
.index { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; border:0; }
.index a { display:grid; grid-template-columns:1fr auto; align-content:start; gap:.65rem; border:1px solid var(--line); border-radius:.45rem; padding:.7rem; background:white; }
.index .feature { grid-column:1 / -1; aspect-ratio:16/9; }
.service-links { display:flex; flex-wrap:wrap; gap:.65rem; }
.service-links a { padding:.35rem .75rem; border:1px solid var(--line); border-radius:.4rem; text-decoration:none; }
.service-links a:hover { background:var(--soft); text-decoration:underline; }
.contact-alternatives { margin:1rem 0 0; overflow-wrap:anywhere; }
@media (prefers-reduced-motion:no-preference) {
}
@media (prefers-reduced-motion:reduce) {
}
@media (max-width:760px) {
  .section-split { grid-template-columns:1fr; gap:1.4rem; }
  .section-split > .feature { aspect-ratio:16/10; }
  .index, .section-stack .cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:440px) {
  .section-stack .cards { grid-template-columns:1fr; }
  .index a { font-size:.9rem; }
}

/* Vicky Engineering visual identity */
:root {
  --ink:#062B60;
  --gold:#F5B312;
  --blue:#1253A1;
  --paper:#FFFFFF;
  --line:#E9EFF5;
  --muted:#202B38;
  --gold-soft:#FFD66E;
  --soft:#F3F7FC;
  --orange:#EF8513;
}
body { color:var(--muted); }
h1,h2,h3 { color:var(--ink); }
:focus-visible { outline-color:var(--blue); }
.header { box-shadow:0 1px 0 var(--line); }
.brand img { width:clamp(152px, 17vw, 220px); height:62px; object-fit:contain; object-position:left center; }
.topbar nav a:hover,.topbar nav a[aria-current] { border-color:var(--gold); }
.button { background:var(--ink); color:var(--paper); }
.button:hover { background:var(--blue); }
.dark,footer { background:var(--ink); }
.dark h2,.dark .section-content,footer { color:var(--paper); }
.footer-grid .brand { background:var(--paper); border-radius:.4rem; padding:0 .7rem; }
.footer-grid p,.footer-bottom { color:var(--line); }
.index a,.gallery a,.roster article,.review-card { border-color:var(--line); box-shadow:0 4px 16px #062b600d; }
.index a:hover { background:var(--soft); }
.index .feature,.gallery .feature { aspect-ratio:16/10; }
.section-split { align-items:center; }
.section-split > .feature { aspect-ratio:5/4; }
.section-content aside { border-color:var(--orange); }
.text-link { color:var(--blue); }
.dark .text-link { color:var(--gold-soft); }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:1.5rem 0 2rem; }
.product-card { min-width:0; padding:1rem; background:var(--paper); border:1px solid var(--line); border-radius:.55rem; }
.product-card img { width:100%; height:165px; object-fit:contain; background:var(--paper); }
.product-card h3 { margin:.8rem 0 0; line-height:1.3; }
.product-card ul { margin:.65rem 0 0; padding-left:1.15rem; font-size:.93rem; }
.product-card small { display:block; margin-top:.65rem; }
.catalogue-note { margin-top:1rem; }
@media(max-width:760px) { .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:440px) { .product-grid { grid-template-columns:1fr; } .hero-credit { font-size:.62rem; } }
@media(min-width:761px) {
}
.index a:nth-child(2) img,.index a:nth-child(3) img,.index a:nth-child(4) img { object-fit:contain; background:var(--soft); }
.section-split > img[src*="/products/"] { object-fit:contain; background:var(--paper); padding:1rem; }
@media(max-width:980px) { .topbar .nav-quote { display:none; } }


.hero { position:relative; isolation:isolate; display:grid; align-items:center; min-height:clamp(510px,47vw,660px); background:var(--soft); }
.hero-image { position:absolute; inset:0; z-index:-1; width:100%; height:100%; object-fit:cover; }
.hero-inner { padding-block:clamp(2rem,5vw,4rem); }
.hero h1 { font-size:clamp(2.15rem,4.5vw,4rem); line-height:1.06; margin:0 0 1rem; }
.hero-intro { color:var(--muted); max-width:52ch; margin:0 0 1.5rem; line-height:1.6; }
.button, .topbar .nav-quote { padding:.72rem 1.15rem; min-height:46px; border:1px solid var(--ink); border-radius:.45rem; font-weight:700; }
.button.outline { background:var(--paper); color:var(--ink); }
.button.outline:hover { background:var(--soft); }
.hero .button:not(.outline),.nav-quote,.dark .button { background:var(--gold); color:var(--ink); border-color:#805a00; }
.hero .button:not(.outline):hover,.nav-quote:hover,.dark .button:hover { background:var(--gold-soft); }
.section h2 { margin-bottom:1.1rem; letter-spacing:-.035em; }
.section-lead { max-width:62ch; line-height:1.65; margin:0 0 1.6rem; }
.section-copy p,.section-copy ul { margin-bottom:1.1rem; }
.section-copy .button,.section-copy .text-link { margin-top:.3rem; }
main .section:nth-of-type(even) { background:var(--soft); }
main .section.warm,main .section.dark { background:#fff5db; color:var(--ink); }
main .section.dark h2,main .section.dark .section-content { color:var(--ink); }
.section .facts { border-color:var(--gold); }
.index a { grid-template-columns:minmax(0,1fr); border-color:#a9bacb; padding:.8rem; }
.index a:hover,.gallery a:hover { border-color:#805a00; background:#fff5db; }
.service-links a { display:inline-flex; align-items:center; min-height:46px; padding:.55rem .85rem; background:var(--paper); border-color:var(--blue); color:var(--ink); font-weight:700; }
.service-links a:hover { background:#fff5db; }
.product-grid { gap:1.25rem; }
.product-card { border-color:#d2dce7; box-shadow:0 3px 12px #062b600a; }
.scenario-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.scenario-grid article { display:flex; flex-direction:column; align-items:flex-start; gap:.65rem; padding:1.2rem; background:var(--paper); border:1px solid #d8bb6d; border-radius:.5rem; }
.scenario-grid p { line-height:1.6; }
.scenario-grid .button { margin-top:auto; }
.photo-sources { padding-block:.7rem; font-size:.8rem; color:var(--line); }
.photo-sources summary { cursor:pointer; width:max-content; }
.photo-sources div { display:flex; flex-wrap:wrap; gap:.4rem 1rem; padding-top:.6rem; }
@media (max-width:760px) {
  .hero { align-items:end; min-height:560px; }
  .hero-image { object-position:55% center; }
  .hero-inner { padding-block:7rem 1.5rem; }
  .scenario-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:no-preference) {
  .button,.service-links a,.index a { transition:background-color .18s ease,border-color .18s ease; }
  [data-reveal].reveal-visible { animation-duration:.45s; }
}
.header .brand img { transform:scale(1.2); transform-origin:left center; }
@media (min-width:1100px) {
  .hero-home h1 { font-size:clamp(2.65rem,3.45vw,3.2rem); }
}

/* A directional scrim protects the text and keeps the opposite side bright. */
.hero { background:var(--ink); }
.hero-image { z-index:-2; }
.hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#081b34eb 0%,#081b34cc 40%,#081b3452 72%,#081b3414 100%); }
.hero-inner { padding-block:clamp(3.5rem,8vw,7rem); }
.hero h1 { max-width:18ch; color:var(--paper); text-wrap:balance; }
.hero-intro { color:var(--paper); }
.button, .topbar .nav-quote { border:0; }
.hero .button.outline { background:var(--paper); color:var(--ink); }
.hero .button.outline:hover { background:var(--line); }
.scenario-grid .button.outline { background:var(--soft); }
.scenario-grid .button.outline:hover { background:var(--line); }
.index + p { margin:1.35rem 0 0; }
.hero-about::before { background:linear-gradient(90deg,#081b345c,#081b34df 50%,#081b345c); }
.hero-about .hero-inner,.about-photo .section-copy { text-align:center; }
.hero-about h1,.hero-about .hero-intro,.about-photo h2,.about-photo p { margin-inline:auto; }
.hero-about .actions { justify-content:center; }
main .section.about-photo { position:relative; isolation:isolate; background:var(--ink); color:var(--paper); }
.about-background { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; }
.about-photo::before { content:""; position:absolute; inset:0; z-index:-1; background:#081b34d9; }
.about-photo h2,.about-photo .section-content { color:var(--paper); }
.about-photo .button { background:var(--gold); color:var(--ink); }
.about-photo .button:hover { background:var(--gold-soft); }
@media (max-width:760px) {
  .hero { align-items:center; min-height:500px; }
  .hero::before { background:linear-gradient(0deg,#081b34f0,#081b34b8 72%,#081b344f); }
  .hero-inner { padding-block:4rem; }
}

.topbar nav .nav-downloads { padding:.6rem .85rem; border:0; border-radius:.4rem; background:var(--gold); color:var(--ink); }
.topbar nav .nav-downloads:hover,.topbar nav .nav-downloads[aria-current] { background:var(--gold-soft); }
.document-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; margin-top:1.5rem; }
.document-grid article { display:flex; flex-direction:column; align-items:flex-start; padding:clamp(1.25rem,3vw,2rem); border:1px solid #d1dce8; border-top:4px solid var(--gold); border-radius:.5rem; background:var(--paper); }
.document-grid article p { margin:.75rem 0 1.35rem; }
.document-grid article .button { margin-top:auto; }
.share-tools { display:flex; align-items:center; flex-wrap:wrap; gap:.7rem; margin-top:1rem; }
.share-tools label { font-weight:700; }
.share-tools input { min-width:0; flex:1 1 16rem; max-width:28rem; padding:.7rem; font:inherit; color:var(--ink); background:var(--paper); border:1px solid #8ea3b9; border-radius:.35rem; }
.share-status { min-height:1.5em; }
[data-share-page][hidden],[data-copy-page][hidden] { display:none; }
.product-card p { padding:0 1rem 1rem; margin:0; font-size:.9rem; }
.product-card:target,.document-grid article:target { outline:3px solid var(--gold); outline-offset:4px; }
main [id] { scroll-margin-top:calc(var(--header-height) + 1rem); }
@media (min-width:641px) and (max-width:1130px) { .topbar .nav-quote { display:none; } .topbar nav { gap:clamp(.65rem,1.6vw,1.4rem); } }
@media (max-width:640px) { .document-grid { grid-template-columns:1fr; } }