/* ============================================================
   KellyGroup — Systemy Zabezpieczeń i Inteligentne Instalacje
   Główny arkusz stylów
   ============================================================ */

:root{
  --purple-950:#1B0F2B;
  --purple-900:#2B1846;
  --purple-800:#3A2160;
  --purple-700:#4B2E7D;
  --purple-500:#7C5CC7;
  --purple-400:#9B84EE;
  --purple-300:#BDA9F5;
  --purple-200:#E1D6FB;
  --amber-600:#E8792E;
  --amber-500:#FF9955;
  --amber-400:#FFB578;
  --amber-200:#FFDCB3;
  --cream-50:#FBF3E9;
  --cream-100:#F5E8D6;
  --cream-200:#EEDCC2;
  --ink-900:#241531;
  --ink-700:#3C2C4D;
  --white:#FFFFFF;

  --font-display:'Fraunces', serif;
  --font-body:'Manrope', sans-serif;
  --font-mono:'Space Mono', monospace;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--ink-900);
  background:var(--cream-50);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
section{position:relative;}

.eyebrow{
  font-family:var(--font-mono);
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--amber-600);
  font-weight:700;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--amber-500);display:inline-block;}
.eyebrow.on-dark{color:var(--amber-300);}
.eyebrow.on-dark::before{background:var(--amber-400);}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.08;
  letter-spacing:-0.01em;
  color:var(--purple-950);
}

.container{max-width:1180px;margin:0 auto;padding:0 32px;}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 26px;border-radius:100px;
  font-family:var(--font-body);font-weight:700;font-size:0.95rem;
  cursor:pointer;border:none;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  white-space:nowrap;
}
.btn-amber{background:linear-gradient(135deg,var(--amber-500),var(--amber-600));color:var(--white);box-shadow:0 10px 26px -8px rgba(232,121,46,0.6);}
.btn-amber:hover{transform:translateY(-2px);box-shadow:0 14px 30px -6px rgba(232,121,46,0.7);}
.btn-ghost{background:rgba(255,255,255,0.08);color:var(--white);border:1.5px solid rgba(255,255,255,0.4);backdrop-filter:blur(6px);}
.btn-ghost:hover{background:rgba(255,255,255,0.18);transform:translateY(-2px);}
.btn-purple{background:var(--purple-700);color:var(--white);}
.btn-purple:hover{background:var(--purple-800);transform:translateY(-2px);}
.btn-outline{background:transparent;color:var(--purple-800);border:1.5px solid var(--purple-300);}
.btn-outline:hover{background:var(--purple-200);}

