
/* ==========================================================
   ES FASHIONS v35 — Screenshot-Driven Visual Cleanup
   Final public visual authority: typography, mobile spacing,
   WhatsApp submissions and non-repeating department imagery.
   ========================================================== */

:root{
  --v35-black:#070706;
  --v35-ink:#17140f;
  --v35-ivory:#f5efe5;
  --v35-gold:#d7ae5b;
  --v35-gold-deep:#a97b2d;
  --v35-line:rgba(215,174,91,.28);
  --v35-radius:22px;
}

/* One disciplined public typography system */
html,body,button,input,select,textarea,.btn,.v5-nav,.v8-nav,.v5-drawer,.v32-contact-band{
  font-family:"DM Sans",Arial,sans-serif!important;
}
h1,h2,h3,h4,.display-title,.v21-uniform-copy h1,.v21-section-heading h2,
.v32-head h2,.page-hero h1,.v27-service-hero h1,.v26-next-journey h2,
blockquote,.editorial-title{
  font-family:"Playfair Display",Georgia,serif!important;
  letter-spacing:-.035em;
}
body{
  overflow-x:hidden!important;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto}

/* Remove visible browser scrollbars from intentional swipe rails */
.v21-sector-grid,
.v32-image-grid,
.v31-story-grid,
.v26-card-rail,
.v35-swipe-rail{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
.v21-sector-grid::-webkit-scrollbar,
.v32-image-grid::-webkit-scrollbar,
.v31-story-grid::-webkit-scrollbar,
.v26-card-rail::-webkit-scrollbar,
.v35-swipe-rail::-webkit-scrollbar{
  display:none!important;
}

/* Uniform House: stop repeating one image and give cards consistent crops */
.v21-sector-card{
  overflow:hidden;
  border-radius:var(--v35-radius);
}
.v21-sector-card img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center;
}
.v21-editorial-media figure{
  overflow:hidden;
}
.v21-editorial-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.v21-uniform-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 24%;
}

