/* ==========================================================================
   PT. Mitra Sinergi Sukses — stylesheet
   Palette nods to the brand blue + the Indonesian flag's red, since the
   business is Indonesians travelling abroad for work.
   ========================================================================== */

:root{
  --navy:#071233;
  --navy-2:#0d2158;
  --blue:#0052e0;
  --blue-light:#3d7bff;
  --blue-pale:#eaf1fc;
  --red:#d6303f;
  --red-dark:#a8232f;
  --bg:#f6f8fc;
  --surface:#ffffff;
  --surface-2:#eef3fc;
  --text:#141b2e;
  --text-muted:#5b6577;
  --border:#e3e9f5;
  --shadow-sm: 0 8px 24px -12px rgba(7,18,51,.18);
  --shadow-md: 0 24px 48px -20px rgba(7,18,51,.28);
  --radius: 16px;
  --radius-sm: 10px;
  --font-head:'Plus Jakarta Sans', system-ui, sans-serif;
  --font-body:'Manrope', system-ui, sans-serif;
  --container: 1200px;
  --header-h: 84px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,h5{
  font-family:var(--font-head);
  color:var(--navy);
  line-height:1.2;
  margin:0 0 .5em;
  font-weight:700;
}
p{ margin:0 0 1em; color:var(--text-muted); }
button{ font-family:inherit; cursor:pointer; }

:focus-visible{
  outline:2.5px solid var(--blue);
  outline-offset:3px;
  border-radius:4px;
}

section{ scroll-margin-top: var(--header-h); }
#home{ scroll-margin-top:0; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:32px;
}

.section{ padding:96px 0; }
.section-alt{ background:var(--surface); }
.section-tight{ padding-top:72px; }