/* ---------- NAV ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:100;padding:10px 0;transition:all .35s ease;}
header.scrolled{padding:8px 0;background:rgba(27,15,43,0.9);backdrop-filter:blur(14px);box-shadow:0 8px 30px -12px rgba(0,0,0,0.4);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;}
.logo-wrap{display:flex;align-items:center;gap:14px;}
.logo-wrap img{height:56px;width:auto;transition:height .3s ease;}
header.scrolled .logo-wrap img{height:46px;}
.logo-word{font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--white);letter-spacing:0.01em;line-height:1.2;}
.logo-word span{color:var(--amber-400);display:block;font-family:var(--font-mono);font-size:0.6rem;letter-spacing:0.08em;font-weight:700;margin-top:2px;}
nav ul{display:flex;gap:28px;align-items:center;}
nav a.nav-link{color:rgba(255,255,255,0.85);font-size:0.88rem;font-weight:600;position:relative;padding:4px 0;}
nav a.nav-link::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--amber-400);transition:width .25s ease;}
nav a.nav-link:hover::after, nav a.nav-link.active::after{width:100%;}
.nav-dropdown{position:relative;}
.nav-dropdown-panel{
  position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%);
  background:var(--white);border-radius:16px;box-shadow:0 30px 60px -20px rgba(27,15,43,0.4);
  padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:4px;width:440px;
  opacity:0;visibility:hidden;transform:translateX(-50%) translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.nav-dropdown:hover .nav-dropdown-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.nav-dropdown-panel a{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;
  color:var(--ink-900);font-size:0.85rem;font-weight:600;
}
.nav-dropdown-panel a:hover{background:var(--cream-100);color:var(--purple-800);}
.nav-cta{display:flex;align-items:center;gap:16px;}
.nav-phone{display:flex;align-items:center;gap:8px;color:var(--white);font-weight:700;font-size:0.9rem;font-family:var(--font-mono);}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;}
.burger span{width:26px;height:2px;background:#fff;border-radius:2px;}

#mobileMenu{position:fixed;inset:0;background:var(--purple-950);z-index:99;display:none;flex-direction:column;align-items:center;justify-content:center;gap:20px;overflow-y:auto;padding:40px 20px;}
#mobileMenu a{color:#fff;font-size:1.15rem;font-family:var(--font-display);}
#mobileMenu .mm-sub{font-size:0.95rem;opacity:0.75;font-family:var(--font-body);}

/* ---------- HERO (homepage) ---------- */
.hero{
  min-height:100svh;display:flex;align-items:flex-end;position:relative;
  background:
    radial-gradient(120% 90% at 15% 0%, rgba(155,132,238,0.35), transparent 55%),
    linear-gradient(180deg, rgba(27,15,43,0.55) 0%, rgba(27,15,43,0.72) 45%, rgba(27,15,43,0.96) 100%),
    url('https://images.pexels.com/photos/33153/white-satellite-dish.jpg?auto=compress&cs=tinysrgb&w=1920') center 30%/cover no-repeat;
  padding-bottom:150px;padding-top:96px;
}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg, var(--cream-50) 0%, transparent 12%);pointer-events:none;}
.hero-inner{position:relative;z-index:2;max-width:780px;}
.hero h1{color:var(--white);font-size:clamp(2.6rem, 5.6vw, 4.4rem);font-weight:600;line-height:1.08;opacity:0;transform:translateY(20px);animation:fadeUp .9s ease forwards .25s;}
.hero h1 .brand-name{
  position:relative;top:-0.02em;
  display:inline-block;
  padding-bottom:0.08em;
  font-weight:700;
  letter-spacing:-0.01em;
  background:linear-gradient(100deg,
    #ffffff 0%, #ffffff 38%,
    var(--amber-200) 47%, var(--amber-400) 50%, var(--amber-200) 53%,
    #ffffff 62%, #ffffff 100%);
  background-size:280% 100%;
  background-position:200% 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:brandShimmer 9s ease-in-out infinite 1s;
  will-change:background-position;
}
@keyframes brandShimmer{
  0%{background-position:200% 0;}
  55%{background-position:-120% 0;}
  100%{background-position:-120% 0;}
}
.hero h1 .tech-line{
  position:relative;top:-0.1em;
  display:inline-block;
  color:var(--purple-200);
  letter-spacing:-0.005em;
}
.hero h1 em{font-style:italic;font-weight:500;background:linear-gradient(100deg,var(--amber-300),var(--amber-500));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero .subtitle{color:rgba(255,255,255,0.9);font-size:1.05rem;font-weight:600;margin:18px 0 8px;opacity:0;transform:translateY(20px);animation:fadeUp .9s ease forwards .35s;}
.hero p{color:rgba(255,255,255,0.8);font-size:1.05rem;line-height:1.6;max-width:560px;margin:10px 0 36px;opacity:0;transform:translateY(20px);animation:fadeUp .9s ease forwards .45s;}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;opacity:0;transform:translateY(20px);animation:fadeUp .9s ease forwards .6s;}
@keyframes fadeUp{to{opacity:1;transform:translateY(0);}}
.hero-scroll{position:absolute;right:32px;bottom:36px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;color:rgba(255,255,255,0.6);font-family:var(--font-mono);font-size:0.7rem;letter-spacing:0.1em;}
.hero-scroll .line{width:1px;height:46px;background:linear-gradient(180deg, rgba(255,255,255,0.7), transparent);animation:scrollpulse 1.8s ease-in-out infinite;}
@keyframes scrollpulse{0%,100%{opacity:.3;}50%{opacity:1;}}

/* ---------- SUBPAGE HERO ---------- */
.subhero{
  padding:150px 0 80px;
  background:
    radial-gradient(120% 90% at 85% 0%, rgba(155,132,238,0.3), transparent 55%),
    linear-gradient(160deg, var(--purple-950), var(--purple-900) 60%);
  position:relative;overflow:hidden;
}
.breadcrumb{display:flex;gap:8px;align-items:center;font-size:0.82rem;color:rgba(255,255,255,0.55);margin-bottom:22px;flex-wrap:wrap;}
.breadcrumb a{color:rgba(255,255,255,0.75);font-weight:600;}
.breadcrumb a:hover{color:var(--amber-400);}
.breadcrumb .sep{opacity:.5;}
.subhero .service-tag{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-mono);font-size:0.72rem;font-weight:700;letter-spacing:0.08em;
  background:rgba(255,153,85,0.15);color:var(--amber-300);
  padding:7px 14px;border-radius:100px;border:1px solid rgba(255,153,85,0.3);
  margin-bottom:20px;
}
.subhero h1{color:var(--white);font-size:clamp(2.2rem,4.6vw,3.4rem);max-width:760px;}
.subhero p.lead{color:rgba(255,255,255,0.78);font-size:1.05rem;line-height:1.65;max-width:620px;margin-top:20px;}
.subhero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:32px;}

