:root { --accent: #C4714A; }
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #0d0a09; }
::selection { background: #C4714A; color: #141210; }
input::placeholder { color: rgba(237,224,212,0.4); }

@keyframes recblink { 0%,100% { opacity:1 } 50% { opacity:0.2 } }

/* Utility: replaces the old sc-if conditional rendering */
.hidden { display: none !important; }

/* Gallery scrollbar */
.gallery { scrollbar-width: thin; scrollbar-color: rgba(196,113,74,0.6) rgba(237,224,212,0.06); }
.gallery::-webkit-scrollbar { height: 8px; }
.gallery::-webkit-scrollbar-track { background: rgba(237,224,212,0.06); }
.gallery::-webkit-scrollbar-thumb { background: rgba(196,113,74,0.55); border-radius: 4px; }

/* Hover / focus states (previously the style-hover / style-focus attributes) */
button[type="submit"]:hover,
.gal-arrow:hover,
footer a:hover {
  filter: brightness(1.08);
}
.hero-form input:focus,
#final-form input:focus {
  border-color: var(--accent);
}

@media (max-width: 980px) {
  .g-prod { grid-template-columns: 1fr 1fr !important; }
  .g-reel { grid-template-columns: repeat(3,1fr) !important; }
}
@media (max-width: 880px) {
  .sec { padding-top:74px !important; padding-bottom:74px !important; padding-left:22px !important; padding-right:22px !important; }
  .hero-sec { padding:40px 22px 72px !important; min-height:auto !important; }
  .custo-pad { padding:72px 22px !important; }
  .nav-bar { padding-left:22px !important; padding-right:22px !important; }
  .hero-grid, .g2, .g-cmp, .g-feat, .g-custo, .g-depo, .g-proof { grid-template-columns:1fr !important; }
  .g-proof { gap:48px !important; }
  .g-flow { grid-template-columns:1fr !important; gap:0 !important; }
  .flow-line { display:none !important; }
  .flow-item { flex-direction:row !important; align-items:flex-start !important; text-align:left !important; gap:22px !important; padding-bottom:40px !important; position:relative !important; }
  .flow-item:last-child { padding-bottom:0 !important; }
  .flow-item::before { content:''; position:absolute; left:8px; top:14px; bottom:-14px; width:2px; background:var(--accent); opacity:0.4; }
  .flow-item:last-child::before { display:none !important; }
  .flow-media, #flow-1, #flow-2, #flow-3, #flow-4 { display:none !important; }
  .flow-dot { order:-1 !important; margin:3px 0 0 0 !important; flex:none !important; }
  .gap-lg { gap:44px !important; }
  .hero-h1 { font-size:clamp(38px,8vw,56px) !important; }
}
@media (max-width: 600px) {
  .g-prod, .g-photo, .g-reel { grid-template-columns:1fr 1fr !important; }
  .form-grid { grid-template-columns:1fr !important; }
  .hero-form { padding:24px !important; }
  .vf-hide { display:none !important; }
  .footer-row { gap:32px !important; }
}