.section-head{
  max-width:640px;
  margin-bottom:48px;
}
.section-head.center{ margin-inline:auto; text-align:center; }
.section-tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.8125rem;
  font-weight:700;
  color:var(--red);
  letter-spacing:.02em;
  margin-bottom:14px;
}
.section-tag::before{
  content:"";
  width:22px; height:2px;
  background:var(--red);
  display:inline-block;
}
.section-head h2{ font-size:clamp(1.7rem, 1.1rem + 2.4vw, 2.5rem); }
.section-head p{ font-size:1.05rem; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:15px 30px;
  border-radius:100px;
  font-weight:700;
  font-size:.95rem;
  border:2px solid transparent;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
  white-space:nowrap;
}
.btn-primary{
  background:var(--red);
  color:#fff;
  box-shadow:0 14px 30px -12px rgba(214,48,63,.55);
}
.btn-primary:hover{ background:var(--red-dark); transform:translateY(-2px); }
.btn-ghost{
  background:transparent;
  border-color:rgba(255,255,255,.4);
  color:#fff;
}
.btn-ghost:hover{ border-color:#fff; background:rgba(255,255,255,.08); transform:translateY(-2px); }
.btn-outline{
  background:transparent;
  border-color:var(--blue);
  color:var(--blue);
}
.btn-outline:hover{ background:var(--blue); color:#fff; transform:translateY(-2px); }
.btn svg{ width:18px; height:18px; }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header{
  position:fixed; inset:0 0 auto 0;
  height:var(--header-h);
  z-index:100;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:box-shadow .3s ease, border-color .3s ease, height .3s ease;
}
.site-header.is-scrolled{
  box-shadow:var(--shadow-sm);
  border-color:var(--border);
}
.header-inner{
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:32px;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.logo{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo img{ height:44px; width:auto; }
.logo-word{ font-family:var(--font-head); font-weight:800; font-size:1.05rem; color:var(--navy); line-height:1.15; }
.logo-word span{ display:block; font-family:var(--font-body); font-weight:600; font-size:.65rem; color:var(--red); letter-spacing:.06em; }

.main-nav > ul{ display:flex; align-items:center; gap:6px; }
.main-nav a, .main-nav .dropdown-toggle{
  display:flex; align-items:center; gap:6px;
  padding:10px 16px;
  font-weight:600;
  font-size:.95rem;
  color:var(--navy);
  border:none;
  background:none;
  border-radius:100px;
  transition:background .2s ease, color .2s ease;
  position:relative;
}
.main-nav a:hover, .main-nav .dropdown-toggle:hover{ background:var(--surface-2); color:var(--blue); }
.main-nav .nav-link.is-active{ color:var(--blue); background:var(--surface-2); }
.main-nav .dropdown-toggle svg{ width:14px; height:14px; transition:transform .25s ease; }
.has-dropdown{ position:relative; }
.has-dropdown.is-open .dropdown-toggle svg{ transform:rotate(180deg); }
.dropdown{
  position:absolute; top:calc(100% + 10px); left:0;
  min-width:240px;
  background:var(--surface);
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow-md);
  border:1px solid var(--border);
  padding:8px;
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.has-dropdown.is-open .dropdown{ opacity:1; visibility:visible; transform:translateY(0); }
.dropdown a{ display:block; padding:11px 14px; border-radius:8px; font-weight:600; font-size:.9rem; }
.dropdown a:hover{ background:var(--surface-2); color:var(--blue); }

.header-cta{ display:flex; align-items:center; gap:14px; }
.header-cta .btn{ padding:11px 22px; font-size:.875rem; background:var(--blue); box-shadow:0 12px 24px -12px rgba(0,82,224,.5); }
.header-cta .btn:hover{ background:var(--blue-light); }

.nav-toggle{
  display:none;
  width:44px; height:44px;
  border:none; background:var(--surface-2);
  border-radius:10px;
  align-items:center; justify-content:center;
  flex-direction:column; gap:5px;
}
.nav-toggle span{ width:20px; height:2px; background:var(--navy); border-radius:2px; transition:transform .3s ease, opacity .3s ease; }
.nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2){ opacity:0; }
.nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-nav { display: none; }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
  padding-top:var(--header-h);
  background:var(--navy);
  color:#fff;
  overflow:hidden;
}
.hero-inner{
  position:relative; z-index:2;
  max-width:var(--container); margin-inline:auto; width:100%;
  padding:64px 32px 140px;
}
.hero-copy {
  position: relative;
  z-index: 10;
}
.hero h1{
  color:#fff;
  font-size:clamp(2.5rem, 1.5rem + 3.5vw, 4.5rem);
  margin-bottom:8px;
  max-width:100%;
}
.hero h2{
  color:#fff;
  font-size:clamp(1.4rem, 1rem + 2vw, 2.2rem);
  margin-bottom:20px;
  max-width:100%;
}
.hero .hero-sub{
  font-size:1.15rem;
  color:#c6cee6;
  max-width:600px;
  margin-inline:auto;
  margin-bottom:32px;
}
.hero-actions{ display:flex; flex-wrap:wrap; gap:16px; margin-bottom:44px; }
.hero-stats{ display:flex; gap:32px; flex-wrap:wrap; }
.hero-stats div{ min-width:100px; }
.hero-stats strong{ display:block; font-family:var(--font-head); font-size:1.9rem; color:#fff; }
.hero-stats span{ font-size:.85rem; color:#9caed9; }

.hero-visual{ position:relative; height:420px; }
.hero-visual svg{ width:100%; height:100%; }
.flight-path{
  fill:none; stroke:rgba(255,255,255,.35); stroke-width:2;
  stroke-dasharray:6 8;
  animation:dash-flow 3.6s linear infinite;
}
.flight-path.alt{ stroke:rgba(255,255,255,.22); animation-duration:4.6s; }
@keyframes dash-flow{ to{ stroke-dashoffset:-140; } }
.hub-dot{ fill:var(--red); }
.dest-dot{ fill:#fff; }
.pulse-ring{
  fill:none; stroke:var(--red); stroke-width:2; opacity:.6;
  transform-origin:center;
  animation:pulse 2.4s ease-out infinite;
}
@keyframes pulse{
  0%{ transform:scale(.6); opacity:.7; }
  100%{ transform:scale(2.1); opacity:0; }
}
.traveler{ fill:#ffd7db; }
.traveler.p1{ offset-path:path('M40,300 C160,160 230,120 330,150'); animation:travel 3.6s linear infinite; }
.traveler.p2{ offset-path:path('M40,300 C180,340 300,330 400,230'); animation:travel 4.6s linear infinite; }
@keyframes travel{ from{ offset-distance:0%; } to{ offset-distance:100%; } }

.scroll-cue{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  color:#9caed9; font-size:.75rem; z-index:2;
  border:none; background:none;
}
.scroll-cue svg{ width:18px; height:18px; animation:bob 1.8s ease-in-out infinite; }
@keyframes bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(6px); } }

/* ==========================================================================
   Reveal-on-scroll utility (Local AOS)
   ========================================================================== */
[data-aos] {
  opacity: 0;
  transition-duration: 800ms;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  transition-property: opacity, transform;
}
[data-aos="fade-up"] { transform: translateY(40px); }
[data-aos="fade-down"] { transform: translateY(-40px); }
[data-aos="fade-left"] { transform: translateX(60px); }
[data-aos="fade-right"] { transform: translateX(-60px); }
[data-aos="zoom-in"] { transform: scale(0.92); }

[data-aos].aos-animate {
  opacity: 1;
  transform: translate(0px, 0px) scale(1);
}

/* ==========================================================================
   About / company overview
   ========================================================================== */
.about-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:64px;
  align-items:center;
}
.about-media{ position:relative; }
.about-media img{ border-radius:var(--radius); box-shadow:var(--shadow-md); width:100%; }
.about-media::before{
  content:""; position:absolute; inset:-16px -16px auto auto; width:70%; height:70%;
  border:2px solid var(--blue-pale); border-radius:var(--radius); z-index:-1;
}
.about-copy p{ font-size:1.02rem; }
.legal-box{
  background:var(--surface-2);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:22px 24px;
  margin-top:20px;
}
.legal-box dt{ font-weight:700; color:var(--navy); font-size:.9rem; margin-top:14px; }
.legal-box dt:first-child{ margin-top:0; }
.legal-box dd{ margin:4px 0 0; color:var(--text-muted); font-size:.92rem; }

/* ---------- advantages ---------- */
.advantages-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:28px;
  margin-top:8px;
}
.advantage-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px 28px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.advantage-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.advantage-icon{
  width:52px; height:52px; border-radius:14px;
  background:var(--blue-pale); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:20px;
}
.advantage-icon svg{ width:26px; height:26px; }
.advantage-card h3{ font-size:1.15rem; margin-bottom:10px; }
.advantage-card p{ font-size:.94rem; margin:0; }

/* ---------- placement countries ---------- */
.country-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(110px, 1fr));
  gap:20px;
  margin-top:8px;
}
.country-item{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:18px;
  display:flex; align-items:center; justify-content:center;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.country-item img{ width:100%; height:auto; aspect-ratio:1/1; object-fit:contain; }
.country-item:hover{ transform:translateY(-5px) scale(1.03); box-shadow:var(--shadow-sm); border-color:var(--blue-pale); }

/* ---------- company detail sections (LPK / MSA) ---------- */
.company-block{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:56px;
  align-items:center;
}
.company-block.reverse .company-media{ order:2; }
.company-block.reverse .company-copy{ order:1; }
.company-media{ display:flex; flex-direction:column; gap:20px; }
.company-logo{ max-width:220px; }
.company-photo{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md); }
.company-photo img{ width:100%; height:100%; object-fit:cover; }
.company-copy h2{ font-size:clamp(1.5rem, 1rem + 1.8vw, 2.1rem); }
.company-copy p{ font-size:1.02rem; }

