:root{
  --graphite:#545454;
  --ink:#17191b;
  --dark:#171a1d;
  --paper:#f7f5f1;
  --paper-2:#ece9e3;
  --white:#fff;
  --line:rgba(23,25,27,.13);
  --max:1280px;
  --pad:clamp(22px,4vw,64px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:Manrope,Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased
}
img{display:block;max-width:100%;width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
.wrap{width:min(var(--max),calc(100% - 2*var(--pad)));margin-inline:auto}
.eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:rgba(23,25,27,.52);margin:0 0 16px}
.eyebrow.light{color:rgba(255,255,255,.62)}
h1,h2,h3{margin:0;line-height:1.05;letter-spacing:-.035em}
h1{font-size:clamp(42px,4.6vw,70px);font-weight:520}
h2{font-size:clamp(34px,3.35vw,52px);font-weight:520}
h3{font-size:20px;font-weight:650}
p{margin:0 0 16px}
.muted{color:rgba(23,25,27,.65);font-size:15px;line-height:1.8}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;
  padding:0 22px;border:1px solid transparent;font-size:13px;font-weight:760;
  transition:.2s ease
}
.btn-dark{background:var(--ink);color:#fff}
.btn-light{background:#fff;color:var(--ink)}
.btn-outline-light{border-color:rgba(255,255,255,.5);color:#fff}
.btn:hover{transform:translateY(-1px)}
.text-link{display:inline-block;font-size:12px;font-weight:760;border-bottom:1px solid rgba(23,25,27,.3);padding-bottom:3px}

/* header */
.site-header{
  height:80px;background:rgba(248,246,242,.97);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:50;backdrop-filter:blur(10px)
}
.nav{height:100%;display:flex;align-items:center;gap:22px}
.brand{width:126px;flex:0 0 auto}
.brand img{height:auto}
.menu{margin-left:auto;display:flex;align-items:center;gap:19px;font-size:11px;font-weight:720;white-space:nowrap}
.menu a[aria-current="page"]{border-bottom:1px solid currentColor;padding-bottom:4px}
.header-cta{background:var(--ink);color:#fff;padding:13px 17px;font-size:11px;font-weight:800}
.menu-toggle{display:none;border:0;background:transparent;margin-left:auto;width:42px;height:42px;padding:9px}
.menu-toggle span{display:block;height:1px;background:#111;margin:7px 0}
.mobile-panel{display:none}

/* home */
.hero{
  display:grid;grid-template-columns:48% 52%;min-height:720px;height:calc(100svh - 80px);max-height:900px;
  background:var(--dark);color:#fff
}
.hero-copy{display:flex;align-items:center}
.hero-copy>div{padding:70px 6.5vw 70px max(4.6vw,46px)}
.hero .lead{font-size:15px;line-height:1.8;color:rgba(255,255,255,.76);margin:27px 0 30px;max-width:620px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-photo{overflow:hidden}
.hero-photo img{height:100%;object-fit:cover;object-position:center 47%}
.section{padding:104px 0}
.section-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:end}
.offer{background:#faf8f4}
.offer-grid,.why-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:52px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.offer-grid article,.why-grid article{min-height:250px;padding:34px 27px 35px;border-right:1px solid var(--line);display:flex;flex-direction:column}
.offer-grid article:last-child,.why-grid article:last-child{border-right:0}
.offer-grid .num{font-size:10px;letter-spacing:.15em;color:rgba(23,25,27,.4)}
.offer-grid h3,.why-grid h3{margin:25px 0 12px}
.offer-grid p,.why-grid p{font-size:13px;color:rgba(23,25,27,.63)}
.offer-grid a{margin-top:auto;font-size:12px;font-weight:760}
.craft{display:grid;grid-template-columns:54% 46%;min-height:610px;background:#fff}
.craft-photo{overflow:hidden}
.craft-photo img{height:100%;object-fit:cover}
.craft-copy{padding:90px clamp(44px,7vw,115px);display:flex;flex-direction:column;justify-content:center}
.craft-copy p:not(.eyebrow){font-size:15px;line-height:1.82;color:rgba(23,25,27,.67);max-width:620px}
.why{background:var(--paper-2)}
.why-grid b{display:inline-grid;place-items:center;min-width:52px;height:50px;padding:0 8px;border:1px solid var(--ink);font-size:12px;letter-spacing:.08em}
.projects{background:#faf8f4}
.projects-head{display:flex;align-items:end;justify-content:space-between;gap:40px}
.projects-note{font-size:11px;color:rgba(23,25,27,.5);margin:18px 0 30px}
.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.project-card img{aspect-ratio:4/3;object-fit:cover}
.project-card small{display:block;margin-top:14px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(23,25,27,.48)}
.project-card h3{font-size:16px;line-height:1.35;margin:7px 0 0}
.b2b{background:#202326;color:#fff;padding:104px 0}
.b2b-grid{display:grid;grid-template-columns:46% 54%;gap:70px;align-items:stretch}
.b2b-copy{display:flex;flex-direction:column;justify-content:center}
.b2b-copy p:not(.eyebrow){font-size:14px;line-height:1.84;color:rgba(255,255,255,.72)}
.b2b-copy .btn{margin-top:15px;align-self:flex-start}
.b2b-photo{overflow:hidden;min-height:500px}
.b2b-photo img{height:100%;object-fit:cover}
.about{background:#f2efe9}
.about-grid{display:grid;grid-template-columns:45% 55%;gap:76px;align-items:center}
.about-photo{overflow:hidden;aspect-ratio:4/3}
.about-photo img{height:100%;object-fit:cover}
.closing{display:grid;grid-template-columns:56% 44%;min-height:520px;background:#15191d;color:#fff}
.closing-copy{display:flex;align-items:center;padding:80px max(5vw,48px)}
.closing-copy>div{max-width:650px}
.closing-copy p:not(.eyebrow){font-size:14px;line-height:1.82;color:rgba(255,255,255,.72)}
.closing-photo{overflow:hidden}
.closing-photo img{height:100%;object-fit:cover}

/* shell pages */
.page-hero{background:var(--dark);color:#fff;padding:100px 0 92px}
.page-hero .wrap{max-width:1050px}
.page-hero p:not(.eyebrow){max-width:760px;color:rgba(255,255,255,.72);font-size:16px;line-height:1.8;margin-top:24px}
.page-shell{padding:86px 0 110px}
.shell-card{
  background:#fff;border:1px solid var(--line);padding:42px;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start
}
.shell-card h2{font-size:clamp(30px,3vw,44px)}
.shell-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.shell-list li{padding:16px 0;border-bottom:1px solid var(--line);font-size:13px}
.note{font-size:12px;color:rgba(23,25,27,.55);margin-top:16px}

/* footer */
.site-footer{background:var(--graphite);color:#fff;padding:66px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:70px}
.footer-brand img{display:block;width:150px;margin:0 auto;filter:brightness(0) invert(1)}
.footer-brand p{font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-top:16px}
.site-footer h3{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.6);margin:0 0 15px}
.site-footer p,.site-footer a{display:block;font-size:12px;color:rgba(255,255,255,.82);margin:0 0 7px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:22px;border-top:1px solid rgba(255,255,255,.18);font-size:9px;color:rgba(255,255,255,.57)}
.footer-bottom a{font-size:9px}

@media(max-width:1080px){
  .menu,.header-cta{display:none}.menu-toggle{display:block}
  .mobile-panel.open{display:block;position:absolute;top:80px;left:0;right:0;background:#f8f6f2;border-bottom:1px solid var(--line);padding:20px var(--pad)}
  .mobile-panel a{display:block;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px;font-weight:700}
  .hero{grid-template-columns:1fr 1fr}.hero-copy>div{padding:54px 38px}.hero h1{font-size:48px}
  .offer-grid,.why-grid,.project-grid{grid-template-columns:repeat(2,1fr)}
  .offer-grid article:nth-child(2),.why-grid article:nth-child(2){border-right:0}
  .section-intro{grid-template-columns:1fr;gap:20px}
  .b2b-grid,.about-grid{gap:42px}
  .shell-card{grid-template-columns:1fr;gap:28px}
}
@media(max-width:720px){
  .site-header{height:68px}.mobile-panel.open{top:68px}
  .hero{grid-template-columns:1fr;height:auto;min-height:0}
  .hero-photo{order:-1;height:46vh;min-height:340px}
  .hero-copy>div{padding:50px 22px 58px}
  .hero h1{font-size:39px}.hero .lead{font-size:14px}
  .hero-actions .btn{flex:1}
  .section{padding:72px 0}
  .offer-grid,.why-grid,.project-grid{grid-template-columns:1fr}
  .offer-grid article,.why-grid article{border-right:0;border-bottom:1px solid var(--line)}
  .craft{grid-template-columns:1fr}.craft-photo{height:330px}.craft-copy{padding:58px 22px 66px}
  .projects-head{display:block}.projects-head .text-link{margin-top:16px}
  .b2b{padding:72px 0}.b2b-grid,.about-grid{grid-template-columns:1fr}
  .b2b-photo{order:-1;min-height:0;aspect-ratio:4/3}
  .closing{grid-template-columns:1fr}.closing-photo{height:320px;order:-1}.closing-copy{padding:58px 22px 66px}
  .page-hero{padding:68px 0 62px}.page-hero h1{font-size:40px}
  .page-shell{padding:56px 0 80px}.shell-card{padding:28px}
  .footer-grid{grid-template-columns:1fr;gap:34px}.footer-bottom{flex-direction:column}
}


/* --- MEBLE page v0.8 --- */
.service-hero{
  display:grid;grid-template-columns:50% 50%;min-height:700px;background:#181b1e;color:#fff
}
.service-hero-copy{display:flex;align-items:center}
.service-hero-copy>div{padding:78px 6.2vw 76px max(4.6vw,46px)}
.service-hero-copy .lead{font-size:15px;line-height:1.82;color:rgba(255,255,255,.76);margin:26px 0 18px;max-width:660px}
.service-hero-copy .sublead{font-size:14px;line-height:1.8;color:rgba(255,255,255,.62);max-width:660px;margin-bottom:30px}
.service-hero-photo{overflow:hidden}
.service-hero-photo img{height:100%;object-fit:cover;object-position:center 58%}

.four-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:46px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.four-grid article{padding:32px 28px 34px;border-right:1px solid var(--line);min-height:240px}
.four-grid article:last-child{border-right:0}
.four-grid h3{margin:0 0 12px;font-size:18px}
.four-grid p{font-size:13px;line-height:1.72;color:rgba(23,25,27,.64)}

.split-section{display:grid;grid-template-columns:50% 50%;min-height:600px;background:#fff}
.split-section.reverse .split-media{order:2}
.split-section.reverse .split-copy{order:1}
.split-media{overflow:hidden}
.split-media img{height:100%;object-fit:cover}
.split-copy{padding:86px clamp(42px,6.5vw,106px);display:flex;flex-direction:column;justify-content:center}
.split-copy p:not(.eyebrow){font-size:15px;line-height:1.82;color:rgba(23,25,27,.67)}
.split-copy .text-link{align-self:flex-start;margin-top:10px}

.design-section{background:#eeebe5}
.design-section .split-media img{object-position:center 58%}

.gallery-section{background:#faf8f4}
.gallery-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
.gallery-head .muted{max-width:540px}
.editorial-gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.g-card{background:#fff}
.g-card img{width:100%;height:100%;object-fit:cover}
.g-card .g-img{overflow:hidden;background:#ddd}
.g-card .meta{padding:12px 2px 0}
.g-card small{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:rgba(23,25,27,.46)}
.g-card h3{font-size:15px;line-height:1.35;margin-top:5px}
.g1{grid-column:span 7}.g1 .g-img{aspect-ratio:1.45/1}
.g2{grid-column:span 5}.g2 .g-img{aspect-ratio:1/1.15}
.g3{grid-column:span 4}.g3 .g-img{aspect-ratio:1/1.15}
.g4{grid-column:span 4}.g4 .g-img{aspect-ratio:1/1.15}
.g5{grid-column:span 4}.g5 .g-img{aspect-ratio:1/1.15}
.g6{grid-column:span 8}.g6 .g-img{aspect-ratio:1.55/1}
.g7{grid-column:span 4}.g7 .g-img{aspect-ratio:1/1.2}
.g8{grid-column:span 12}.g8 .g-img{aspect-ratio:2.05/1}

.steps-section{background:#fff}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:44px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.step{padding:30px 26px 34px;border-right:1px solid var(--line)}
.step:last-child{border-right:0}
.step .num{font-size:10px;letter-spacing:.15em;color:rgba(23,25,27,.43)}
.step h3{font-size:18px;margin:22px 0 10px}
.step p{font-size:13px;line-height:1.72;color:rgba(23,25,27,.64)}

.logistics{background:#efebe5}
.logistics .narrow{max-width:840px}
.logistics p{font-size:15px;line-height:1.82;color:rgba(23,25,27,.68)}

.simple-cta{background:#171a1d;color:#fff;padding:96px 0}
.simple-cta .wrap{max-width:940px}
.simple-cta p:not(.eyebrow){font-size:15px;line-height:1.82;color:rgba(255,255,255,.7);max-width:700px;margin:24px 0 28px}
.simple-cta .hero-actions{margin-top:4px}

@media(max-width:1080px){
  .service-hero{grid-template-columns:1fr 1fr}
  .four-grid,.steps-grid{grid-template-columns:repeat(2,1fr)}
  .four-grid article:nth-child(2),.steps-grid .step:nth-child(2){border-right:0}
  .editorial-gallery{grid-template-columns:repeat(2,1fr)}
  .g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8{grid-column:span 1}
  .g-card .g-img{aspect-ratio:4/3}
}
@media(max-width:720px){
  .service-hero{grid-template-columns:1fr;min-height:0}
  .service-hero-photo{order:-1;height:48vh;min-height:360px}
  .service-hero-copy>div{padding:52px 22px 60px}
  .service-hero-copy h1{font-size:39px}
  .four-grid,.steps-grid{grid-template-columns:1fr}
  .four-grid article,.steps-grid .step{border-right:0;border-bottom:1px solid var(--line)}
  .split-section{grid-template-columns:1fr;min-height:0}
  .split-section.reverse .split-media,.split-section.reverse .split-copy{order:initial}
  .split-media{height:360px}
  .split-copy{padding:60px 22px 68px}
  .gallery-head{display:block}
  .gallery-head .muted{margin-top:16px}
  .editorial-gallery{grid-template-columns:1fr}
  .g-card .g-img{aspect-ratio:4/3}
  .simple-cta{padding:72px 0}
}


/* =============================
   v0.9 — refinement pass
   ============================= */

/* Header: clean wordmark without rectangular background */
.site-header .wrap{width:min(1380px,calc(100% - 36px))}
.brand-wordmark{
  width:122px;display:flex;flex-direction:column;align-items:flex-start;
  justify-content:center;line-height:1;color:#545454
}
.brand-wordmark .brand-main{
  font-family:Georgia,"Times New Roman",serif;
  font-size:27px;font-weight:400;letter-spacing:-.035em
}
.brand-wordmark .brand-sub{
  font-family:Georgia,"Times New Roman",serif;
  font-size:9px;letter-spacing:.26em;margin-top:5px;margin-left:2px
}

/* Header spacing — CTA must not collide with navigation */
.nav{gap:16px}
.menu{
  gap:15px;font-size:10px;flex:1 1 auto;justify-content:flex-end;min-width:0
}
.header-cta{
  flex:0 0 auto;margin-left:8px;padding:12px 15px;
  font-size:10px;white-space:nowrap
}

/* Softer transition from hero copy into the photograph */
.service-hero{grid-template-columns:52% 48%}
.service-hero-photo{position:relative}
.service-hero-photo::before{
  content:"";position:absolute;z-index:2;inset:0 auto 0 0;width:155px;pointer-events:none;
  background:linear-gradient(90deg,
    #181b1e 0%,
    rgba(24,27,30,.94) 14%,
    rgba(24,27,30,.68) 40%,
    rgba(24,27,30,.28) 70%,
    rgba(24,27,30,0) 100%)
}
.service-hero-photo img{position:relative;z-index:1}

/* Justified body copy across content sections */
p:not(.eyebrow):not(.projects-note),
.offer-grid p,.why-grid p,.four-grid p,.step p,.shell-list li{
  text-align:justify;text-justify:inter-word;hyphens:auto
}
.eyebrow,.projects-note,.site-footer p,.footer-brand p{
  text-align:left;hyphens:none
}

/* Realizations — clean, coherent gallery instead of irregular masonry */
.editorial-gallery{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 18px
}
.g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8{grid-column:auto}
.g-card{background:transparent;display:block}
.g-card .g-img,
.g1 .g-img,.g2 .g-img,.g3 .g-img,.g4 .g-img,
.g5 .g-img,.g6 .g-img,.g7 .g-img,.g8 .g-img{
  aspect-ratio:4/5;overflow:hidden;background:#e6e2dc
}
.g-card img{
  width:100%;height:100%;object-fit:cover;transition:transform .35s ease
}
.g-card:hover img{transform:scale(1.018)}
.g-card .meta{padding:12px 0 0}
.g-card small{
  display:block;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(23,25,27,.46)
}
.g-card h3{
  margin-top:5px;font-size:14px;font-weight:650;line-height:1.35;
  letter-spacing:-.015em
}
.gallery-head{margin-bottom:38px}
.gallery-section{padding-top:96px;padding-bottom:104px}

/* Individual crop tuning */
.g1 img{object-position:center 50%}
.g2 img{object-position:center 52%}
.g3 img{object-position:center 55%}
.g4 img{object-position:center 48%}
.g5 img{object-position:center 55%}
.g6 img{object-position:center 57%}
.g7 img{object-position:center 52%}
.g8 img{object-position:center 54%}

/* Switch to mobile navigation before desktop items can collide */
@media(max-width:1240px){
  .menu,.header-cta{display:none}
  .menu-toggle{display:block}
}
@media(max-width:1080px){
  .editorial-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  .site-header .wrap{width:calc(100% - 36px)}
  .service-hero{grid-template-columns:1fr}
  .service-hero-photo::before{display:none}
  .editorial-gallery{grid-template-columns:1fr 1fr;gap:24px 12px}
  .g-card .g-img{aspect-ratio:4/5}
}
@media(max-width:480px){
  .editorial-gallery{grid-template-columns:1fr}
}


/* =============================
   v0.10 — user review corrections
   ============================= */

/* Use the supplied transparent HO-MA DESIGN logo in the header */
.brand-image{
  width:112px;
  flex:0 0 112px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.brand-image img{
  width:100%;
  height:auto;
  max-height:49px;
  object-fit:contain;
  object-position:left center;
}
.brand-wordmark{display:none!important}

/* More natural, genuinely blended transition from copy to photo */
.service-hero{
  position:relative;
  overflow:hidden;
  grid-template-columns:55% 45%;
  background:#181b1e;
}
.service-hero-copy{
  position:relative;
  z-index:3;
}
.service-hero-copy>div{
  position:relative;
  z-index:4;
  padding-right:9vw;
}
.service-hero-photo{
  position:relative;
  z-index:1;
  margin-left:-210px;
  width:calc(100% + 210px);
  overflow:hidden;
  -webkit-mask-image:linear-gradient(
    90deg,
    transparent 0%,
    rgba(0,0,0,.10) 8%,
    rgba(0,0,0,.34) 20%,
    rgba(0,0,0,.68) 38%,
    #000 58%,
    #000 100%
  );
  mask-image:linear-gradient(
    90deg,
    transparent 0%,
    rgba(0,0,0,.10) 8%,
    rgba(0,0,0,.34) 20%,
    rgba(0,0,0,.68) 38%,
    #000 58%,
    #000 100%
  );
}
.service-hero-photo::before{
  display:none!important;
}
.service-hero-photo img{
  height:100%;
  object-fit:cover;
  object-position:center 58%;
}

/* Gallery: all cards follow exactly the same visual grid */
.editorial-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:34px 22px;
}
.g-card .g-img,
.g1 .g-img,.g2 .g-img,.g3 .g-img,.g4 .g-img,
.g5 .g-img,.g6 .g-img,.g7 .g-img,.g8 .g-img{
  aspect-ratio:4/5;
}
.g-card img{
  object-fit:cover;
}
.g6 img{
  object-position:center 50%;
}

@media(max-width:1240px){
  .brand-image{width:106px;flex-basis:106px}
}
@media(max-width:720px){
  .brand-image{width:100px;flex-basis:100px;height:48px}
  .service-hero{grid-template-columns:1fr}
  .service-hero-photo{
    margin-left:0;
    width:100%;
    -webkit-mask-image:none;
    mask-image:none;
  }
  .service-hero-copy>div{padding-right:22px}
}


/* v0.10b — browser/PDF-safe hero blending fallback */
.brand-image{
  width:126px;
  flex-basis:126px;
}
.service-hero-photo{
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
.service-hero-photo::before{
  display:block!important;
  content:"";
  position:absolute;
  z-index:3;
  left:0;
  top:0;
  bottom:0;
  width:330px;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    #181b1e 0%,
    rgba(24,27,30,.98) 12%,
    rgba(24,27,30,.88) 28%,
    rgba(24,27,30,.64) 48%,
    rgba(24,27,30,.32) 70%,
    rgba(24,27,30,0) 100%
  );
}
@media(max-width:1240px){
  .brand-image{width:116px;flex-basis:116px}
}
@media(max-width:720px){
  .brand-image{width:106px;flex-basis:106px}
  .service-hero-photo::before{display:none!important}
}


/* =============================
   v0.11 — HERO transition correction
   ============================= */

/* Revert the photo-overlap experiment from v0.10 */
.service-hero{
  grid-template-columns:52% 48% !important;
  position:relative;
  overflow:hidden;
  background:#181b1e;
}
.service-hero-copy{
  position:relative;
  z-index:2;
}
.service-hero-copy>div{
  padding-right:6.5vw !important;
}
.service-hero-photo{
  position:relative;
  z-index:1;
  margin-left:0 !important;
  width:100% !important;
  overflow:hidden;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

/* Gradient is applied ON TOP OF THE LEFT EDGE OF THE PHOTO.
   The image itself keeps its normal rectangular position. */
.service-hero-photo::before{
  content:"" !important;
  display:block !important;
  position:absolute;
  z-index:3;
  top:0;
  bottom:0;
  left:0;
  width:220px;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    #181b1e 0%,
    rgba(24,27,30,.96) 12%,
    rgba(24,27,30,.80) 30%,
    rgba(24,27,30,.50) 52%,
    rgba(24,27,30,.22) 74%,
    rgba(24,27,30,0) 100%
  ) !important;
}
.service-hero-photo img{
  position:relative;
  z-index:1;
  height:100%;
  width:100%;
  object-fit:cover;
  object-position:center 58%;
}

@media(max-width:720px){
  .service-hero{grid-template-columns:1fr !important}
  .service-hero-photo::before{display:none !important}
  .service-hero-copy>div{padding-right:22px !important}
}


/* =============================
   v0.12 — global photo blending rule
   ============================= */

/*
  Global rule: every photographic image inside <main> softly fades
  into the surrounding section. Header/footer logos are intentionally excluded.
*/
main img{
  --fade-x: 3.2%;
  --fade-y: 3.2%;
  -webkit-mask-image:
    linear-gradient(to right,
      transparent 0%,
      #000 var(--fade-x),
      #000 calc(100% - var(--fade-x)),
      transparent 100%),
    linear-gradient(to bottom,
      transparent 0%,
      #000 var(--fade-y),
      #000 calc(100% - var(--fade-y)),
      transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right,
      transparent 0%,
      #000 var(--fade-x),
      #000 calc(100% - var(--fade-x)),
      transparent 100%),
    linear-gradient(to bottom,
      transparent 0%,
      #000 var(--fade-y),
      #000 calc(100% - var(--fade-y)),
      transparent 100%);
  mask-composite: intersect;
}

/* HERO gets a broader fade, especially from the text side */
.service-hero-photo img,
.hero-photo img{
  --fade-x: 6.5%;
  --fade-y: 2.5%;
}

/* Gallery / selected realizations: consistent soft edge around every image */
.g-card img,
.project-card img{
  --fade-x: 4.5%;
  --fade-y: 4.5%;
}

/* Large editorial / process imagery: slightly more restrained than gallery */
.split-media img,
.craft-photo img,
.b2b-photo img,
.about-photo img,
.closing-photo img{
  --fade-x: 3.5%;
  --fade-y: 3.5%;
}

/* Keep the dedicated HERO left-edge gradient as an additional transition */
.service-hero-photo::before{
  width:260px !important;
  background:linear-gradient(
    90deg,
    #181b1e 0%,
    rgba(24,27,30,.98) 10%,
    rgba(24,27,30,.86) 28%,
    rgba(24,27,30,.58) 52%,
    rgba(24,27,30,.28) 73%,
    rgba(24,27,30,0) 100%
  ) !important;
}

/* The gallery no longer reads as hard-edged cards */
.g-card .g-img{
  background:transparent !important;
}
.project-card{
  background:transparent;
}

/* Mobile: keep transitions subtle so images do not feel washed out */
@media(max-width:720px){
  main img{
    --fade-x: 2.8%;
    --fade-y: 2.8%;
  }
  .service-hero-photo img,
  .hero-photo img{
    --fade-x: 3.5%;
    --fade-y: 3%;
  }
  .service-hero-photo::before{
    display:none !important;
  }
}


/* =============================
   v0.13 — Dla firm i projektantów
   ============================= */

.b2b-realizations{
  background:#f7f5f1;
}
.b2b-realizations-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
  margin-top:42px;
}
.b2b-case{
  display:block;
}
.b2b-case .photo{
  aspect-ratio:4/5;
  overflow:hidden;
  background:transparent;
}
.b2b-case img{
  width:100%;
  height:100%;
  object-fit:cover;
  --fade-x:4.5%;
  --fade-y:4.5%;
}
.b2b-case:nth-child(1) img{object-position:center 54%}
.b2b-case:nth-child(2) img{object-position:center 56%}
.b2b-case .meta{
  padding-top:14px;
}
.b2b-case small{
  display:block;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(23,25,27,.48);
}
.b2b-case h3{
  margin-top:6px;
  font-size:17px;
  font-weight:650;
  letter-spacing:-.015em;
}

.audience-section{
  background:#eeebe5;
}
.logistics-b2b{
  background:#fff;
}
.logistics-b2b .inner{
  max-width:900px;
}
.logistics-b2b p{
  font-size:15px;
  line-height:1.82;
  color:rgba(23,25,27,.68);
}

@media(max-width:720px){
  .b2b-realizations-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .b2b-case .photo{
    aspect-ratio:4/3;
  }
}


/* ==========================================================
   v0.15 — FINAL PHOTO EDGE SYSTEM
   Soft transitions are embedded directly in photo transparency.
   This guarantees the effect in browsers and generated previews.
   ========================================================== */
main img{
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
.photo-blend::after,
.service-hero-photo::before{
  display:none !important;
}
.g-card .g-img,
.b2b-case .photo,
.project-photo{
  background:transparent !important;
}


/* ==========================================================
   v0.16 — CLEAN PHOTO SYSTEM
   All gradient / feather / mask experiments are disabled.
   Photos use clean, unaltered edges. Visual softness is created
   through spacing, backgrounds, proportions and typography.
   ========================================================== */

main img{
  -webkit-mask-image:none !important;
  mask-image:none !important;
  opacity:1 !important;
}

.photo-blend::before,
.photo-blend::after,
.service-hero-photo::before,
.service-hero-photo::after,
.hero-photo::before,
.hero-photo::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

.service-hero-photo,
.hero-photo,
.craft-photo,
.b2b-photo,
.about-photo,
.closing-photo,
.split-media,
.g-card .g-img,
.b2b-case .photo,
.project-photo{
  -webkit-mask-image:none !important;
  mask-image:none !important;
  background:transparent !important;
}

/* Restore a clean split between text and image */
.service-hero{
  grid-template-columns:52% 48% !important;
}
.service-hero-photo{
  margin-left:0 !important;
  width:100% !important;
}

/* Keep gallery structure clean and consistent */
.editorial-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:34px 22px;
}
.g-card .g-img{
  aspect-ratio:4/5;
  overflow:hidden;
}
.g-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}


/* =============================
   v0.17 — Automotive
   ============================= */

.auto-process{
  background:#fff;
}
.auto-process .split-media img{
  object-position:center 52%;
}

.auto-gallery{
  background:#f7f5f1;
}
.auto-gallery-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:28px 20px;
  margin-top:42px;
}
.auto-card{
  display:block;
}
.auto-card .photo{
  aspect-ratio:4/5;
  overflow:hidden;
  background:#e7e3dd;
}
.auto-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.auto-card:nth-child(1) img{object-position:center 50%}
.auto-card:nth-child(2) img{object-position:center 52%}
.auto-card:nth-child(3) img{object-position:center 54%}
.auto-card:nth-child(4) img{object-position:center 48%}
.auto-card .meta{
  padding-top:12px;
}
.auto-card small{
  display:block;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(23,25,27,.48);
}
.auto-card h3{
  margin-top:5px;
  font-size:15px;
  line-height:1.35;
  font-weight:650;
  letter-spacing:-.015em;
}

.auto-logistics{
  background:#eeebe5;
}
.auto-logistics .inner{
  max-width:900px;
}
.auto-logistics p{
  font-size:15px;
  line-height:1.82;
  color:rgba(23,25,27,.68);
}

@media(max-width:1080px){
  .auto-gallery-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:720px){
  .auto-gallery-grid{
    grid-template-columns:1fr;
    gap:32px;
  }
  .auto-card .photo{
    aspect-ratio:4/3;
  }
}


/* =============================
   v0.20 — Camper / Caravaning
   ============================= */

.camper-materials{
  background:#eeebe5;
}
.camper-materials .inner{
  max-width:940px;
}
.camper-materials p{
  font-size:15px;
  line-height:1.82;
  color:rgba(23,25,27,.68);
}

.camper-gallery{
  background:#f7f5f1;
}
.camper-gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  margin-top:40px;
}
.camper-card{
  display:block;
}
.camper-card .photo{
  aspect-ratio:4/5;
  overflow:hidden;
  background:#e7e3dd;
}
.camper-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.camper-card:nth-child(1) img{object-position:center 48%}
.camper-card:nth-child(2) img{object-position:center 52%}
.camper-card:nth-child(3) img{object-position:center 50%}
.camper-card .meta{
  padding-top:12px;
}
.camper-card small{
  display:block;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(23,25,27,.48);
}
.camper-card h3{
  margin-top:5px;
  font-size:15px;
  line-height:1.35;
  font-weight:650;
  letter-spacing:-.015em;
}

.camper-logistics{
  background:#fff;
}
.camper-logistics .inner{
  max-width:900px;
}
.camper-logistics p{
  font-size:15px;
  line-height:1.82;
  color:rgba(23,25,27,.68);
}

@media(max-width:900px){
  .camper-gallery-grid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:720px){
  .camper-gallery-grid{
    grid-template-columns:1fr;
    gap:30px;
  }
  .camper-card .photo{
    aspect-ratio:4/3;
  }
}


/* =============================
   v0.21 — Camper selected realization: 2-photo layout
   ============================= */

.camper-gallery-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:32px !important;
  max-width:980px;
  margin:44px auto 0 !important;
}

.camper-card .photo{
  aspect-ratio:4/5 !important;
  background:#e7e3dd;
}

.camper-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.camper-card:nth-child(1) img{
  object-position:center 50%;
}

.camper-card:nth-child(2) img{
  object-position:center 52%;
}

.camper-card .meta{
  padding-top:14px;
}

.camper-card h3{
  font-size:16px;
}

@media(max-width:720px){
  .camper-gallery-grid{
    grid-template-columns:1fr !important;
    max-width:560px;
    gap:30px !important;
  }

  .camper-card .photo{
    aspect-ratio:4/5 !important;
  }
}


/* =============================
   v0.22 — Realizacje
   ============================= */

.portfolio-intro{
  background:#f7f5f1;
  padding:86px 0 34px;
}
.portfolio-intro .inner{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:70px;
  align-items:end;
}
.portfolio-intro .muted{
  max-width:640px;
}

.portfolio-filter-wrap{
  background:#f7f5f1;
  padding:20px 0 42px;
}
.portfolio-filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  border-top:1px solid var(--line);
  padding-top:24px;
}
.portfolio-filter{
  border:1px solid rgba(23,25,27,.18);
  background:transparent;
  color:var(--ink);
  min-height:42px;
  padding:0 16px;
  font-size:11px;
  font-weight:760;
  cursor:pointer;
  transition:.2s ease;
}
.portfolio-filter:hover,
.portfolio-filter.is-active{
  background:var(--ink);
  color:#fff;
  border-color:var(--ink);
}

.portfolio-section{
  background:#faf8f4;
  padding:48px 0 108px;
}
.portfolio-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:34px 20px;
}
.portfolio-item{
  display:block;
}
.portfolio-item.is-hidden{
  display:none;
}
.portfolio-photo{
  aspect-ratio:4/5;
  overflow:hidden;
  background:#e8e4de;
}
.portfolio-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.portfolio-item .meta{
  padding-top:12px;
}
.portfolio-item small{
  display:block;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(23,25,27,.48);
}
.portfolio-item h3{
  margin-top:5px;
  font-size:14px;
  line-height:1.35;
  font-weight:650;
  letter-spacing:-.015em;
}

/* Crop tuning */
.portfolio-item[data-id="m1"] img{object-position:center 50%}
.portfolio-item[data-id="m2"] img{object-position:center 52%}
.portfolio-item[data-id="m3"] img{object-position:center 54%}
.portfolio-item[data-id="m4"] img{object-position:center 50%}
.portfolio-item[data-id="m5"] img{object-position:center 54%}
.portfolio-item[data-id="m6"] img{object-position:center 50%}
.portfolio-item[data-id="m7"] img{object-position:center 52%}
.portfolio-item[data-id="m8"] img{object-position:center 54%}

.portfolio-item[data-id="b1"] img{object-position:center 52%}
.portfolio-item[data-id="b2"] img{object-position:center 54%}

.portfolio-item[data-id="a1"] img{object-position:center 50%}
.portfolio-item[data-id="a2"] img{object-position:center 52%}
.portfolio-item[data-id="a3"] img{object-position:center 50%}
.portfolio-item[data-id="a4"] img{object-position:center 48%}

.portfolio-item[data-id="c1"] img{object-position:center 50%}
.portfolio-item[data-id="c2"] img{object-position:center 52%}

.portfolio-cta{
  background:#171a1d;
  color:#fff;
  padding:92px 0;
}
.portfolio-cta .wrap{
  max-width:950px;
}
.portfolio-cta p:not(.eyebrow){
  max-width:720px;
  color:rgba(255,255,255,.72);
  font-size:15px;
  line-height:1.82;
  margin:24px 0 28px;
}

@media(max-width:1080px){
  .portfolio-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .portfolio-intro .inner{
    grid-template-columns:1fr;
    gap:20px;
  }
}
@media(max-width:720px){
  .portfolio-intro{
    padding:62px 0 28px;
  }
  .portfolio-filter-wrap{
    padding-bottom:30px;
  }
  .portfolio-grid{
    grid-template-columns:1fr;
    gap:30px;
  }
  .portfolio-photo{
    aspect-ratio:4/3;
  }
  .portfolio-cta{
    padding:72px 0;
  }
}


/* =============================
   v0.23 — O HO-MA DESIGN
   ============================= */

.about-hero{
  display:grid;
  grid-template-columns:52% 48%;
  min-height:680px;
  background:#181b1e;
  color:#fff;
}
.about-hero-copy{
  display:flex;
  align-items:center;
}
.about-hero-copy>div{
  padding:80px 6.5vw 76px max(4.6vw,46px);
}
.about-hero .lead{
  max-width:680px;
  margin:26px 0 18px;
  color:rgba(255,255,255,.76);
  font-size:15px;
  line-height:1.82;
}
.about-hero .sublead{
  max-width:680px;
  color:rgba(255,255,255,.62);
  font-size:14px;
  line-height:1.8;
}
.about-hero-photo{
  overflow:hidden;
}
.about-hero-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 54%;
}

.about-story{
  background:#f7f5f1;
}
.about-story-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:start;
}
.about-story .big-copy{
  font-size:19px;
  line-height:1.7;
  letter-spacing:-.015em;
  max-width:620px;
}
.about-story .muted{
  font-size:15px;
  line-height:1.82;
}

.about-values{
  background:#eeebe5;
}
.about-values-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:44px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.about-values-grid article{
  padding:30px 26px 34px;
  border-right:1px solid var(--line);
  min-height:230px;
}
.about-values-grid article:last-child{
  border-right:0;
}
.about-values-grid .num{
  font-size:10px;
  letter-spacing:.15em;
  color:rgba(23,25,27,.43);
}
.about-values-grid h3{
  margin:22px 0 10px;
  font-size:18px;
}
.about-values-grid p{
  font-size:13px;
  line-height:1.72;
  color:rgba(23,25,27,.64);
}

.about-process{
  background:#fff;
}
.about-process .split-media img{
  object-position:center 50%;
}

.about-areas{
  background:#f7f5f1;
}
.about-areas-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:42px;
}
.about-area{
  border-top:1px solid var(--line);
  padding-top:20px;
}
.about-area small{
  display:block;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(23,25,27,.46);
}
.about-area h3{
  margin:8px 0 10px;
  font-size:18px;
}
.about-area p{
  font-size:13px;
  line-height:1.72;
  color:rgba(23,25,27,.64);
}

.about-location{
  background:#fff;
}
.about-location .inner{
  max-width:900px;
}
.about-location p{
  font-size:15px;
  line-height:1.82;
  color:rgba(23,25,27,.68);
}

@media(max-width:1080px){
  .about-values-grid,
  .about-areas-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .about-values-grid article:nth-child(2){
    border-right:0;
  }
}
@media(max-width:720px){
  .about-hero{
    grid-template-columns:1fr;
    min-height:0;
  }
  .about-hero-photo{
    order:-1;
    height:43vh;
    min-height:340px;
  }
  .about-hero-copy>div{
    padding:52px 22px 60px;
  }
  .about-story-grid{
    grid-template-columns:1fr;
    gap:28px;
  }
  .about-values-grid,
  .about-areas-grid{
    grid-template-columns:1fr;
  }
  .about-values-grid article{
    border-right:0;
    border-bottom:1px solid var(--line);
  }
}


/* =============================
   v0.24 — Kontakt
   ============================= */

.contact-hero{
  background:#181b1e;
  color:#fff;
  padding:94px 0 88px;
}
.contact-hero .wrap{
  max-width:1120px;
}
.contact-hero p:not(.eyebrow){
  max-width:760px;
  color:rgba(255,255,255,.72);
  font-size:16px;
  line-height:1.8;
  margin-top:24px;
}

.contact-main{
  background:#f7f5f1;
  padding:92px 0 104px;
}
.contact-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:70px;
  align-items:start;
}
.contact-data{
  position:sticky;
  top:110px;
}
.contact-data h2{
  font-size:clamp(34px,3vw,46px);
}
.contact-data-block{
  margin-top:34px;
  padding-top:28px;
  border-top:1px solid var(--line);
}
.contact-data-block p,
.contact-data-block a{
  font-size:14px;
  line-height:1.8;
}
.contact-data-block a{
  display:block;
  width:max-content;
  border-bottom:1px solid rgba(23,25,27,.2);
}
.contact-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:28px;
}

.contact-form{
  background:#fff;
  border:1px solid var(--line);
  padding:38px;
}
.contact-form h2{
  font-size:clamp(30px,2.6vw,42px);
  margin-bottom:10px;
}
.form-note{
  color:rgba(23,25,27,.58);
  font-size:13px;
  line-height:1.7;
  margin-bottom:28px;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.form-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.form-field.full{
  grid-column:1/-1;
}
.form-field label{
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:800;
}
.form-field input,
.form-field textarea{
  width:100%;
  border:1px solid rgba(23,25,27,.18);
  background:#faf9f6;
  min-height:48px;
  padding:12px 14px;
  font:inherit;
  color:var(--ink);
  outline:none;
}
.form-field textarea{
  min-height:150px;
  resize:vertical;
}
.form-field input:focus,
.form-field textarea:focus{
  border-color:rgba(23,25,27,.48);
}
.form-field input[type="file"]{
  padding:10px 12px;
  background:#f7f5f1;
}
.form-helper{
  font-size:11px;
  color:rgba(23,25,27,.52);
  line-height:1.55;
}
.contact-form .btn{
  margin-top:22px;
}
.contact-form .prototype-note{
  margin-top:14px;
  font-size:11px;
  color:rgba(23,25,27,.5);
}

.contact-tips{
  background:#eeebe5;
}
.contact-tips-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:44px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.contact-tip{
  padding:30px 24px 34px;
  border-right:1px solid var(--line);
}
.contact-tip:last-child{
  border-right:0;
}
.contact-tip .num{
  font-size:10px;
  letter-spacing:.15em;
  color:rgba(23,25,27,.43);
}
.contact-tip h3{
  margin:20px 0 8px;
  font-size:17px;
}
.contact-tip p{
  font-size:13px;
  line-height:1.72;
  color:rgba(23,25,27,.64);
}

.contact-map{
  background:#fff;
  padding:96px 0 104px;
}
.contact-map-grid{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:64px;
  align-items:stretch;
}
.contact-map-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.contact-map-copy p:not(.eyebrow){
  font-size:15px;
  line-height:1.82;
  color:rgba(23,25,27,.68);
}
.map-frame{
  min-height:430px;
  border:1px solid var(--line);
  overflow:hidden;
  background:#e9e6df;
}
.map-frame iframe{
  width:100%;
  height:100%;
  min-height:430px;
  border:0;
}

.contact-final{
  background:#171a1d;
  color:#fff;
  padding:92px 0;
}
.contact-final .wrap{
  max-width:930px;
}
.contact-final p:not(.eyebrow){
  max-width:700px;
  margin:24px 0 28px;
  color:rgba(255,255,255,.72);
  font-size:15px;
  line-height:1.82;
}

@media(max-width:980px){
  .contact-grid,
  .contact-map-grid{
    grid-template-columns:1fr;
  }
  .contact-data{
    position:static;
  }
  .contact-tips-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .contact-tip:nth-child(2){
    border-right:0;
  }
}
@media(max-width:720px){
  .contact-hero{
    padding:68px 0 62px;
  }
  .contact-main,
  .contact-map{
    padding:68px 0 76px;
  }
  .contact-grid{
    gap:42px;
  }
  .contact-form{
    padding:26px;
  }
  .form-grid{
    grid-template-columns:1fr;
  }
  .form-field.full{
    grid-column:auto;
  }
  .contact-tips-grid{
    grid-template-columns:1fr;
  }
  .contact-tip{
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .map-frame,
  .map-frame iframe{
    min-height:360px;
  }
  .contact-final{
    padding:72px 0;
  }
}


/* ==========================================================
   v0.26 — FINAL RESPONSIVE / MOBILE PASS
   ========================================================== */

/* Percentage tracks + gap caused horizontal overflow on tablet/desktop. */
.b2b-grid{
  grid-template-columns:minmax(0,46fr) minmax(0,54fr);
}
.about-grid{
  grid-template-columns:minmax(0,45fr) minmax(0,55fr);
}

/* Tablet gallery density. */
@media(max-width:1080px){
  .editorial-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Final mobile overrides must stay after the v0.16 desktop reset. */
@media(max-width:720px){
  .service-hero{
    grid-template-columns:1fr !important;
    min-height:0;
  }

  .service-hero-photo{
    order:-1;
    height:48vh;
    min-height:340px;
    margin-left:0 !important;
    width:100% !important;
  }

  .service-hero-copy>div{
    padding:48px 22px 58px !important;
  }

  .service-hero .hero-actions{
    flex-direction:column;
  }

  .service-hero .hero-actions .btn{
    width:100%;
    flex:none;
  }

  .b2b-grid,
  .about-grid{
    grid-template-columns:1fr;
  }

  /* On narrow screens justified copy creates large white gaps.
     Desktop remains justified; mobile is left-aligned for readability. */
  main p:not(.eyebrow),
  .offer-grid p,
  .why-grid p,
  .four-grid p,
  .step p,
  .shell-list li{
    text-align:left !important;
    text-justify:auto;
  }

  .portfolio-filter{
    min-height:44px;
  }

  .menu-toggle{
    width:44px;
    height:44px;
  }
}

@media(max-width:480px){
  .editorial-gallery{
    grid-template-columns:1fr;
    gap:30px;
  }
}


/* Very narrow phones (320–340 px): prevent long Polish headings from
   forcing the page wider than the viewport. */
@media(max-width:340px){
  h1,
  .hero h1,
  .service-hero-copy h1,
  .page-hero h1{
    font-size:34px !important;
  }
}


/* =============================
   v0.28 — Privacy / form / map
   ============================= */

.form-privacy{
  grid-column:1/-1;
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding-top:2px;
}
.form-privacy input{
  width:18px;
  height:18px;
  min-height:18px;
  margin-top:2px;
  flex:0 0 18px;
}
.form-privacy label{
  font-size:12px;
  line-height:1.6;
  letter-spacing:0;
  text-transform:none;
  font-weight:500;
  color:rgba(23,25,27,.65);
}
.form-privacy a{
  text-decoration:underline;
  text-underline-offset:2px;
}

.form-honeypot{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.map-consent{
  min-height:430px;
  width:100%;
  display:grid;
  place-items:center;
  padding:36px;
  text-align:center;
  background:#ece9e3;
}
.map-consent-inner{
  max-width:460px;
}
.map-consent h3{
  margin:8px 0 12px;
  font-size:26px;
}
.map-consent p{
  color:rgba(23,25,27,.64);
  font-size:13px;
  line-height:1.7;
  margin-bottom:20px;
}
.map-consent.is-loaded{
  padding:0;
}
.map-consent iframe{
  width:100%;
  height:430px;
  border:0;
}

.privacy-main{
  background:#f7f5f1;
  padding:88px 0 110px;
}
.privacy-wrap{
  max-width:980px;
}
.privacy-card{
  background:#fff;
  border:1px solid var(--line);
  padding:46px;
}
.privacy-card h2{
  margin-top:42px;
  font-size:28px;
}
.privacy-card h2:first-of-type{
  margin-top:0;
}
.privacy-card h3{
  margin-top:26px;
  font-size:18px;
}
.privacy-card p,
.privacy-card li{
  font-size:14px;
  line-height:1.78;
  color:rgba(23,25,27,.72);
}
.privacy-card ul{
  margin:12px 0 0 20px;
}
.privacy-card li+li{
  margin-top:8px;
}
.privacy-meta{
  margin-bottom:34px;
  padding-bottom:26px;
  border-bottom:1px solid var(--line);
  font-size:12px;
  color:rgba(23,25,27,.5);
}
.privacy-note{
  background:#eeebe5;
  padding:20px 22px;
  margin-top:28px;
}
.privacy-note p{
  margin:0;
}

.thanks-page{
  min-height:70vh;
  display:grid;
  place-items:center;
  background:#f7f5f1;
  padding:80px 22px;
}
.thanks-card{
  max-width:760px;
  text-align:center;
  background:#fff;
  border:1px solid var(--line);
  padding:54px 42px;
}
.thanks-card p{
  max-width:600px;
  margin:20px auto 28px;
  color:rgba(23,25,27,.68);
  line-height:1.75;
}

@media(max-width:720px){
  .privacy-main{
    padding:60px 0 76px;
  }
  .privacy-card{
    padding:28px 22px;
  }
  .map-consent,
  .map-consent iframe{
    min-height:360px;
    height:360px;
  }
}