/* =========================================
   HISPEED — SHARED STYLES (all pages)
   ========================================= */
:root {
  --clr-primary: #c0582a;
  --clr-primary-light: #d97a4f;
  --clr-primary-dark: #9a4520;
  --clr-primary-glow: rgba(192, 88, 42, 0.15);
  --clr-dark: #1a1a1a;
  --clr-dark-2: #2a2a2a;
  --clr-dark-3: #3a3a3a;
  --clr-gray: #6b6b6b;
  --clr-gray-light: #9a9a9a;
  --clr-border: #e0dcd7;
  --clr-bg: #faf9f7;
  --clr-bg-2: #f3f1ed;
  --clr-white: #ffffff;
  --ff-heading: 'Outfit', sans-serif;
  --ff-body: 'Inter', sans-serif;
  --fs-xs: 0.75rem; --fs-sm: 0.875rem; --fs-base: 1rem; --fs-md: 1.125rem;
  --fs-lg: 1.25rem; --fs-xl: 1.5rem; --fs-2xl: 2rem; --fs-3xl: 2.5rem;
  --fs-4xl: 3.25rem; --fs-5xl: 4rem;
  --sp-xs: 0.25rem; --sp-sm: 0.5rem; --sp-md: 1rem; --sp-lg: 1.5rem;
  --sp-xl: 2rem; --sp-2xl: 3rem; --sp-3xl: 4rem; --sp-4xl: 6rem; --sp-5xl: 8rem;
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 16px; --radius-xl: 24px;
  --radius-full: 9999px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.10);
  --shadow-xl: 0 16px 48px rgba(0,0,0,0.14);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 0.2s; --duration-base: 0.35s; --duration-slow: 0.6s;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; }
body {
  font-family:var(--ff-body); font-size:var(--fs-base); line-height:1.7;
  color:var(--clr-dark); background:var(--clr-bg); -webkit-font-smoothing:antialiased; overflow-x:hidden;
}

/* ---- PAGE LOADER ---- */
.page-loader {
  position:fixed; inset:0; z-index:9999;
  background:var(--clr-bg); display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:var(--sp-lg);
  transition:opacity 0.5s ease, visibility 0.5s ease;
}
.page-loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.page-loader__spinner {
  width:48px; height:48px; border:3px solid var(--clr-border);
  border-top-color:var(--clr-primary); border-radius:50%;
  animation:loader-spin 0.8s linear infinite;
}
@keyframes loader-spin { to{transform:rotate(360deg)} }
.page-loader__text {
  font-family:var(--ff-heading); font-size:var(--fs-sm); font-weight:600;
  color:var(--clr-gray); letter-spacing:2px; text-transform:uppercase;
}

/* ---- SCROLL PROGRESS BAR ---- */
.scroll-progress {
  position:fixed; top:0; left:0; height:3px; z-index:1001;
  background:linear-gradient(90deg,var(--clr-primary),var(--clr-primary-light));
  width:0%; transition:none;
  box-shadow:0 0 8px rgba(192,88,42,0.4);
}
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input,select,textarea { font-family:inherit; font-size:inherit; }

.container { max-width:1200px; margin:0 auto; padding:0 var(--sp-xl); }
.accent { color:var(--clr-primary); }
.section { padding:var(--sp-5xl) 0; }
.section__header { text-align:center; max-width:640px; margin:0 auto var(--sp-3xl); }
.section__tag {
  font-family:var(--ff-heading); font-size:var(--fs-sm); font-weight:600;
  text-transform:uppercase; letter-spacing:3px; color:var(--clr-primary); margin-bottom:var(--sp-sm);
}
.section__title {
  font-family:var(--ff-heading); font-size:var(--fs-3xl); font-weight:700;
  line-height:1.2; color:var(--clr-dark); margin-bottom:var(--sp-md);
}
.section__subtitle { font-size:var(--fs-md); color:var(--clr-gray); line-height:1.8; }