/* ---------- fields of placement ---------- */
.fields-highlight{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
  margin-bottom:40px;
}
.field-card{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  aspect-ratio:4/3.1;
  box-shadow:var(--shadow-sm);
}
.field-card img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.field-card:hover img{ transform:scale(1.08); }
.field-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(7,18,51,.88) 0%, rgba(7,18,51,.15) 55%, transparent 80%);
}
.field-card span{
  position:absolute; left:20px; bottom:18px; z-index:1;
  color:#fff; font-family:var(--font-head); font-weight:700; font-size:1.05rem;
}
.field-icons{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
.field-icons .field-icon{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.field-icons .field-icon:hover{ transform:translateY(-4px); box-shadow:var(--shadow-sm); }
.field-icons img{ width:100%; aspect-ratio:1/1; object-fit:contain; }

/* ---------- gallery ---------- */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:16px;
}
.gallery-item{
  position:relative;
  border-radius:12px;
  overflow:hidden;
  aspect-ratio:4/3;
  cursor:zoom-in;
  border:none;
  padding:0;
  background:var(--surface-2);
}
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.gallery-item:hover img{ transform:scale(1.08); }
.gallery-item::after{
  content:"";
  position:absolute; inset:0;
  background:rgba(7,18,51,0);
  transition:background .3s ease;
}
.gallery-item:hover::after{ background:rgba(7,18,51,.18); }
.gallery-item svg{
  position:absolute; top:12px; right:12px; width:20px; height:20px; color:#fff;
  opacity:0; transition:opacity .3s ease;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));
}
.gallery-item:hover svg{ opacity:1; }

