:root{--black:#090b0d;--dark:#11161a;--graphite:#171d21;--steel:#aab5bd;--white:#f5f6f7;--paper:#eef0f1;--ink:#11161a;--line:#30383e}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--black);color:var(--white);overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
section[id]{scroll-margin-top:74px}

.topbar{height:74px;position:fixed;z-index:50;inset:0 0 auto;display:flex;align-items:center;padding:0 5vw;background:rgba(7,10,12,.9);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1}
.brand strong{font-size:24px;letter-spacing:-1px}
.brand span{font-size:8px;letter-spacing:4px;margin-top:7px;color:#aeb8bf}
nav{margin-left:auto;display:flex;gap:30px}
nav a{text-decoration:none;font-size:12px;letter-spacing:.5px;color:#e6eaec}
.menu{display:none;margin-left:auto;background:none;border:0;color:white;font-size:25px;cursor:pointer}

.hero{height:100svh;min-height:680px;position:relative;display:flex;align-items:center;padding:110px 5vw 70px;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,7,9,.94) 0%,rgba(5,7,9,.72) 50%,rgba(5,7,9,.38) 100%),url('assets/images/hero.webp') 60% center/cover no-repeat;filter:saturate(.55) contrast(1.05)}
.hero-content{position:relative;z-index:2;width:min(900px,78vw)}
.eyebrow{margin:0 0 22px;font-size:10px;line-height:1.5;letter-spacing:5px;color:#aeb9c1}
.eyebrow.dark{color:#68757d}
.hero h1{margin:0;font-size:clamp(52px,6.7vw,104px);line-height:.91;letter-spacing:-4.5px;max-width:900px}
.hero h1 span{color:#aab5bd}
.lead{margin:28px 0 0;font-size:15px;letter-spacing:1.2px;color:#e6e9eb}
.lead i{font-style:normal;color:#77858e;margin:0 8px}
.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.5px;padding:19px 22px}
.hero-cta{margin-top:34px;background:#edf1f3;color:#101519;min-width:220px}
.scroll-hint{position:absolute;z-index:2;right:5vw;bottom:40px;font-size:9px;letter-spacing:3px;color:#8f9ba3}.scroll-hint span{margin-left:12px}

.capabilities{background:var(--paper);color:var(--ink);padding:105px 5vw}
.section-head{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:40px;align-items:start;margin-bottom:65px}
.section-head h2,.project-heading h2,.contact h2{margin:0;font-size:clamp(34px,3.6vw,56px);line-height:.95;letter-spacing:-3px}
.section-head>p:last-child{margin:5px 0 0;color:#59656d;font-size:15px;line-height:1.7;max-width:440px}
.cap-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #c9ced1}
.cap-grid article{padding:28px 28px 20px 0;border-right:1px solid #c9ced1;margin-right:28px;min-height:215px}
.cap-grid article:last-child{border:0;margin:0}
.cap-grid b,.process-row b{font-size:11px;letter-spacing:2px;color:#89969e}
.cap-grid h3{font-size:22px;margin:52px 0 10px}
.cap-grid p{margin:0;color:#5d686f;font-size:14px;line-height:1.55}

.projects{padding:105px 5vw;background:#0c1013}
.project-heading{display:grid;grid-template-columns:2fr 1fr;gap:50px;align-items:end;margin-bottom:55px}
.project-heading>p{color:#9da8af;line-height:1.65;max-width:430px;margin:0 0 5px}
.project-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:16px}
.project{position:relative;margin:0;overflow:hidden;background:#161b1f;min-height:420px}
.project.feature{grid-row:span 2;min-height:856px}
.project.wide{grid-column:1/-1;min-height:500px}
.project img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .5s ease;filter:saturate(.82)}
.project:hover img{transform:scale(1.018)}
.project figcaption{position:absolute;inset:auto 0 0;padding:80px 26px 24px;background:linear-gradient(transparent,rgba(0,0,0,.88));display:flex;flex-direction:column}
.project figcaption span{font-size:9px;letter-spacing:2px;color:#b7c0c6;margin-bottom:8px}
.project figcaption strong{font-size:18px}

.process{padding:105px 5vw;background:#141a1e}
.process-head{grid-template-columns:1fr 2.5fr;margin-bottom:70px}
.process-row{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #394147}
.process-row>div{padding:28px 28px 10px 0;border-right:1px solid #394147;margin-right:28px}
.process-row>div:last-child{border:0;margin:0}
.process-row h3{text-transform:uppercase;margin:48px 0 10px;font-size:16px}
.process-row p{margin:0;color:#9ba6ad;font-size:13px;line-height:1.5}

.contact{background:var(--paper);color:var(--ink);padding:110px 5vw}
.contact h2{font-size:clamp(50px,7vw,105px)}
.contact-lead{font-size:18px;color:#5c686f;margin:24px 0 32px}
.contact-btn{background:#26343e;color:white;min-width:285px}
.contact-note{font-size:11px;color:#7c878e;margin-top:18px}
footer{padding:34px 5vw;display:flex;justify-content:space-between;align-items:center;color:#8d989f;font-size:11px}

@media(max-width:900px){
  nav{display:none;position:absolute;top:74px;left:0;right:0;background:#0b0e10;padding:24px 5vw;flex-direction:column}
  nav.open{display:flex}.menu{display:block}
  .section-head{grid-template-columns:1fr 2fr}.section-head>p:last-child{grid-column:2}
  .cap-grid{grid-template-columns:1fr 1fr}
  .cap-grid article:nth-child(2){border-right:0;margin-right:0}
  .project-grid{grid-template-columns:1fr 1fr}.project.feature{grid-row:auto;grid-column:1/-1;min-height:600px}
  .process-row{grid-template-columns:1fr 1fr;gap:0}
}

@media(max-width:600px){
  section[id]{scroll-margin-top:66px}
  .topbar{height:66px;padding:0 20px}.brand strong{font-size:21px}.brand span{font-size:7px;letter-spacing:3.5px}
  nav{top:66px;padding:22px 20px}
  /* V7.18: egyetlen mobil hero szabályblokk – nincs egymásra írt patch. */
  .hero{height:calc(100vh - 66px);height:calc(100svh - 66px);min-height:560px;padding:74px 20px 36px;align-items:center}
  .hero-bg{inset:0;background:linear-gradient(90deg,rgba(5,7,9,.94) 0%,rgba(5,7,9,.72) 50%,rgba(5,7,9,.38) 100%),url('assets/images/hero.webp') 68% center/cover no-repeat;filter:saturate(.55) contrast(1.05)}
  .hero-content{width:100%;position:relative;z-index:2}
  .hero .eyebrow{font-size:9px;letter-spacing:3px;margin-bottom:18px;color:#aeb9c1}
  .hero h1{font-size:clamp(39px,11vw,52px);line-height:.95;letter-spacing:-2px;color:#f5f6f7}
  .hero h1 span{color:#aab5bd}
  .hero .lead{font-size:12px;line-height:1.8;max-width:300px;margin-top:22px;color:#e6e9eb}
  .hero .lead i{margin:0 3px;color:#77858e}
  .hero-cta{margin-top:28px;width:100%;max-width:290px}.scroll-hint{display:none}
  .capabilities,.projects,.process,.contact{padding:72px 20px}
  .section-head,.project-heading,.process-head{display:block;margin-bottom:42px}
  .section-head h2,.project-heading h2{font-size:clamp(30px,8vw,40px);letter-spacing:-2px}
  .section-head>p:last-child{margin-top:22px}
  .cap-grid{grid-template-columns:1fr;border-top:1px solid #c9ced1}
  .cap-grid article,.cap-grid article:nth-child(2){min-height:auto;margin:0;padding:22px 0 25px;border-right:0;border-bottom:1px solid #c9ced1}
  .cap-grid article:last-child{border-bottom:0}.cap-grid h3{margin:24px 0 8px;font-size:20px}
  .project-heading>p{margin-top:22px}
  .project-grid{display:block}.project,.project.feature,.project.wide{min-height:0;aspect-ratio:4/3;margin-bottom:12px}
  .project.feature{aspect-ratio:4/5}
  .project figcaption{padding:55px 17px 16px}.project figcaption strong{font-size:16px}
  .process-row{grid-template-columns:1fr}
  .process-row>div{margin:0;padding:22px 0 25px;border-right:0;border-bottom:1px solid #394147}
  .process-row>div:last-child{border-bottom:0}.process-row h3{margin:25px 0 8px}
  .contact h2{font-size:clamp(44px,13vw,64px);letter-spacing:-2.5px}
  .contact-btn{width:100%;max-width:330px;min-width:0}
  footer{padding:30px 20px;gap:24px;align-items:flex-start;flex-direction:column}
}

/* ===== BPWELDING PROFESSIONAL V4 – DESKTOP FINOMHANGOLÁS ===== */

/* fejléc */
nav{align-items:center}
nav a{position:relative;padding:8px 0;transition:color .2s ease}
nav a:not(.nav-cta)::after{
  content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;
  background:#f5f6f7;transition:right .25s ease
}
nav a:not(.nav-cta):hover::after{right:0}
.nav-cta{
  margin-left:8px;padding:11px 15px;background:#edf1f3;color:#101519;
  font-weight:800;letter-spacing:.3px
}

/* hero: több levegő, kevésbé túlméretezett cím, jobb fotófókusz */
@media(min-width:901px){
  .hero-bg{
    background:
      linear-gradient(90deg,rgba(5,7,9,.94) 0%,rgba(5,7,9,.72) 46%,rgba(5,7,9,.30) 100%),
      url('assets/images/hero.webp') 68% center/cover no-repeat
  }
  .hero-content{width:min(820px,67vw)}
  .hero h1{
    font-size:clamp(54px,5.65vw,88px);
    line-height:.93;
    letter-spacing:-3.8px;
    max-width:820px
  }
  .lead{margin-top:25px}
  .hero-cta{margin-top:31px}
}

/* szolgáltatások: finomabb kártya-interakció */
.cap-grid article{transition:transform .22s ease}
@media(hover:hover) and (pointer:fine){
  .cap-grid article:hover{transform:translateY(-4px)}
}

/* referenciák: tisztább ritmus és enyhe képinterakció */
.project-grid{gap:18px}
.project figcaption{transition:padding-bottom .25s ease}
@media(hover:hover) and (pointer:fine){
  .project:hover figcaption{padding-bottom:30px}
}

/* folyamat */
.process-row h3{letter-spacing:.1px}

/* alsó CTA: ne legyen második hero */
@media(min-width:901px){
  .contact{padding-top:90px;padding-bottom:90px}
  .contact h2{
    font-size:clamp(52px,5.6vw,82px);
    line-height:.96;
    letter-spacing:-3px
  }
  .contact-lead{margin-top:20px}
}

/* mobilon a fejléc CTA ne jelenjen meg a lenyíló menüben */
@media(max-width:900px){
  .nav-cta{display:none}
}

/* hozzáférhetőség */
a:focus-visible,button:focus-visible{outline:2px solid #f5f6f7;outline-offset:4px}


/* ===== V5 – VÉGLEGES KAPCSOLATI BLOKK ===== */
.contact-grid{
  margin-top:48px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid #c9ced1;
}
.contact-item{
  position:relative;
  min-height:125px;
  padding:25px 58px 24px 0;
  text-decoration:none;
  color:#11161a;
  border-bottom:1px solid #c9ced1;
  transition:padding-left .2s ease,background .2s ease;
}
.contact-item:nth-child(odd){border-right:1px solid #c9ced1;margin-right:30px}
.contact-item:nth-child(even){padding-left:30px}
.contact-item span{display:block;font-size:9px;letter-spacing:2.5px;color:#71808a;margin-bottom:25px}
.contact-item strong{font-size:clamp(17px,1.45vw,23px);letter-spacing:-.4px}
.contact-item b{position:absolute;right:18px;bottom:27px;font-size:18px;font-weight:400}
.contact-primary strong{font-size:clamp(21px,1.7vw,27px)}
@media(hover:hover) and (pointer:fine){
  .contact-item:hover{background:rgba(30,43,52,.045)}
  .contact-item:nth-child(odd):hover{padding-left:12px}
  .contact-item:nth-child(even):hover{padding-left:42px}
}
@media(max-width:600px){
  .contact-grid{grid-template-columns:1fr;margin-top:36px}
  .contact-item,.contact-item:nth-child(odd),.contact-item:nth-child(even){
    min-height:105px;margin:0;padding:21px 45px 20px 0;border-right:0
  }
  .contact-item span{margin-bottom:17px}
  .contact-item strong,.contact-primary strong{font-size:18px}
  .contact-item b{right:4px;bottom:23px}
}


/* ===== V5.1 – KOMPAKT DESKTOP KAPCSOLAT ===== */
@media(min-width:901px){
  .contact{
    padding-top:64px;
    padding-bottom:58px;
  }
  .contact .eyebrow{
    margin-bottom:15px;
  }
  .contact h2{
    font-size:clamp(46px,4.4vw,68px);
    line-height:.96;
    letter-spacing:-2.6px;
  }
  .contact-lead{
    margin:14px 0 0;
    font-size:16px;
  }
  .contact-grid{
    margin-top:32px;
  }
  .contact-item{
    min-height:88px;
    padding-top:17px;
    padding-bottom:15px;
  }
  .contact-item:nth-child(even){
    padding-left:30px;
  }
  .contact-item span{
    margin-bottom:13px;
  }
  .contact-item strong{
    font-size:clamp(16px,1.25vw,20px);
  }
  .contact-primary strong{
    font-size:clamp(18px,1.45vw,23px);
  }
  .contact-item b{
    bottom:20px;
  }
}


/* ===== V5.2 – EXTRA KOMPAKT DESKTOP KAPCSOLAT ===== */
@media(min-width:901px){
  .contact{
    padding-top:42px;
    padding-bottom:38px;
  }
  .contact .eyebrow{
    margin-bottom:10px;
  }
  .contact h2{
    font-size:clamp(40px,3.7vw,58px);
    line-height:.97;
    letter-spacing:-2.2px;
  }
  .contact-lead{
    font-size:14px;
    margin:10px 0 0;
  }
  .contact-grid{
    margin-top:22px;
    grid-template-columns:repeat(5,minmax(0,1fr));
    border-top:1px solid #c9ced1;
    border-bottom:1px solid #c9ced1;
  }
  .contact-item,
  .contact-item:nth-child(odd),
  .contact-item:nth-child(even){
    min-height:78px;
    margin:0;
    padding:14px 28px 13px 14px;
    border-right:1px solid #c9ced1;
    border-bottom:0;
  }
  .contact-item:first-child{padding-left:0}
  .contact-item:last-child{border-right:0}
  .contact-item span{
    font-size:8px;
    letter-spacing:2px;
    margin-bottom:11px;
  }
  .contact-item strong,
  .contact-primary strong{
    font-size:clamp(13px,1.05vw,17px);
    white-space:nowrap;
  }
  .contact-item b{
    right:10px;
    bottom:16px;
    font-size:14px;
  }
  @media(hover:hover) and (pointer:fine){
    .contact-item:nth-child(odd):hover,
    .contact-item:nth-child(even):hover{
      padding-left:14px;
    }
    .contact-item:first-child:hover{padding-left:5px}
  }
  footer{
    padding-top:25px;
    padding-bottom:25px;
  }
}


/* ===== V5.3 – 3 contact items + social links in footer ===== */
@media(min-width:901px){
  .contact-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .contact-item:nth-child(3){
    border-right:0;
  }
}
.footer-socials{
  display:flex;
  align-items:center;
  gap:22px;
  margin-left:auto;
}
.footer-socials a{
  color:inherit;
  text-decoration:none;
  font-size:11px;
  font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  opacity:.72;
  transition:opacity .2s ease;
}
.footer-socials a:hover{opacity:1}
@media(max-width:900px){
  .footer-socials{
    margin-left:0;
    gap:16px;
    flex-wrap:wrap;
  }
}


/* ===== V5.4 – footer social links directly beside BPWELDING ===== */
@media(min-width:901px){
  footer .container,
  footer .footer-inner{
    display:flex;
    align-items:center;
  }
  .footer-socials{
    margin-left:28px !important;
    margin-right:auto;
    padding-left:28px;
    border-left:1px solid rgba(255,255,255,.22);
    gap:24px;
  }
  .footer-socials a + a{
    padding-left:24px;
    border-left:1px solid rgba(255,255,255,.22);
  }
}


/* ===== V5.5 – corrected footer DOM/layout ===== */
footer{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}
.footer-left{
  display:flex;
  align-items:center;
  gap:28px;
}
.footer-left > .brand{
  flex:0 0 auto;
}
.footer-left > .footer-socials{
  display:flex !important;
  align-items:center;
  gap:0 !important;
  margin:0 !important;
  padding:0 !important;
  border-left:1px solid rgba(255,255,255,.22);
}
.footer-left > .footer-socials a{
  display:flex;
  align-items:center;
  min-height:34px;
  margin:0 !important;
  padding:0 24px !important;
  border:0 !important;
  color:inherit;
  text-decoration:none;
  white-space:nowrap;
}
.footer-left > .footer-socials a + a{
  border-left:1px solid rgba(255,255,255,.22) !important;
}
.footer-copy{
  margin-left:auto;
  white-space:nowrap;
}
@media(max-width:900px){
  footer{
    align-items:flex-start !important;
    gap:22px;
  }
  .footer-left{
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
  }
  .footer-left > .footer-socials{
    border-left:0;
  }
  .footer-left > .footer-socials a{
    padding:0 16px 0 0 !important;
  }
  .footer-left > .footer-socials a + a{
    padding-left:16px !important;
  }
}


/* ===== V5.6 – Instagram / Facebook icons ===== */
.footer-socials a{
  gap:9px;
}
.social-icon{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:block;
}
.footer-socials a span{
  line-height:1;
}


/* ===== V6 – clickable service cards ===== */
.cap-card{
  display:block;
  color:inherit;
  text-decoration:none;
  position:relative;
}
.cap-card span{
  display:inline-block;
  margin-top:22px;
  font-size:9px;
  font-weight:800;
  letter-spacing:1.7px;
  opacity:.55;
  transition:opacity .2s ease, transform .2s ease;
}
.cap-card:hover span{
  opacity:1;
  transform:translateX(4px);
}

/* ===== V6 – service detail pages ===== */
.service-page{background:#eef0f1;color:#0d1216;min-height:100vh}
.service-page .service-nav{
  height:92px;background:#080d10;color:#fff;display:flex;align-items:center;
  justify-content:space-between;padding:0 5vw;
}
.service-page .service-nav .brand{text-decoration:none;color:#fff}
.service-page .service-nav .back{color:#fff;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:1px}
.service-hero{padding:92px 5vw 72px;max-width:1500px;margin:auto}
.service-hero .eyebrow{margin-bottom:22px}
.service-hero h1{font-size:clamp(48px,6.2vw,94px);line-height:.93;letter-spacing:-4px;margin:0;max-width:1050px}
.service-hero .lead{font-size:clamp(17px,1.6vw,23px);line-height:1.55;max-width:760px;color:#667079;margin:30px 0 0}
.service-content{max-width:1500px;margin:auto;padding:0 5vw 80px}
.service-list{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #c9ced1}
.service-box{padding:32px 28px 34px 0;border-bottom:1px solid #c9ced1;min-height:145px}
.service-box:not(:nth-child(3n+1)){padding-left:28px;border-left:1px solid #c9ced1}
.service-box b{display:block;font-size:10px;letter-spacing:2px;color:#71808a;margin-bottom:18px}
.service-box h2{font-size:21px;margin:0 0 10px}
.service-box p{font-size:14px;line-height:1.55;color:#667079;margin:0}
.service-cta{background:#10171b;color:#fff;padding:54px 5vw;display:flex;justify-content:space-between;align-items:center;gap:30px}
.service-cta h2{font-size:clamp(30px,3.4vw,52px);margin:0;letter-spacing:-1.5px}
.service-cta a{background:#fff;color:#0d1216;padding:18px 24px;text-decoration:none;font-weight:800;font-size:12px;white-space:nowrap}
@media(max-width:800px){
  .service-page .service-nav{height:74px}
  .service-hero{padding:64px 6vw 48px}
  .service-hero h1{font-size:46px;letter-spacing:-2px}
  .service-content{padding:0 6vw 56px}
  .service-list{grid-template-columns:1fr}
  .service-box,.service-box:not(:nth-child(3n+1)){padding:24px 0;border-left:0}
  .service-cta{padding:42px 6vw;display:block}
  .service-cta a{display:inline-block;margin-top:24px}
}


/* ===== V6.1 – telephely ===== */
@media(min-width:901px){
  .contact-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
  .contact-item:nth-child(3){border-right:1px solid #c9ced1;}
  .contact-item:nth-child(4){border-right:0;}
}
.contact-item small{
  display:block;
  margin-top:5px;
  font-size:10px;
  font-weight:600;
  letter-spacing:.5px;
  color:#6d777d;
}


/* ===== V6.3 – szolgáltatás aloldalak finomhangolása ===== */
@media (min-width: 901px){
  .service-page .service-hero h1{
    font-size: clamp(48px, 5.1vw, 74px);
    line-height: .96;
    max-width: 1050px;
  }
  .service-page .service-hero{
    padding-top: 82px;
    padding-bottom: 70px;
  }
  .service-page .service-hero .lead{
    max-width: 820px;
    margin-top: 28px;
  }
  .service-page .service-grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .service-page .service-box{
    min-width: 0;
  }
}


/* ===== V6.4 – visszafogottabb szolgáltatásoldal cím ===== */
@media (min-width: 901px){
  .service-page .service-hero h1{
    font-size: clamp(40px, 4vw, 58px);
    line-height: 1.02;
    max-width: 1000px;
    letter-spacing: -1.5px;
  }
  .service-page .service-hero{
    padding-top: 72px;
    padding-bottom: 62px;
  }
}


/* ===== V6.5 – 4 szolgáltatási pont egy sorban ===== */
@media (min-width: 901px){
  .service-page .service-cards{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .service-page .service-card{
    min-width: 0;
  }
}


/* ===== V6.6 – valódi 4 oszlopos szolgáltatáslista ===== */
@media (min-width: 901px){
  .service-page .service-list{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .service-page .service-box{
    min-width: 0;
    padding: 32px 28px 34px;
    border-left: 1px solid #c9ced1;
  }
  .service-page .service-box:first-child{
    padding-left: 0;
    border-left: 0;
  }
}


/* ===== V7.0 – főoldali szolgáltatás blokk finomhangolás ===== */
@media (min-width: 1100px){
  #szolgaltatasok .cap-grid{
    column-gap: 22px;
  }
  #szolgaltatasok .cap-card{
    min-width: 0;
    padding-right: 8px;
  }
  #szolgaltatasok .cap-card p{
    max-width: 100%;
  }

  /* felső bevezető szöveg maradjon a főcím közelében */
  #szolgaltatasok .section-intro,
  #szolgaltatasok .section-head > p,
  #szolgaltatasok .section-head .intro{
    max-width: 330px;
    justify-self: start;
    margin-left: 0;
  }
}


/* ===== V7.1 – szolgáltatás fejléc: a leírás ne ússzon jobbra ===== */
@media (min-width: 1100px){
  #szolgaltatasok .section-head{
    grid-template-columns: 320px 560px 360px;
    column-gap: 42px;
    justify-content: start;
  }
  #szolgaltatasok .section-head > p:last-child{
    width: 360px;
    max-width: 360px;
    justify-self: start;
    margin: 10px 0 0 0;
  }

  #szolgaltatasok .cap-grid{
    column-gap: 22px;
  }
}


/* ===== V7.2 – főoldali szolgáltatás fejléc egy sorban ===== */
@media (min-width: 1100px){
  #szolgaltatasok .section-head{
    display:grid;
    grid-template-columns: 330px minmax(0, 1fr);
    grid-template-areas:
      "eyebrow eyebrow"
      "title intro";
    column-gap: 48px;
    row-gap: 22px;
    align-items:start;
  }
  #szolgaltatasok .section-head > .eyebrow{
    grid-area:eyebrow;
    margin:0;
  }
  #szolgaltatasok .section-head > h2{
    grid-area:title;
    white-space:nowrap;
    font-size:clamp(48px,4.5vw,70px);
    line-height:.96;
    margin:0;
    letter-spacing:-2px;
  }
  #szolgaltatasok .section-head > p:last-child{
    grid-area:intro;
    width:auto;
    max-width:360px;
    margin:8px 0 0 0;
    justify-self:end;
  }
}


/* ===== V7.3 – szolgáltatás fejléc véglegesebb desktop elrendezés ===== */
@media (min-width: 1100px){
  #szolgaltatasok .section-head{
    display:block;
  }
  #szolgaltatasok .section-head > .eyebrow{
    margin:0 0 26px 0;
  }
  #szolgaltatasok .section-head > h2{
    white-space:nowrap;
    font-size:clamp(46px,4.25vw,66px);
    line-height:1;
    letter-spacing:-2px;
    margin:0;
  }
  #szolgaltatasok .section-head > p:last-child{
    width:auto;
    max-width:700px;
    margin:22px 0 0 0;
    font-size:16px;
    line-height:1.55;
  }
}


/* ===== V7.4 – bevezető szöveg a főcím alá, balra ===== */
@media (min-width: 1100px){
  #szolgaltatasok .section-head > p:last-child{
    width:auto;
    max-width:700px;
    margin:22px 0 0 0;
    justify-self:auto;
    text-align:left;
  }
}


/* ===== V7.5 – fémmegmunkálás kártyák kompaktabb függőleges kiosztása ===== */
@media (min-width: 900px){
  body.service-page .service-grid .service-box,
  body.service-page .service-grid > article,
  body.service-page .service-grid > div{
    padding-top: 26px;
    padding-bottom: 26px;
  }
}


/* ===== V7.6 – fémmegmunkálás: mindkét sor bal széle nyitott ===== */
@media (min-width: 901px){
  .service-page .service-list .service-box:nth-child(5){
    border-left: 0;
    padding-left: 0;
  }
}


/* ===== V7.7 – Gyártás / Felületkezelés ===== */
.surface-treatment{
  display:grid;
  grid-template-columns:70px 1.55fr 1fr 1fr;
  gap:28px;
  align-items:start;
  border-bottom:1px solid #c9ced1;
  padding:28px 0 30px;
}
.surface-treatment>b{font-size:10px;letter-spacing:2px;color:#71808a;padding-top:4px}
.surface-treatment h2{font-size:24px;margin:0 0 8px}
.surface-treatment h3{font-size:17px;margin:0 0 7px}
.surface-treatment p{font-size:14px;line-height:1.55;color:#667079;margin:0}
.surface-title{padding-right:18px}
.surface-item{border-left:1px solid #c9ced1;padding-left:28px;min-height:64px}
@media (max-width:899px){
  .surface-treatment{grid-template-columns:1fr;gap:16px;padding:24px 0 28px}
  .surface-treatment>b{padding:0}
  .surface-title{padding:0}
  .surface-item{border-left:0;border-top:1px solid #c9ced1;padding:18px 0 0;min-height:0}
}


/* ===== V7.8 – Gyártás / kompakt felületkezelés ===== */
.surface-treatment{
  grid-template-columns:1.8fr 1fr 1fr;
  gap:0;
  align-items:center;
  padding:20px 0 22px;
}
.surface-heading{display:flex;align-items:baseline;gap:18px;margin-bottom:5px}
.surface-heading>b{font-size:10px;letter-spacing:2px;color:#71808a;white-space:nowrap}
.surface-treatment h2{font-size:22px;margin:0}
.surface-treatment h3{font-size:16px;margin:0 0 5px}
.surface-treatment p{font-size:13px;line-height:1.45}
.surface-title{padding-right:34px}
.surface-item{padding-left:30px;min-height:52px;display:flex;flex-direction:column;justify-content:center}
@media (max-width:899px){
  .surface-treatment{grid-template-columns:1fr;gap:0;padding:20px 0 24px}
  .surface-heading{gap:12px;margin-bottom:7px}
  .surface-title{padding:0 0 16px}
  .surface-item{padding:16px 0 0;min-height:0}
}

/* ===== V7.9 – Gyártás / felületkezelés osztások a felső rácshoz igazítva ===== */
@media (min-width: 900px){
  .surface-treatment{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:0;
  }
  .surface-title{
    grid-column:1 / span 2;
    padding-right:30px;
  }
  .surface-item{
    padding-left:28px;
  }
}
\n\n/* ===== V7.10 – Kivitelezés / üveges kiegészítések ===== */\n.glass-addons{\n  display:grid;\n  grid-template-columns:repeat(4,minmax(0,1fr));\n  border-bottom:1px solid #c9ced1;\n}\n.glass-box{\n  min-width:0;\n  padding:24px 28px 26px;\n  border-left:1px solid #c9ced1;\n}\n.glass-box:first-child{\n  border-left:0;\n  padding-left:0;\n}\n.glass-box b{\n  display:block;\n  margin-bottom:16px;\n  font-size:10px;\n  letter-spacing:2px;\n  color:#71808a;\n}\n.glass-box h2{font-size:22px;margin:0 0 8px}\n.glass-box h3{font-size:17px;margin:24px 0 7px}\n.glass-box p{font-size:14px;line-height:1.55;color:#667079;margin:0}\n@media(max-width:899px){\n  .glass-addons{grid-template-columns:1fr}\n  .glass-box,.glass-box:first-child{padding:22px 0;border-left:0;border-top:1px solid #c9ced1}\n  .glass-box:first-child{border-top:0}\n  .glass-box h3{margin-top:0}\n}\n

/* ===== V7.11 – Kivitelezés / üveges sor azonos 4 oszlopos rácson ===== */
@media (min-width: 901px){
  .service-page .glass-service-list{
    margin-top:-1px;
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .service-page .glass-service-list .service-box{
    min-width:0;
    padding:32px 28px 34px;
    border-left:1px solid #c9ced1;
  }
  .service-page .glass-service-list .service-box:first-child{
    padding-left:0;
    border-left:0;
  }
}

/* ===== V7.12 – Kivitelezés / kompakt rácsmagasság ===== */
@media (min-width:901px){
  body.kivitelezes-page .service-list .service-box,
  body.kivitelezes-page .glass-service-list .service-box{
    padding-top:20px;
    padding-bottom:20px;
    min-height:0;
  }
  body.kivitelezes-page .service-list .service-box b{
    margin-bottom:14px;
  }
  body.kivitelezes-page .service-list .service-box h2{
    margin-bottom:7px;
  }
}

/* ===== V7.13 – szolgáltatás aloldalak mobil javítás ===== */
@media (max-width: 800px){
  body.service-page .service-nav{
    position:relative;
    inset:auto;
    top:auto;
    left:auto;
    right:auto;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    width:100%;
    height:66px;
    margin:0;
    padding:0 20px;
    background:#080d10;
    gap:14px;
  }
  body.service-page .service-nav .brand{
    display:flex;
    flex-direction:column;
    flex:0 1 auto;
    width:auto;
    padding:0;
    margin:0;
    border:0;
  }
  body.service-page .service-nav .brand::after,
  body.service-page .service-nav .back::after{
    display:none !important;
    content:none !important;
  }
  body.service-page .service-nav .brand strong{
    font-size:18px;
    letter-spacing:-.5px;
  }
  body.service-page .service-nav .brand span{
    font-size:6px;
    letter-spacing:2.7px;
    margin-top:5px;
    white-space:nowrap;
  }
  body.service-page .service-nav .back{
    flex:0 0 auto;
    padding:8px 0;
    font-size:9px;
    letter-spacing:.7px;
    white-space:nowrap;
  }
  body.service-page .service-hero{
    padding:44px 20px 38px;
  }
  body.service-page .service-hero .eyebrow{
    margin-bottom:16px;
    font-size:8px;
    letter-spacing:2.5px;
  }
  body.service-page .service-hero h1{
    max-width:100%;
    font-size:clamp(32px,10vw,44px);
    line-height:.98;
    letter-spacing:-1.5px;
    overflow-wrap:anywhere;
  }
  body.service-page .service-hero .lead{
    max-width:100%;
    margin-top:22px;
    font-size:16px;
    line-height:1.5;
  }
  body.service-page .service-content{
    padding-left:20px;
    padding-right:20px;
  }
  body.service-page .service-box,
  body.service-page .service-box:not(:nth-child(3n+1)){
    padding:22px 0;
    min-height:0;
    border-left:0;
  }
  body.service-page .glass-service-list .service-box,
  body.service-page .glass-service-list .service-box:first-child{
    padding:22px 0;
    border-left:0;
  }
}

@media (max-width: 380px){
  body.service-page .service-nav{padding:0 16px}
  body.service-page .service-nav .brand strong{font-size:16px}
  body.service-page .service-nav .brand span{font-size:5.5px;letter-spacing:2.2px}
  body.service-page .service-nav .back{font-size:8px;letter-spacing:.4px}
  body.service-page .service-hero{padding-left:16px;padding-right:16px}
  body.service-page .service-content{padding-left:16px;padding-right:16px}
  body.service-page .service-hero h1{font-size:clamp(29px,9.5vw,38px)}
}

/* ===== V7.14 – hosszú szolgáltatáscímek mobil törése ===== */
@media (max-width: 800px){
  body.service-page .service-hero h1{
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
  }
  body.gyartas-page .service-hero h1,
  body.femmegmunkalas-page .service-hero h1{
    font-size:clamp(30px,8.7vw,39px);
    letter-spacing:-1.2px;
  }
}
@media (max-width: 380px){
  body.gyartas-page .service-hero h1,
  body.femmegmunkalas-page .service-hero h1{
    font-size:clamp(28px,8.5vw,34px);
  }
}

/* ===== V7.15 – egységes mobil H1 méret mind a 4 szolgáltatásoldalon ===== */
@media (max-width: 800px){
  body.service-page .service-hero h1{
    font-size:clamp(30px,8.7vw,39px);
    letter-spacing:-1.2px;
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
  }
}
@media (max-width: 380px){
  body.service-page .service-hero h1{
    font-size:clamp(28px,8.5vw,34px);
  }
}

/* ===== V7.19 – KAPUKERET KALKULÁTOR ===== */
.gate-calculator{padding:105px 5vw;background:#0d1215;color:var(--white)}
.gate-calc-head{display:grid;grid-template-columns:2fr 1fr;gap:50px;align-items:end;margin-bottom:55px}
.gate-calc-head h2{margin:0;font-size:clamp(34px,3.6vw,56px);line-height:.95;letter-spacing:-3px}
.gate-calc-head>p{margin:0 0 5px;color:#9da8af;line-height:1.65;max-width:460px}
.gate-calc-grid{display:grid;grid-template-columns:1.05fr .95fr;border-top:1px solid #394147;border-bottom:1px solid #394147}
.gate-calc-form{padding:42px 55px 42px 0;border-right:1px solid #394147}
.gate-calc-form label{display:block;font-size:9px;letter-spacing:2.2px;color:#9da8af;text-transform:uppercase}
.gate-calc-form select{width:100%;margin-top:10px;padding:16px 14px;border:1px solid #3b454b;background:#151c20;color:#f5f6f7;font:600 15px Arial,Helvetica,sans-serif;border-radius:0;outline:none}
.gate-calc-form select:focus{border-color:#aab5bd}
.gate-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}
.gate-calc-note{margin:24px 0 0;color:#89969e;font-size:12px;line-height:1.6}
.gate-result{padding:42px 0 42px 55px}
.gate-result>span{font-size:9px;letter-spacing:2.5px;color:#89969e}
.gate-result>strong{display:block;margin-top:12px;font-size:clamp(38px,4vw,62px);letter-spacing:-2.5px;line-height:1;color:#f5f6f7}
.gate-result>p{margin:12px 0 30px;color:#aab5bd;font-size:13px}
.gate-result-lines{border-top:1px solid #30383e}
.gate-result-lines div{display:flex;justify-content:space-between;gap:25px;padding:13px 0;border-bottom:1px solid #252d32;font-size:12px}
.gate-result-lines span{color:#7f8b92}.gate-result-lines b{text-align:right;font-weight:600;color:#dfe4e7}
.gate-disclaimer{margin:22px 0 0;max-width:950px;color:#7f8b92;font-size:11px;line-height:1.65}.gate-disclaimer b{color:#aab5bd}
@media(max-width:800px){
  .gate-calculator{padding:72px 20px}
  .gate-calc-head{display:block;margin-bottom:38px}.gate-calc-head h2{font-size:clamp(30px,8vw,40px);letter-spacing:-2px}.gate-calc-head>p{margin-top:20px}
  .gate-calc-grid{display:block}.gate-calc-form{padding:28px 0;border-right:0;border-bottom:1px solid #394147}.gate-result{padding:30px 0}
  .gate-fields{grid-template-columns:1fr;gap:20px}.gate-calc-form select{min-height:50px;font-size:16px}
  .gate-result>strong{font-size:clamp(38px,12vw,52px)}
}

/* V7.22 */
.gate-surface-label{margin-top:24px}

/* V7.25 – egyedi méret CTA */
.gate-custom-quote{margin-top:24px;padding:22px 24px;border:1px solid #2b353a;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#0d1316}
.gate-custom-quote div{display:flex;flex-direction:column;gap:7px}
.gate-custom-quote strong{font-size:16px;line-height:1.4}
.gate-custom-quote span{color:#8fa3ae;font-size:14px;line-height:1.5}
.gate-custom-quote .btn{white-space:nowrap}
.gate-calc-note:empty{display:none}
@media(max-width:760px){.gate-custom-quote{align-items:stretch;flex-direction:column}.gate-custom-quote .btn{text-align:center}}

/* V7.26 – felugró egyedi ajánlatkérés */
.gate-quote-open{border:0;cursor:pointer;font:700 12px Arial,Helvetica,sans-serif}
.gate-quote-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px}
.gate-quote-modal.open{display:flex}
.gate-quote-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(5px)}
.gate-quote-dialog{position:relative;z-index:1;width:min(680px,100%);max-height:90vh;overflow:auto;background:#0d1316;border:1px solid #364047;padding:36px;color:#f5f6f7;box-shadow:0 25px 80px rgba(0,0,0,.45)}
.gate-quote-dialog h3{margin:10px 45px 12px 0;font-size:clamp(27px,3vw,42px);line-height:1;letter-spacing:-1.8px}
.gate-quote-intro{margin:0 0 26px;color:#91a0a8;line-height:1.6;font-size:14px}
.gate-quote-close{position:absolute;right:18px;top:14px;border:0;background:transparent;color:#f5f6f7;font-size:34px;line-height:1;cursor:pointer}
.gate-quote-form label{display:block;margin-top:16px;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:#9da8af}
.gate-quote-form input,.gate-quote-form textarea{box-sizing:border-box;width:100%;margin-top:9px;padding:14px;border:1px solid #3b454b;background:#151c20;color:#f5f6f7;font:500 15px Arial,Helvetica,sans-serif;border-radius:0;outline:none;resize:vertical}
.gate-quote-form input:focus,.gate-quote-form textarea:focus{border-color:#aab5bd}
.gate-quote-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.gate-quote-form .btn{margin-top:22px;border:0;cursor:pointer}
.gate-quote-form small{display:block;margin-top:12px;color:#73828a;font-size:10px;line-height:1.5;text-transform:none;letter-spacing:0}
body.quote-modal-open{overflow:hidden}
@media(max-width:600px){.gate-quote-modal{padding:12px}.gate-quote-dialog{padding:28px 20px}.gate-quote-fields{grid-template-columns:1fr}.gate-quote-dialog h3{font-size:29px}}

/* V7.27 – kompakt ajánlatkérő szövegbuborék */
.gate-quote-modal{align-items:center;padding:18px}
.gate-quote-dialog{width:min(620px,100%);max-height:calc(100vh - 36px);padding:26px 30px;overflow:auto;border-radius:2px}
.gate-quote-dialog .eyebrow{margin:0 0 6px}
.gate-quote-dialog h3{margin:4px 42px 7px 0;font-size:clamp(25px,2.4vw,34px);line-height:1.02;letter-spacing:-1.2px}
.gate-quote-intro{margin:0 0 12px;font-size:13px;line-height:1.4}
.gate-quote-form label{margin-top:9px}
.gate-quote-form input,.gate-quote-form textarea{margin-top:6px;padding:10px 12px;font-size:14px}
.gate-quote-form textarea{min-height:138px;max-height:190px;resize:vertical}
.gate-quote-fields{gap:12px}
.gate-quote-form .btn{margin-top:14px;padding:14px 18px}
.gate-quote-form small{margin-top:8px}
.gate-quote-close{right:14px;top:10px}
@media(max-width:600px){.gate-quote-modal{padding:8px;align-items:flex-start}.gate-quote-dialog{margin-top:8px;max-height:calc(100vh - 16px);padding:20px 16px}.gate-quote-fields{grid-template-columns:1fr}.gate-quote-dialog h3{font-size:25px}.gate-quote-form textarea{min-height:125px}}

/* V7.27 – kompakt ajánlatkérő szövegbuborék */
.gate-quote-modal{align-items:center;padding:18px}
.gate-quote-dialog{width:min(620px,100%);max-height:calc(100vh - 36px);padding:26px 30px;overflow:auto;border-radius:2px}
.gate-quote-dialog .eyebrow{margin:0 0 6px}
.gate-quote-dialog h3{margin:4px 42px 7px 0;font-size:clamp(25px,2.4vw,34px);line-height:1.02;letter-spacing:-1.2px}
.gate-quote-intro{margin:0 0 12px;font-size:13px;line-height:1.4}
.gate-quote-form label{margin-top:9px}
.gate-quote-form input,.gate-quote-form textarea{margin-top:6px;padding:10px 12px;font-size:14px}
.gate-quote-form textarea{min-height:138px;max-height:190px;resize:vertical}
.gate-quote-fields{gap:12px}
.gate-quote-form .btn{margin-top:14px;padding:14px 18px}
.gate-quote-form small{margin-top:8px}
.gate-quote-close{right:14px;top:10px}
@media(max-width:600px){.gate-quote-modal{padding:8px;align-items:flex-start}.gate-quote-dialog{margin-top:8px;max-height:calc(100vh - 16px);padding:20px 16px}.gate-quote-fields{grid-template-columns:1fr}.gate-quote-dialog h3{font-size:25px}.gate-quote-form textarea{min-height:125px}}

/* BIR2410 — subtle memorial easter egg in the header brand */
.brand strong{display:flex;align-items:baseline;white-space:nowrap}
.brand .memorial-mark{font-style:normal;font-size:10px;font-weight:500;letter-spacing:1.2px;margin-left:8px;color:#aeb8bf;opacity:.16;transition:opacity .25s ease}
.brand:hover .memorial-mark{opacity:.24}
@media(max-width:760px){.brand .memorial-mark{font-size:8px;letter-spacing:.9px;margin-left:6px;opacity:.13}}

/* V7.29 – közvetlen ajánlatkérés */
.quote-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.gate-quote-status{min-height:20px;margin:10px 0 0;font-size:13px;line-height:1.45;color:#8fa4af}
.gate-quote-status.success{color:#dce7e1;font-weight:700}
.gate-quote-status.error{color:#f0b8b8;font-weight:700}
#quote-submit:disabled{opacity:.7;cursor:default}