/* Buttons */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-sm);
  font-family:var(--ff-heading); font-weight:600; font-size:var(--fs-sm);
  padding:0.7em 1.6em; border-radius:var(--radius-full);
  transition:all var(--duration-base) var(--ease-out); white-space:nowrap;
}
.btn--primary {
  background:linear-gradient(135deg,var(--clr-primary),var(--clr-primary-dark));
  color:var(--clr-white); box-shadow:0 4px 16px rgba(192,88,42,0.3);
}
.btn--primary:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(192,88,42,0.4); }
.btn--outline { border:2px solid var(--clr-primary); color:var(--clr-primary); background:transparent; }
.btn--outline:hover { background:var(--clr-primary); color:var(--clr-white); transform:translateY(-2px); }
.btn--sm { font-size:var(--fs-xs); padding:0.6em 1.4em; }
.btn--lg { font-size:var(--fs-base); padding:0.85em 2em; }
.btn--full { width:100%; }



/* Navbar */
.navbar {
  position:fixed; top:0; left:0; width:100%; z-index:1000;
  background:rgba(255,255,255,0.95); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid transparent; transition:all var(--duration-base) var(--ease-out);
}
.navbar.scrolled { background:#ffffff; border-bottom-color:var(--clr-border); box-shadow:var(--shadow-sm); }

.navbar__inner { display:flex; align-items:center; justify-content:space-between; height:72px; }
.navbar__logo { display:flex; align-items:center; gap:var(--sp-sm); }
.logo-icon {
  width:36px; height:36px; background:linear-gradient(135deg,var(--clr-primary),var(--clr-primary-dark));
  color:var(--clr-white); border-radius:var(--radius-sm); display:flex; align-items:center;
  justify-content:center; font-size:var(--fs-md);
}
.logo-text { font-family:var(--ff-heading); font-size:var(--fs-xl); font-weight:800; color:var(--clr-dark); }

.navbar__links { display:flex; align-items:center; gap:var(--sp-2xl); }
.navbar__links a {
  font-size:var(--fs-sm); font-weight:500; color:var(--clr-gray);
  transition:color var(--duration-fast); position:relative;
}
.navbar__links a::after {
  content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px;
  background:var(--clr-primary); transition:width var(--duration-base) var(--ease-out);
}
.navbar__links a:hover { color:var(--clr-dark); }
.navbar__links a:hover::after { width:100%; }
.navbar__links a.active { color:var(--clr-primary); font-weight:600; }
.navbar__links a.active::after { width:100%; }
.navbar__toggle { display:none; flex-direction:column; gap:5px; width:28px; padding:4px 0; }
.navbar__toggle span {
  display:block; height:2px; background:var(--clr-dark); border-radius:2px;
  transition:all var(--duration-base) var(--ease-out);
}


/* Forms */
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-md); }
.form-group { margin-bottom:var(--sp-md); }
.form-group label { display:block; font-size:var(--fs-sm); font-weight:500; margin-bottom:var(--sp-xs); color:var(--clr-dark-2); }
.form-group input,.form-group select,.form-group textarea {
  width:100%; padding:0.75em 1em; border:1px solid var(--clr-border); border-radius:var(--radius-sm);
  background:var(--clr-bg); color:var(--clr-dark); font-size:var(--fs-sm); transition:all var(--duration-fast); outline:none;
}

.form-group input:focus,.form-group select:focus,.form-group textarea:focus {
  border-color:var(--clr-primary); box-shadow:0 0 0 3px var(--clr-primary-glow); background:var(--clr-white);
}
.form-group textarea { resize:vertical; }

/* Modal */
.modal-overlay {
  position:fixed; inset:0; z-index:2000; background:rgba(0,0,0,0.6); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; padding:var(--sp-xl);
  opacity:0; visibility:hidden; transition:all var(--duration-base) var(--ease-out);
}
.modal-overlay.active { opacity:1; visibility:visible; }
.modal {
  background:var(--clr-white); border-radius:var(--radius-xl); max-width:520px; width:100%;
  max-height:90vh; overflow-y:auto; padding:var(--sp-2xl); position:relative;
  transform:translateY(20px) scale(0.97); transition:all var(--duration-base) var(--ease-out);
}