/* lightbox */
.lightbox{
  position:fixed; inset:0; z-index:1000;
  background:rgba(4,9,26,.94);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease;
  padding:32px;
}
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox figure{ margin:0; max-width:min(92vw, 1000px); max-height:86vh; text-align:center; }
.lightbox img{ max-width:100%; max-height:78vh; border-radius:10px; margin-inline:auto; box-shadow:0 30px 60px rgba(0,0,0,.5); }
.lightbox figcaption{ color:#cfd6e8; margin-top:14px; font-size:.9rem; }
.lightbox-close, .lightbox-nav{
  position:absolute;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);
  color:#fff;
  border-radius:50%;
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s ease;
}
.lightbox-close:hover, .lightbox-nav:hover{ background:rgba(255,255,255,.2); }
.lightbox-close{ top:24px; right:24px; }
.lightbox-nav svg, .lightbox-close svg{ width:20px; height:20px; }
.lightbox-nav.prev{ left:24px; top:50%; transform:translateY(-50%); }
.lightbox-nav.next{ right:24px; top:50%; transform:translateY(-50%); }

/* ---------- CTA banner ---------- */
.cta-banner{
  background:var(--navy);
  border-radius:24px;
  padding:56px 48px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  flex-wrap:wrap;
  color:#fff;
  position:relative;
  overflow:hidden;
}
.cta-banner h2{ color:#fff; font-size:clamp(1.5rem, 1rem + 1.6vw, 2rem); margin-bottom:8px; }
.cta-banner p{ color:#c6cee6; margin:0; font-size:1.02rem; }
.cta-text{ position:relative; z-index:1; max-width:560px; }
.cta-banner .btn{ position:relative; z-index:1; flex-shrink:0; }

/* ---------- contact ---------- */
.contact-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:28px;
  margin-bottom:56px;
}
.contact-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px;
  display:flex; gap:20px; align-items:flex-start;
  transition:transform .3s ease, box-shadow .3s ease;
}
.contact-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.contact-card img{ width:84px; height:84px; border-radius:16px; object-fit:cover; flex-shrink:0; }
.contact-card h3{ font-size:1.1rem; margin-bottom:4px; }
.contact-role{ color:var(--red); font-weight:700; font-size:.8rem; margin-bottom:14px; display:block; }
.contact-links{ display:flex; flex-direction:column; gap:9px; }
.contact-links a, .contact-links span{
  display:flex; align-items:center; gap:10px;
  font-size:.92rem; font-weight:600; color:var(--text);
}
.contact-links a:hover{ color:var(--blue); }
.contact-links svg{ width:17px; height:17px; color:var(--blue); flex-shrink:0; }