/* ---------- reveal utility ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease, transform .8s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
.reveal-stagger > *{opacity:0;transform:translateY(28px);transition:opacity .7s ease, transform .7s ease;}
.reveal-stagger.in > *{opacity:1;transform:translateY(0);}
.reveal-stagger.in > *:nth-child(1){transition-delay:.05s;}
.reveal-stagger.in > *:nth-child(2){transition-delay:.14s;}
.reveal-stagger.in > *:nth-child(3){transition-delay:.23s;}
.reveal-stagger.in > *:nth-child(4){transition-delay:.32s;}
.reveal-stagger.in > *:nth-child(5){transition-delay:.41s;}
.reveal-stagger.in > *:nth-child(6){transition-delay:.5s;}
.reveal-stagger.in > *:nth-child(7){transition-delay:.59s;}
.reveal-stagger.in > *:nth-child(8){transition-delay:.68s;}

/* ---------- TRUST STRIP ---------- */
.trust-strip{background:var(--purple-950);padding:20px 0;}
.trust-strip .container{display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:center;}
.trust-item{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,0.75);font-size:0.84rem;font-family:var(--font-mono);letter-spacing:0.02em;}
.trust-item svg{flex-shrink:0;color:var(--amber-400);}

/* ---------- STATS / LICZNIKI ---------- */
.stats{padding:70px 0;background:var(--white);border-bottom:1px solid var(--cream-200);}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.stat-item .num{
  font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3rem);font-weight:700;
  color:var(--purple-900);display:flex;align-items:center;justify-content:center;gap:4px;
}
.stat-item .num .suffix{color:var(--amber-600);}
.stat-item .label{font-size:0.85rem;color:var(--ink-700);margin-top:6px;font-weight:600;}

/* ---------- ABOUT ---------- */
.about{padding:120px 0 100px;}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.about h2{font-size:clamp(2rem,3.4vw,2.9rem);margin:16px 0 22px;}
.about p.lead{font-size:1.05rem;line-height:1.75;color:var(--ink-700);margin-bottom:20px;max-width:520px;}
.about-signal{position:relative;height:340px;}
.about-signal svg{width:100%;height:100%;}
.signal-arc{fill:none;stroke:var(--purple-300);stroke-width:1.5;stroke-dasharray:6 8;stroke-linecap:round;opacity:.55;}
.signal-arc.solid{fill:none;stroke:var(--amber-500);stroke-dasharray:600;stroke-dashoffset:600;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.7,.2,1);opacity:1;}
.about-signal.in .signal-arc.solid{stroke-dashoffset:0;}
.signal-dot{fill:var(--purple-500);}
.signal-node{
  position:absolute;background:var(--white);border-radius:16px;box-shadow:0 18px 40px -16px rgba(43,24,70,0.28);
  padding:14px 16px;display:flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:0.78rem;font-weight:700;color:var(--purple-800);border:1px solid var(--cream-200);
}
.signal-node .ic{color:var(--amber-500);}
.feature-chips{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:32px;}
.feature-chip{display:flex;gap:12px;align-items:flex-start;padding:16px;background:var(--white);border-radius:14px;border:1px solid var(--cream-200);}
.feature-chip .num{font-family:var(--font-mono);color:var(--amber-600);font-weight:700;font-size:0.85rem;}
.feature-chip p{font-size:0.86rem;line-height:1.5;color:var(--ink-700);font-weight:600;}