.modal-overlay.active .modal { transform:translateY(0) scale(1); }
.modal__close {
  position:absolute; top:var(--sp-lg); right:var(--sp-lg); width:36px; height:36px;
  border-radius:var(--radius-full); background:var(--clr-bg); color:var(--clr-gray);
  display:flex; align-items:center; justify-content:center; font-size:var(--fs-md);
  transition:all var(--duration-fast);
}
.modal__close:hover { background:var(--clr-primary); color:var(--clr-white); }
.modal__header { margin-bottom:var(--sp-xl); }
.modal__header h2 { font-family:var(--ff-heading); font-size:var(--fs-xl); font-weight:700; margin-bottom:var(--sp-xs); }
.modal__header p { font-size:var(--fs-sm); color:var(--clr-gray); }
.modal__form { border:none; padding:0; }
.modal__success { display:none; text-align:center; padding:var(--sp-2xl) 0; }
.modal__success.active { display:block; }
.modal__success-icon { font-size:3rem; color:#22c55e; margin-bottom:var(--sp-md); }
.modal__success h3 { font-family:var(--ff-heading); font-size:var(--fs-xl); font-weight:700; margin-bottom:var(--sp-sm); }
.modal__success p { color:var(--clr-gray); margin-bottom:var(--sp-xl); }
body.modal-open { overflow:hidden; }

/* Footer */
.footer { background:var(--clr-dark); color:rgba(255,255,255,0.7); padding:var(--sp-4xl) 0 var(--sp-xl); }
.footer__grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:var(--sp-3xl); margin-bottom:var(--sp-3xl); }
.footer__brand p { margin-top:var(--sp-md); font-size:var(--fs-sm); line-height:1.7; max-width:280px; }
.footer__socials { display:flex; gap:var(--sp-md); margin-top:var(--sp-lg); }
.footer__socials a {
  width:38px; height:38px; border-radius:var(--radius-full); border:1px solid rgba(255,255,255,0.15);
  display:flex; align-items:center; justify-content:center; font-size:var(--fs-sm);
  transition:all var(--duration-base) var(--ease-out);
}
.footer__socials a:hover { background:var(--clr-primary); border-color:var(--clr-primary); color:var(--clr-white); }
.footer__links h4 { font-family:var(--ff-heading); font-weight:600; color:var(--clr-white); margin-bottom:var(--sp-lg); font-size:var(--fs-base); }
.footer__links ul { display:flex; flex-direction:column; gap:var(--sp-sm); }
.footer__links li { font-size:var(--fs-sm); display:flex; align-items:center; gap:var(--sp-sm); }
.footer__links li i { font-size:var(--fs-xs); color:var(--clr-primary-light); }
.footer__links a { transition:color var(--duration-fast); }
.footer__links a:hover { color:var(--clr-primary-light); }
.footer__bottom { border-top:1px solid rgba(255,255,255,0.08); padding-top:var(--sp-xl); text-align:center; font-size:var(--fs-sm); color:rgba(255,255,255,0.4); }

/* Animations */
.fade-in { opacity:0; transform:translateY(30px); transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out); }
.fade-in.visible { opacity:1; transform:translateY(0); }

/* WhatsApp Floating Button */
.whatsapp-float {
  position:fixed; bottom:28px; right:28px; z-index:900;
  width:56px; height:56px; border-radius:50%;
  background:#25d366; color:#fff; font-size:1.6rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(37,211,102,0.4);
  transition:all var(--duration-base) var(--ease-out);
  text-decoration:none;
}
.whatsapp-float:hover { transform:scale(1.1) translateY(-2px); box-shadow:0 8px 30px rgba(37,211,102,0.5); }
.whatsapp-float .tooltip {
  position:absolute; right:68px; top:50%; transform:translateY(-50%);
  background:var(--clr-dark); color:#fff; padding:0.4em 0.8em;
  border-radius:var(--radius-sm); font-size:var(--fs-xs); font-family:var(--ff-body);
  white-space:nowrap; opacity:0; pointer-events:none; transition:opacity var(--duration-fast);
}
.whatsapp-float:hover .tooltip { opacity:1; }