/* Proposal step becomes a real action rather than placeholder copy */
.v35-proposal-note{
  margin:18px 0 4px;
  padding:16px 18px;
  border:1px solid var(--v35-line);
  background:rgba(215,174,91,.07);
  border-radius:16px;
}
.v35-proposal-note strong{
  display:block;
  color:#9a6e24;
  margin-bottom:5px;
  font-size:.82rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.v35-proposal-note p{
  margin:0;
  line-height:1.6;
}

/* WhatsApp control: readable desktop pill, compact phone button */
.v32-whatsapp-float{
  right:18px!important;
  bottom:22px!important;
  display:flex!important;
  max-width:min(330px,calc(100vw - 36px))!important;
  min-height:48px!important;
  padding:11px 16px!important;
  gap:9px!important;
  white-space:nowrap!important;
  line-height:1!important;
  overflow:hidden!important;
}
.v32-whatsapp-float span{
  width:28px;height:28px;display:grid;place-items:center;
  flex:0 0 28px;border-radius:50%;
  background:rgba(255,255,255,.14);
  font-size:.72rem!important;font-weight:800!important;
}
.v32-whatsapp-float b{
  display:block!important;
  overflow:hidden;text-overflow:ellipsis;
  font-size:.76rem!important;
}

/* Keep CTA sections away from fixed mobile nav */
main{position:relative}
.v32-contact-band,
.v27-final-quote,
.v26-next-journey{
  position:relative;
  z-index:1;
}

/* Large desktop clean-up of the uniforms collage */
@media(min-width:821px){
  .v21-editorial-media{
    display:grid!important;
    grid-template-columns:1.15fr .85fr!important;
    grid-template-rows:1fr 1fr!important;
    min-height:720px!important;
  }
  .v21-editorial-media figure:first-child{
    grid-row:1 / span 2!important;
  }
  .v21-editorial-media figure:nth-child(2),
  .v21-editorial-media figure:nth-child(3){
    min-height:0!important;
  }
}

/* Phones / tablets */
@media(max-width:820px){
  :root{
    --v35-mobile-nav:72px;
  }
  body{
    padding-bottom:calc(var(--v35-mobile-nav) + env(safe-area-inset-bottom,0px) + 18px)!important;
  }

  /* Typography: no more giant desktop titles on phones */
  .v21-uniform-copy h1,
  .page-hero h1,
  .v27-service-hero h1,
  .campaign-hero h1,
  .hero-copy h1{
    font-size:clamp(2.65rem,12.4vw,4.1rem)!important;
    line-height:.9!important;
    letter-spacing:-.05em!important;
    text-wrap:balance;
  }
  .section-head h2,
  .v21-section-heading h2,
  .v32-head h2,
  .v26-next-journey h2{
    font-size:clamp(2.15rem,10vw,3.3rem)!important;
    line-height:.96!important;
  }
  body,p,li,input,select,textarea{
    font-size:16px;
  }

  /* Uniform hero: image and content both visible in first screen, no giant dead black area */
  .v21-uniform-hero{
    display:grid!important;
    grid-template-columns:1fr!important;
    min-height:0!important;
  }
  .v21-uniform-visual{
    order:1!important;
    min-height:48vh!important;
    height:48vh!important;
    margin:0!important;
  }
  .v21-uniform-copy{
    order:2!important;
    min-height:0!important;
    padding:34px 0 22px!important;
  }
  .v21-uniform-copy-inner{
    width:calc(100% - 36px)!important;
    margin-inline:auto!important;
    padding:0!important;
  }
  .v21-uniform-copy h1{
    margin:10px 0 18px!important;
  }
  .v21-hero-metrics{
    margin-top:24px!important;
  }

  /* Sector cards: one proper card at a time, no grey scrollbar */
  .v21-sector-grid{
    display:flex!important;
    grid-template-columns:none!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:18px!important;
    gap:12px!important;
    margin-inline:-18px!important;
    padding:0 18px 4px!important;
  }
  .v21-sector-card{
    flex:0 0 84vw!important;
    min-width:84vw!important;
    max-width:84vw!important;
    scroll-snap-align:start!important;
  }
  .v21-sector-card img{
    aspect-ratio:4/5!important;
  }

  /* Editorial images: stop showing the same photo three times full-width */
  .v21-editorial-media{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:12px!important;
    padding:0 18px 8px!important;
    margin:0 -18px!important;
    min-height:0!important;
  }
  .v21-editorial-media figure{
    flex:0 0 84vw!important;
    min-width:84vw!important;
    height:62vh!important;
    max-height:560px!important;
    scroll-snap-align:start!important;
  }

  /* Real-work/detail rails from screenshots */
  .v31-story-grid,
  .v32-image-grid{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:12px!important;
  }
  .v31-story-grid > *,
  .v32-image-grid > *{
    flex:0 0 84vw!important;
    min-width:84vw!important;
    scroll-snap-align:start!important;
  }

  /* WhatsApp button becomes icon-like and never breaks text vertically */
  .v32-whatsapp-float{
    right:14px!important;
    bottom:calc(var(--v35-mobile-nav) + env(safe-area-inset-bottom,0px) + 10px)!important;
    width:52px!important;
    height:52px!important;
    min-height:52px!important;
    max-width:52px!important;
    padding:0!important;
    border-radius:50%!important;
    justify-content:center!important;
    gap:0!important;
  }
  .v32-whatsapp-float span{
    width:auto!important;height:auto!important;background:none!important;
    font-size:.72rem!important;
  }
  .v32-whatsapp-float b{display:none!important}

  /* Fixed bottom nav breathing room */
  .v5-bottom-nav,.v6-bottom-nav,.v8-bottom-nav{
    min-height:var(--v35-mobile-nav)!important;
  }
  .v5-bottom-nav a,.v8-bottom-nav a{
    min-width:0!important;
  }

  /* Forms / configurator */
  #commissionForm .v12-step-actions,
  .wizard-actions{
    gap:8px!important;
  }
  #commissionForm input,
  #commissionForm select,
  #commissionForm textarea,
  #bookingForm input,
  #bookingForm select,
  #bookingForm textarea,
  #studio input,
  #studio select,
  #studio textarea{
    width:100%!important;
    max-width:100%!important;
    font-size:16px!important;
  }
  .field-grid.two,.v12-field-grid{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:390px){
  .v21-uniform-copy h1,
  .page-hero h1,
  .v27-service-hero h1{
    font-size:clamp(2.45rem,12.2vw,3.45rem)!important;
  }
  .v21-sector-card,
  .v21-editorial-media figure,
  .v31-story-grid > *,
  .v32-image-grid > *{
    flex-basis:86vw!important;
    min-width:86vw!important;
    max-width:86vw!important;
  }
}