/* ---------- SERVICES ---------- */
.services{padding:100px 0 120px;background:linear-gradient(180deg, var(--cream-50), var(--cream-100) 60%, var(--cream-50));}
.services-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:52px;flex-wrap:wrap;}
.services-head h2{font-size:clamp(2rem,3.6vw,3rem);max-width:600px;margin-top:14px;}
.services-head p{color:var(--ink-700);max-width:380px;font-size:0.98rem;line-height:1.6;}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.service-card{background:var(--white);border-radius:22px;overflow:hidden;border:1px solid var(--cream-200);transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;display:flex;flex-direction:column;}
.service-card:hover{transform:translateY(-8px);box-shadow:0 30px 50px -22px rgba(43,24,70,0.35);}
.service-photo{position:relative;height:190px;overflow:hidden;}
.service-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.service-card:hover .service-photo img{transform:scale(1.08);}
.service-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent 40%, rgba(27,15,43,0.55));}
.service-code{position:absolute;top:14px;left:14px;z-index:2;font-family:var(--font-mono);font-size:0.68rem;font-weight:700;letter-spacing:0.08em;background:rgba(27,15,43,0.55);color:var(--amber-300);padding:5px 10px;border-radius:100px;backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,0.2);}
.service-body{padding:22px 22px 26px;flex:1;display:flex;flex-direction:column;}
.service-body h3{font-size:1.2rem;margin-bottom:8px;color:var(--purple-950);}
.service-body p{font-size:0.9rem;color:var(--ink-700);line-height:1.55;flex:1;}
.service-link{margin-top:16px;display:inline-flex;align-items:center;gap:8px;font-size:0.84rem;font-weight:700;color:var(--purple-700);}
.service-link svg{transition:transform .25s ease;}
.service-card:hover .service-link svg{transform:translateX(4px);}

/* ---------- SERVICE DETAIL (subpage content) ---------- */
.detail-section{padding:90px 0;}
.detail-section.alt{background:var(--white);}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.detail-grid.reverse .detail-text{order:2;}
.detail-grid.reverse .detail-media{order:1;}
.detail-text h2{font-size:clamp(1.7rem,2.8vw,2.3rem);margin-bottom:18px;}
.detail-text p{font-size:1rem;line-height:1.75;color:var(--ink-700);margin-bottom:16px;}
.detail-text ul{margin:18px 0;display:flex;flex-direction:column;gap:12px;}
.detail-text ul li{display:flex;gap:12px;align-items:flex-start;font-size:0.95rem;color:var(--ink-700);line-height:1.5;}
.detail-text ul li svg{color:var(--amber-500);flex-shrink:0;margin-top:3px;}
.detail-media img{border-radius:22px;box-shadow:0 30px 60px -25px rgba(27,15,43,0.4);}

/* ---------- PROCESS ---------- */
.process{padding:100px 0;background:var(--cream-100);}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:50px;}
.process-step{position:relative;padding:28px 22px;background:var(--white);border-radius:18px;border:1px solid var(--cream-200);}
.process-step .step-num{font-family:var(--font-display);font-size:2.4rem;color:var(--purple-200);font-weight:700;line-height:1;margin-bottom:14px;}
.process-step h4{font-size:1.02rem;margin-bottom:8px;}
.process-step p{font-size:0.87rem;color:var(--ink-700);line-height:1.55;}