/* Back to Top */
.back-to-top {
  position:fixed; bottom:96px; right:28px; z-index:900;
  width:44px; height:44px; border-radius:50%;
  background:var(--clr-white); color:var(--clr-dark); font-size:var(--fs-md);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-md); border:1px solid var(--clr-border);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:all var(--duration-base) var(--ease-out);
}
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { background:var(--clr-primary); color:#fff; border-color:var(--clr-primary); }


/* Page Hero (inner pages) */
.page-hero {
  background:linear-gradient(160deg,#1a1a1a 0%,#2a2018 50%,#1a1a1a 100%);
  padding:140px 0 60px; position:relative; overflow:hidden;
}
.page-hero__bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 50% at 70% 40%,rgba(192,88,42,0.12) 0%,transparent 70%);
}
.page-hero .container { position:relative; z-index:1; }
.page-hero__breadcrumb {
  font-size:var(--fs-sm); color:var(--clr-gray-light); margin-bottom:var(--sp-md);
}
.page-hero__breadcrumb a { color:var(--clr-primary-light); }
.page-hero__breadcrumb a:hover { text-decoration:underline; }
.page-hero__title {
  font-family:var(--ff-heading); font-size:var(--fs-4xl); font-weight:800;
  color:#fff; margin-bottom:var(--sp-md); line-height:1.15;
}
.page-hero__subtitle { font-size:var(--fs-lg); color:var(--clr-gray-light); max-width:600px; line-height:1.7; }
.mobile-cta-item { display:none; }

/* Responsive shared */
@media(max-width:1024px){
  .footer__grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-2xl)}
  .section__title{font-size:var(--fs-2xl)}
  .page-hero__title{font-size:var(--fs-3xl)}
}
@media(max-width:768px){
  .navbar__links,.navbar__cta{display:none}
  .navbar__toggle{display:flex}
  .navbar__links.open{
    display:flex;flex-direction:column;position:fixed;top:72px;left:0;right:0;bottom:0;
    background:rgba(250,249,247,0.98);backdrop-filter:blur(20px);padding:var(--sp-3xl) var(--sp-xl);
    gap:var(--sp-xl);z-index:999;animation:slideDown var(--duration-base) var(--ease-out);
    overflow-y:auto;
  }
  @keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
  .navbar__links.open a{font-size:var(--fs-xl);font-family:var(--ff-heading);font-weight:600;color:var(--clr-dark)}
  .navbar__links.open .mobile-cta-item { display:block; margin-top:var(--sp-xl); }
  .navbar__links.open .mobile-cta-item a { font-size:var(--fs-md); color:#fff; display:inline-block; width:100%; text-align:center; }
  .navbar__toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
  .navbar__toggle.open span:nth-child(2){opacity:0}
  .navbar__toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
  .form-row{grid-template-columns:1fr}
  .section{padding:var(--sp-3xl) 0}
  .footer__grid{grid-template-columns:1fr;gap:var(--sp-2xl)}
  .footer__brand p{max-width:none}
  .page-hero{padding:120px 0 40px}
  .page-hero__title{font-size:var(--fs-2xl)}
}
@media(max-width:480px){
  .container{padding:0 var(--sp-md)}
  .modal{padding:var(--sp-md)}
  .page-hero{padding:100px 0 40px}
  .page-hero__subtitle{font-size:var(--fs-md)}
  .whatsapp-float .tooltip {
    right: 0;
    top: -30px;
    transform: none;
  }
}