.map-address{
  display:flex; align-items:center; gap:18px;
  background:var(--surface-2);
  border-radius:var(--radius);
  padding:26px 30px;
  flex-wrap:wrap;
}
.map-address svg{ width:34px; height:34px; color:var(--red); flex-shrink:0; }
.map-address h4{ margin:0 0 4px; font-size:1rem; }
.map-address p{ margin:0; font-size:.92rem; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background:var(--navy); color:#c6cee6; }
.footer-top{
  padding:72px 0 48px;
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:48px;
}
.footer-logo{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.footer-logo img{ height:50px; width:auto; }
.footer-brand-word{ font-family:var(--font-head); font-weight:800; color:#fff; }
.footer-col h4{ color:#fff; font-size:1rem; margin-bottom:20px; }
.footer-col p{ color:#9caed9; font-size:.92rem; }
.footer-nav li{ margin-bottom:12px; }
.footer-nav a{ color:#c6cee6; font-size:.92rem; transition:color .2s ease; }
.footer-nav a:hover{ color:#fff; }
.footer-social{ display:flex; gap:10px; margin-top:20px; }
.footer-social a{
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center;
  transition:background .2s ease, transform .2s ease;
}
.footer-social a:hover{ background:var(--red); transform:translateY(-3px); }
.footer-social svg{ width:17px; height:17px; color:#fff; }
.footer-address p{ color:#9caed9; font-size:.92rem; margin:0; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding:22px 0;
  text-align:center;
  font-size:.85rem;
  color:#8492b8;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1080px){
  .hero-inner{ grid-template-columns:1fr; }
  .hero-visual{ height:280px; order:-1; opacity:.85; }
  .about-grid{ grid-template-columns:1fr; }
  .about-media{ max-width:480px; margin-inline:auto; }
  .company-block, .company-block.reverse{ grid-template-columns:1fr; }
  .company-block .company-media, .company-block.reverse .company-media{ order:1; max-width:480px; margin-inline:auto; }
  .company-block .company-copy, .company-block.reverse .company-copy{ order:2; }
  .footer-top{ grid-template-columns:1fr 1fr; }
}

@media (max-width:880px){
  .main-nav, .header-cta{ display:none; }
  .nav-toggle{ display:flex; }
  :root{ --header-h:72px; }
  .header-inner{ padding-inline:20px; }

  .mobile-nav{
    display: block;
    position:fixed; top:72px; left:0; right:0; bottom:0;
    background:var(--surface);
    padding:24px 20px 40px;
    overflow-y:auto;
    transform:translateX(100%);
    transition:transform .35s ease;
    z-index:99;
  }
  .mobile-nav.is-open{ transform:translateX(0); }
  .mobile-nav ul{ display:flex; flex-direction:column; gap:4px; }
  .mobile-nav > ul > li{ border-bottom:1px solid var(--border); }
  .mobile-nav a, .mobile-nav .dropdown-toggle{
    display:flex; width:100%; justify-content:space-between; align-items:center;
    padding:16px 6px; font-weight:700; font-size:1.05rem; color:var(--navy);
    border:none; background:none;
  }
  .mobile-nav .dropdown-toggle svg{ width:16px; height:16px; transition:transform .25s ease; }
  .mobile-nav .has-dropdown.is-open .dropdown-toggle svg{ transform:rotate(180deg); }
  .mobile-nav .dropdown{
    position:static; box-shadow:none; border:none; opacity:1; visibility:visible; transform:none;
    max-height:0; overflow:hidden; padding:0; transition:max-height .3s ease;
    background:var(--surface-2); border-radius:10px;
  }
  .mobile-nav .has-dropdown.is-open .dropdown{ max-height:220px; padding:6px; margin-bottom:10px; }
  .mobile-nav .dropdown a{ font-weight:600; font-size:.95rem; padding:12px 14px; }
  .mobile-nav .btn{ margin-top:20px; width:100%; justify-content:center; }
}

@media (max-width:760px){
  .section{ padding:64px 0; }
  .container{ padding-inline:20px; }
  .advantages-grid{ grid-template-columns:1fr; }
  .fields-highlight, .field-icons{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .gallery-grid{ grid-template-columns:repeat(2, 1fr); }
  .cta-banner{ padding:36px 28px; flex-direction:column; text-align:left; }
  .footer-top{ grid-template-columns:1fr; gap:36px; padding:56px 0 36px; }
  .hero-stats{ gap:20px; }
  .lightbox-nav{ width:40px; height:40px; }
  .lightbox-close{ top:14px; right:14px; }
  .lightbox-nav.prev{ left:8px; }
  .lightbox-nav.next{ right:8px; }
}

@media (max-width:460px){
  .gallery-grid{ grid-template-columns:repeat(2, 1fr); gap:10px; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ justify-content:center; }
  .company-logo{ max-width:170px; }
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}