/* ---------- CTA BANNER ---------- */
.cta-banner{
  margin:0 auto;max-width:1180px;padding:56px 50px;border-radius:28px;
  background:linear-gradient(120deg, var(--purple-900), var(--purple-700));
  display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;
  position:relative;overflow:hidden;
}
.cta-banner::before{content:"";position:absolute;top:-100px;right:-100px;width:300px;height:300px;background:radial-gradient(circle, rgba(255,153,85,0.25), transparent 65%);}
.cta-banner h3{color:var(--white);font-size:clamp(1.5rem,2.6vw,2rem);max-width:500px;position:relative;z-index:2;}
.cta-banner .actions{display:flex;gap:14px;flex-wrap:wrap;position:relative;z-index:2;}

/* ---------- WHY US ---------- */
.why{padding:110px 0;background:var(--purple-950);position:relative;overflow:hidden;}
.why::before{content:"";position:absolute;top:-200px;right:-150px;width:600px;height:600px;background:radial-gradient(circle, rgba(255,153,85,0.16), transparent 65%);}
.why::after{content:"";position:absolute;bottom:-250px;left:-150px;width:600px;height:600px;background:radial-gradient(circle, rgba(155,132,238,0.22), transparent 65%);}
.why-inner{position:relative;z-index:2;}
.why h2{color:var(--white);font-size:clamp(2rem,3.4vw,2.9rem);max-width:640px;margin:14px 0 60px;}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.why-card{padding:28px 24px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);border-radius:18px;transition:background .3s ease, transform .3s ease;}
.why-card:hover{background:rgba(255,255,255,0.1);transform:translateY(-4px);}
.why-card .ic{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--amber-500),var(--amber-600));display:flex;align-items:center;justify-content:center;margin-bottom:18px;color:var(--white);}
.why-card h4{color:var(--white);font-size:1.03rem;margin-bottom:10px;font-weight:600;}
.why-card p{color:rgba(255,255,255,0.65);font-size:0.86rem;line-height:1.55;}

/* ---------- GALLERY STRIP ---------- */
.strip{display:grid;grid-template-columns:repeat(4,1fr);}
.strip img{width:100%;height:220px;object-fit:cover;filter:saturate(1.05);transition:transform .5s ease;}
.strip a{overflow:hidden;display:block;}
.strip a:hover img{transform:scale(1.06);}

/* ---------- TESTIMONIALS ---------- */
.testimonials{padding:100px 0;background:var(--cream-100);}
.testimonials-head{margin-bottom:46px;max-width:600px;}
.testimonials-head h2{font-size:clamp(2rem,3.4vw,2.8rem);margin-top:14px;}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.testimonial-card{background:var(--white);border:1px solid var(--cream-200);border-radius:20px;padding:28px 26px;display:flex;flex-direction:column;gap:16px;}
.stars{display:flex;gap:3px;color:var(--amber-500);}
.testimonial-card p{font-size:0.94rem;line-height:1.6;color:var(--ink-700);flex:1;}
.testimonial-who{display:flex;align-items:center;gap:12px;}
.testimonial-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--purple-500),var(--purple-800));color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:600;font-size:1rem;flex-shrink:0;}
.testimonial-who h5{font-size:0.9rem;color:var(--purple-950);font-weight:700;}
.testimonial-who span{font-size:0.78rem;color:var(--ink-700);opacity:.75;}

/* ---------- FAQ ---------- */
.faq{padding:100px 0 120px;}
.faq-head{margin-bottom:40px;max-width:600px;}
.faq-head h2{font-size:clamp(2rem,3.4vw,2.8rem);margin-top:14px;}
.faq-list{display:flex;flex-direction:column;gap:14px;max-width:820px;}
.faq-item{background:var(--white);border:1px solid var(--cream-200);border-radius:16px;padding:6px 24px;}
.faq-item summary{list-style:none;cursor:pointer;padding:18px 0;font-weight:700;color:var(--purple-950);font-size:1rem;display:flex;justify-content:space-between;align-items:center;gap:16px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-family:var(--font-mono);font-size:1.3rem;color:var(--amber-500);flex-shrink:0;transition:transform .25s ease;}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{color:var(--ink-700);font-size:0.92rem;line-height:1.6;padding-bottom:20px;}

/* ---------- RELATED SERVICES ---------- */
.related{padding:90px 0;background:var(--white);}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px;}

/* ---------- GALLERY PAGE (realizacje) ---------- */
.gallery-filters{display:flex;gap:10px;flex-wrap:wrap;margin:40px 0 44px;}
.gallery-filter{
  font-family:var(--font-mono);font-size:0.78rem;font-weight:700;letter-spacing:0.03em;
  padding:9px 18px;border-radius:100px;border:1.5px solid var(--cream-200);background:var(--white);
  color:var(--ink-700);cursor:pointer;transition:all .2s ease;
}
.gallery-filter:hover, .gallery-filter.active{background:var(--purple-900);color:#fff;border-color:var(--purple-900);}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.gallery-item{
  position:relative;border-radius:18px;overflow:hidden;background:var(--white);border:1px solid var(--cream-200);
}
.gallery-item img{width:100%;height:230px;object-fit:cover;transition:transform .5s ease;}
.gallery-item:hover img{transform:scale(1.08);}
.gallery-caption{padding:16px 18px;}
.gallery-caption .tag{font-family:var(--font-mono);font-size:0.68rem;color:var(--amber-600);font-weight:700;letter-spacing:0.05em;}
.gallery-caption h4{font-size:0.98rem;margin-top:6px;color:var(--purple-950);}
.gallery-note{
  margin-top:36px;padding:18px 22px;background:var(--cream-100);border-radius:14px;
  font-size:0.85rem;color:var(--ink-700);border-left:3px solid var(--amber-500);
}

/* ---------- BLOG ---------- */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.blog-card{background:var(--white);border-radius:22px;overflow:hidden;border:1px solid var(--cream-200);transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;display:flex;flex-direction:column;}
.blog-card:hover{transform:translateY(-8px);box-shadow:0 30px 50px -22px rgba(43,24,70,0.35);}
.blog-photo{height:190px;overflow:hidden;}
.blog-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.blog-card:hover .blog-photo img{transform:scale(1.08);}
.blog-body{padding:24px 24px 28px;flex:1;display:flex;flex-direction:column;}
.blog-meta{font-family:var(--font-mono);font-size:0.72rem;color:var(--amber-600);font-weight:700;letter-spacing:0.04em;margin-bottom:10px;}
.blog-body h3{font-size:1.15rem;margin-bottom:10px;line-height:1.3;}
.blog-body p{font-size:0.9rem;color:var(--ink-700);line-height:1.55;flex:1;}

.article-body{max-width:760px;margin:0 auto;padding:90px 0 60px;}
.article-body h2{font-size:1.5rem;margin:40px 0 16px;}
.article-body h3{font-size:1.15rem;margin:28px 0 12px;}
.article-body p{font-size:1.02rem;line-height:1.8;color:var(--ink-700);margin-bottom:18px;}
.article-body ul, .article-body ol{margin:0 0 20px 22px;color:var(--ink-700);font-size:1.02rem;line-height:1.8;}
.article-body li{margin-bottom:8px;}
.article-meta{display:flex;gap:16px;align-items:center;color:var(--ink-700);font-size:0.85rem;font-family:var(--font-mono);margin-bottom:10px;flex-wrap:wrap;}
.article-meta span::before{content:"·";margin-right:16px;color:var(--amber-500);}
.article-meta span:first-child::before{content:"";margin-right:0;}
.article-callout{
  background:var(--cream-100);border-left:4px solid var(--amber-500);border-radius:0 14px 14px 0;
  padding:20px 24px;margin:28px 0;font-size:0.98rem;color:var(--ink-700);
}
.article-share{display:flex;gap:14px;margin-top:40px;padding-top:30px;border-top:1px solid var(--cream-200);}

/* ---------- CONTACT ---------- */
.contact{padding:120px 0;}
.contact-grid{display:grid;grid-template-columns:0.95fr 1.15fr;gap:60px;}
.contact-info h2{font-size:clamp(2rem,3.4vw,2.8rem);margin:14px 0 20px;}
.contact-info p.lead{color:var(--ink-700);line-height:1.7;margin-bottom:34px;max-width:440px;}
.contact-card{display:flex;gap:16px;align-items:flex-start;padding:20px 0;border-top:1px solid var(--cream-200);}
.contact-card:last-of-type{border-bottom:1px solid var(--cream-200);}
.contact-card .ic{width:42px;height:42px;border-radius:11px;background:var(--purple-950);display:flex;align-items:center;justify-content:center;color:var(--amber-400);flex-shrink:0;}
.contact-card h4{font-size:0.95rem;color:var(--purple-950);margin-bottom:4px;}
.contact-card p, .contact-card a{font-size:0.92rem;color:var(--ink-700);}
.contact-card a:hover{color:var(--purple-700);}
.map-embed{margin-top:30px;border-radius:18px;overflow:hidden;border:1px solid var(--cream-200);height:220px;filter:saturate(0.4) contrast(1.05);}
.map-embed iframe{width:100%;height:100%;border:0;}
.form-panel{background:var(--white);border:1px solid var(--cream-200);border-radius:26px;padding:44px;box-shadow:0 30px 60px -30px rgba(43,24,70,0.25);}
.form-panel h3{font-size:1.4rem;margin-bottom:6px;}
.form-panel > p{color:var(--ink-700);font-size:0.9rem;margin-bottom:28px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field.full{grid-column:1/-1;}
.field label{font-size:0.78rem;font-weight:700;color:var(--purple-900);font-family:var(--font-mono);letter-spacing:0.02em;}
.field input, .field textarea, .field select{border:1.5px solid var(--cream-200);background:var(--cream-50);border-radius:11px;padding:12px 14px;font-family:var(--font-body);font-size:0.94rem;color:var(--ink-900);transition:border-color .2s ease, background .2s ease;resize:vertical;}
.field input:focus, .field textarea:focus, .field select:focus{outline:none;border-color:var(--purple-400);background:var(--white);}
.form-panel button{width:100%;justify-content:center;margin-top:6px;}
.form-note{font-size:0.76rem;color:var(--ink-700);opacity:.7;margin-top:14px;text-align:center;}
.form-success{display:none;padding:16px 18px;border-radius:12px;background:#EAF7EE;color:#1E6B3B;font-size:0.88rem;font-weight:600;margin-top:16px;}
.form-success.show{display:block;}

/* ---------- FOOTER ---------- */
footer{background:var(--purple-950);color:rgba(255,255,255,0.65);padding:96px 0 30px;margin-top:6px;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:32px;padding-bottom:50px;border-bottom:1px solid rgba(255,255,255,0.1);}
.footer-logo{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.footer-logo img{height:38px;}
.footer-word{font-family:var(--font-display);color:var(--white);font-size:1.1rem;font-weight:600;}
footer .col h5{color:var(--white);font-size:0.82rem;letter-spacing:0.06em;margin-bottom:18px;font-family:var(--font-mono);text-transform:uppercase;}
footer .col li{margin-bottom:11px;font-size:0.88rem;}
footer .col a:hover{color:var(--amber-400);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:26px;font-size:0.8rem;flex-wrap:wrap;gap:10px;}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 980px){
  nav ul{display:none;}
  .burger{display:flex;}
  .about-grid{grid-template-columns:1fr;gap:50px;}
  .about-signal{order:-1;height:280px;}
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .testimonials-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .strip{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .detail-grid, .detail-grid.reverse{grid-template-columns:1fr;}
  .detail-grid.reverse .detail-text, .detail-grid.reverse .detail-media{order:initial;}
  .process-grid{grid-template-columns:repeat(2,1fr);}
  .related-grid{grid-template-columns:1fr 1fr;}
  .cta-banner{flex-direction:column;text-align:center;padding:44px 30px;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .blog-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width: 620px){
  .container{padding:0 20px;}
  .services-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .strip{grid-template-columns:1fr 1fr;}
  .trust-strip .container{justify-content:center;text-align:center;}
  .footer-grid{grid-template-columns:1fr;}
  .hero{padding-top:90px;}
  .hero-scroll{display:none;}
  .nav-phone span.txt{display:none;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  .process-grid{grid-template-columns:1fr;}
  .related-grid{grid-template-columns:1fr;}
  .subhero{padding:130px 0 60px;}
  .gallery-grid{grid-template-columns:1fr;}
  .blog-grid{grid-template-columns:1fr;}
  .article-body{padding:110px 0 50px;}
}
