/* ======================================================================
   ES FASHIONS v37 — Azure Pre-Deployment Responsive Authority
   Purpose: mobile-first fit, overflow safety, visual consistency,
   image-card discipline, and final cross-page polish.
   Loaded LAST so it can safely correct legacy v5–v36 conflicts.
   ====================================================================== */

:root{
  --v37-ink:#0b0a08;
  --v37-paper:#f6f0e7;
  --v37-paper-2:#eee5d7;
  --v37-gold:#c99a45;
  --v37-line:rgba(31,25,17,.16);
  --v37-mobile-header:64px;
  --v37-mobile-nav:70px;
  --v37-safe-inline:clamp(16px,4.5vw,24px);
}

/* ---------- universal fit safety ---------- */
*,*::before,*::after{box-sizing:border-box}
html{max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{max-width:100%;overflow-x:hidden}
img,video,canvas,svg{max-width:100%}
img{height:auto}
iframe{max-width:100%}
main,section,article,aside,header,footer,nav,form,fieldset,div{min-width:0}
input,select,textarea,button{max-width:100%;font:inherit}
textarea{resize:vertical}
pre,code{max-width:100%;overflow-wrap:anywhere}
a,p,li,span,strong,small,h1,h2,h3,h4,h5,h6{overflow-wrap:anywhere}

/* Keep section content bounded even when old versions set wide values. */
.container{
  width:min(1180px,calc(100% - 48px));
  max-width:1180px;
  margin-inline:auto;
}

/* Do not let grid/flex children force horizontal page overflow. */
[class*="grid"],[class*="split"],[class*="layout"],[class*="columns"],[class*="cards"]{min-width:0}
[class*="grid"]>* ,[class*="split"]>* ,[class*="layout"]>*{min-width:0}

/* Defensive image behavior across the 45 public pages. */
main figure{max-width:100%}
main figure img{display:block;max-width:100%}

.btn,
button,
input[type="submit"],
input[type="button"]{
  white-space:normal;
  text-wrap:balance;
  line-height:1.2;
}

/* Avoid overly long chips/pills causing overflow. */
.v9-service-ribbon,
.v27-hero-proof,
.customer-hero-pills,
.v21-fabric-tags,
.booking-badges{
  max-width:100%;
  flex-wrap:wrap!important;
}

/* ---------- v37 support gallery ---------- */
.v37-support-gallery{
  padding:72px 0;
  background:var(--v37-paper);
  color:#17130e;
  overflow:hidden;
}
.v37-support-gallery .v37-gallery-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,.72fr);
  gap:36px;
  align-items:end;
  margin-bottom:28px;
}
.v37-support-gallery .v37-gallery-head h2{
  margin:8px 0 0;
  font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(2.35rem,4.4vw,4.8rem);
  line-height:.96;
  letter-spacing:-.04em;
}
.v37-support-gallery .v37-gallery-head p{
  margin:0;
  color:#695f52;
  line-height:1.7;
}
.v37-support-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.v37-support-card{
  display:block;
  min-width:0;
  overflow:hidden;
  border:1px solid #dbcfbc;
  border-radius:16px;
  background:#fff;
  color:inherit;
  text-decoration:none;
}
.v37-support-card figure{
  margin:0;
  height:360px;
  overflow:hidden;
  background:#17130f;
}
.v37-support-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease;
}
.v37-support-card:hover img{transform:scale(1.025)}
.v37-support-card>div{padding:17px 18px 20px}
.v37-support-card small{
  display:block;
  margin-bottom:7px;
  color:#9b7029;
  font-size:.66rem;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.v37-support-card strong{
  display:block;
  font-family:"Playfair Display",Georgia,serif;
  font-size:1.42rem;
  line-height:1.08;
}
.v37-support-card span{
  display:block;
  margin-top:8px;
  color:#6c6257;
  font-size:.82rem;
  line-height:1.5;
}

/* Make existing v36 visual cards less repetitive-looking and more fluid. */
.v36-gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.v36-gallery-card figure{height:360px!important}

/* ---------- desktops / large tablets ---------- */
@media (min-width:821px){
  .v5-header,.v6-header,.v8-header{max-width:100%}
  .v8-mega-shell{max-height:calc(100vh - 140px);overflow:auto}
  .v12-config-layout,
  .customer-auth-grid,
  .message-layout,
  .v13-project-shell{align-items:start}
  .v32-whatsapp-float{z-index:60}
}

/* ======================================================================
   TABLET + PHONE AUTHORITY
   ====================================================================== */
@media (max-width:820px){
  :root{--v37-safe-inline:clamp(16px,4.6vw,22px)}

  body{
    padding-bottom:calc(var(--v37-mobile-nav) + env(safe-area-inset-bottom,0px) + 18px)!important;
  }
  .container{
    width:calc(100% - (var(--v37-safe-inline) * 2))!important;
    max-width:none!important;
    margin-inline:var(--v37-safe-inline)!important;
  }

  /* ---- Header: one compact mobile bar; old utility/desktop nav removed ---- */
  .v6-utility,.v8-utility{display:none!important}
  .v5-header,.v6-header,.v8-header{
    position:sticky!important;
    top:0!important;
    z-index:900!important;
    width:100%!important;
    min-height:var(--v37-mobile-header)!important;
    background:rgba(9,8,7,.97)!important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(255,255,255,.08)!important;
  }
  .v5-nav,.v6-nav,.v8-nav{
    min-height:var(--v37-mobile-header)!important;
    height:var(--v37-mobile-header)!important;
    width:100%!important;
    margin:0!important;
    padding:0 var(--v37-safe-inline)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
  }
  .v5-brand,.v8-brand{min-width:0!important;max-width:calc(100% - 56px)!important}
  .v5-monogram{flex:0 0 auto}
  .v5-brand-copy{min-width:0!important}
  .v5-brand-copy b{font-size:.92rem!important;letter-spacing:.08em!important}
  .v5-brand-copy small{
    display:block!important;
    max-width:190px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:.5rem!important;
  }
  .v5-desktop-nav,.v6-desktop-nav,.v8-desktop-nav,
  .v5-book-btn,.v8-project-btn,
  .v5-icon-btn,.v8-icon-btn{display:none!important}
  .v5-nav-actions,.v8-nav-actions{margin-left:auto!important;display:flex!important;flex:0 0 auto!important}
  .v5-menu-btn{
    display:flex!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .v6-category-rail,.v8-category-rail{display:none!important}
  .v5-mega,.v6-mega,.v8-mega{display:none!important}

  /* ---- Mobile drawer: viewport-safe, scrollable and tap-friendly ---- */
  .mobile-drawer,.v5-drawer,.v6-drawer,.v8-drawer{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    max-width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))!important;
  }
  .v5-drawer-top{position:sticky!important;top:0!important;z-index:2!important}
  .v8-mobile-hero{min-height:190px!important;max-height:230px!important}
  .v8-mobile-hero img{width:100%!important;height:100%!important;object-fit:cover!important}
  .v6-mobile-sections summary,
  .v6-mobile-sections a{min-height:46px!important;display:flex!important;align-items:center!important}
  .v5-drawer-foot{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .v5-drawer-foot select,.v5-drawer-foot .btn{width:100%!important}

  /* ---- Mobile bottom navigation ---- */
  .v5-bottom-nav,.v6-bottom-nav,.v8-bottom-nav{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    height:calc(var(--v37-mobile-nav) + env(safe-area-inset-bottom,0px))!important;
    padding-bottom:env(safe-area-inset-bottom,0px)!important;
    z-index:850!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
  .v5-bottom-nav a,.v6-bottom-nav a,.v8-bottom-nav a{
    min-width:0!important;
    padding-inline:2px!important;
  }
  .v5-bottom-nav small,.v6-bottom-nav small,.v8-bottom-nav small{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:.58rem!important;
  }

  /* ---- WhatsApp button stays above bottom nav and never spans the screen ---- */
  .v32-whatsapp-float{
    position:fixed!important;
    right:12px!important;
    left:auto!important;
    bottom:calc(var(--v37-mobile-nav) + env(safe-area-inset-bottom,0px) + 12px)!important;
    width:auto!important;
    max-width:calc(100vw - 24px)!important;
    min-height:44px!important;
    padding:10px 13px!important;
    border-radius:999px!important;
    z-index:840!important;
  }
  .v32-whatsapp-float b{font-size:.72rem!important;white-space:nowrap!important}

  /* ---- Global section rhythm and readable type ---- */
  .section,
  .v36-more-gallery,
  .v37-support-gallery{
    padding-top:clamp(48px,11vw,72px)!important;
    padding-bottom:clamp(48px,11vw,72px)!important;
  }
  h1,.display-title,
  .page-hero h1,
  .v9-campaign-hero h1,
  .v27-service-hero h1,
  .v21-uniform-copy h1,
  .customer-hero h1,
  .v12-config-hero h1,
  .v11-showroom-hero h1,
  .v13-project-hero h1{
    font-size:clamp(2.35rem,11vw,4rem)!important;
    line-height:.94!important;
    letter-spacing:-.045em!important;
    max-width:100%!important;
    text-wrap:balance!important;
  }
  h2,
  .section-head h2,
  .v21-section-heading h2,
  .v31-visual-story h2,
  .v32-head h2,
  .v36-more-gallery h2,
  .v37-support-gallery h2{
    font-size:clamp(2rem,9vw,3.15rem)!important;
    line-height:.98!important;
    text-wrap:balance!important;
  }
  h3{max-width:100%!important;text-wrap:balance!important}
  p,li{line-height:1.62!important}
  .eyebrow{font-size:.66rem!important;line-height:1.35!important;letter-spacing:.14em!important}

  /* ---- Generic buttons/actions: never squeeze three across ---- */
  .page-hero-actions,
  .v9-hero-actions,
  .v19-hero-actions,
  .v27-hero-actions,
  .v21-hero-actions,
  .v21-final-actions,
  .v13-header-actions,
  .wizard-actions,
  .v12-submit-row,
  .v11-showroom-cta{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
  }
  .page-hero-actions .btn,
  .v9-hero-actions .btn,
  .v19-hero-actions .btn,
  .v27-hero-actions .btn,
  .v21-hero-actions .btn,
  .v21-final-actions .btn,
  .wizard-actions .btn,
  .v12-submit-row .btn,
  .v11-showroom-cta .btn{
    width:100%!important;
    min-height:48px!important;
    justify-content:center!important;
    text-align:center!important;
  }

  /* ---- Home: kill the legacy 260–300px heading margin and dead space ---- */
  .v19-home-hero{
    min-height:0!important;
    height:auto!important;
    display:grid!important;
    grid-template-rows:minmax(360px,54svh) auto!important;
    background:#080706!important;
  }
  .v19-home-hero-bg{
    position:relative!important;
    inset:auto!important;
    grid-row:1!important;
    min-height:360px!important;
    height:54svh!important;
  }
  .v19-home-hero-bg img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 20%!important;
  }
  .v19-home-hero-bg::after{
    background:linear-gradient(180deg,rgba(5,5,4,.06),rgba(5,5,4,.42) 68%,rgba(5,5,4,.92))!important;
  }
  .v19-home-hero>.container{
    position:relative!important;
    z-index:2!important;
    grid-row:2!important;
    display:block!important;
    padding:26px 0 34px!important;
    min-height:0!important;
  }
  .v19-hero-copy{max-width:none!important;align-self:auto!important}
  .v19-hero-copy h1{
    margin:10px 0 16px!important;
    font-size:clamp(2.55rem,12vw,4.15rem)!important;
    line-height:.9!important;
  }
  .v19-hero-copy>p{font-size:.96rem!important;max-width:none!important}
  .v19-hero-side{display:none!important}
  .v19-category-strip{overflow:hidden!important}
  .v19-category-strip .container{width:100%!important;margin:0!important;padding-inline:var(--v37-safe-inline)!important}
  .v19-category-scroll,
  .v19-category-grid{
    display:flex!important;
    gap:12px!important;
    overflow-x:auto!important;
    overscroll-behavior-inline:contain!important;
    scroll-snap-type:x mandatory!important;
    scrollbar-width:none!important;
    padding-bottom:8px!important;
  }
  .v19-category-scroll::-webkit-scrollbar,.v19-category-grid::-webkit-scrollbar{display:none}
  .v19-category-card{
    flex:0 0 min(82vw,330px)!important;
    width:min(82vw,330px)!important;
    min-width:0!important;
    scroll-snap-align:start!important;
  }
  .v19-editorial-images,
  .v19-home-about,
  .v19-global-band .container,
  .v26-home-pathways-grid,
  .v11-home-showroom-grid{
    grid-template-columns:1fr!important;
  }
  .v19-editorial-images{grid-template-rows:none!important}
  .v19-editorial-images figure{grid-column:auto!important;min-height:280px!important;height:min(112vw,520px)!important}
  .v19-about-image,.v19-about-detail{min-height:0!important}

  /* ---- Standard page hero: media first + copy second instead of text sitting off-screen ---- */
  .page-hero{
    min-height:0!important;
    height:auto!important;
    display:grid!important;
    grid-template-rows:minmax(300px,45svh) auto!important;
    overflow:hidden!important;
  }
  .page-hero-media{
    position:relative!important;
    inset:auto!important;
    grid-row:1!important;
    min-height:300px!important;
    height:45svh!important;
  }
  .page-hero-media img{width:100%!important;height:100%!important;object-fit:cover!important}
  .page-hero-overlay{grid-row:1!important;position:absolute!important;inset:0!important;pointer-events:none!important}
  .page-hero-inner{
    position:relative!important;
    grid-row:2!important;
    align-self:auto!important;
    min-height:0!important;
    padding-top:26px!important;
    padding-bottom:34px!important;
  }
  .page-hero-inner h1{margin-top:10px!important;margin-bottom:14px!important}
  .page-breadcrumb{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px 8px!important;
    max-width:100%!important;
    font-size:.72rem!important;
  }

  /* ---- Campaign pages (menswear, bridal, textiles, production, etc.) ---- */
  .v9-campaign-hero{
    min-height:0!important;
    height:auto!important;
    display:grid!important;
    grid-template-rows:minmax(320px,48svh) auto!important;
    overflow:hidden!important;
  }
  .v9-campaign-media{
    position:relative!important;
    inset:auto!important;
    grid-row:1!important;
    min-height:320px!important;
    height:48svh!important;
  }
  .v9-campaign-media img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 22%!important}
  .v9-campaign-shade{position:absolute!important;inset:0!important;grid-row:1!important}
  .v9-campaign-content{
    position:relative!important;
    grid-row:2!important;
    padding-top:26px!important;
    padding-bottom:34px!important;
    min-height:0!important;
  }
  .v9-campaign-content p{max-width:none!important}
  .v9-service-ribbon{display:flex!important;gap:7px!important;margin-top:18px!important}
  .v9-service-ribbon span{font-size:.7rem!important}
  .v9-image-triptych,
  .v9-chapters,
  .v9-cross-sell,
  .v9-campaign-link-grid,
  .v9-tailoring-gateway{
    grid-template-columns:1fr!important;
  }
  .v9-image-triptych figure{min-height:320px!important}

  /* ---- v27 service pages: image/copy stack and all grids collapse ---- */
  .v27-service-hero{
    display:grid!important;
    grid-template-columns:1fr!important;
    min-height:0!important;
    height:auto!important;
  }
  .v27-service-image{
    order:1!important;
    margin:0!important;
    height:min(108vw,470px)!important;
    min-height:300px!important;
  }
  .v27-service-image img{width:100%!important;height:100%!important;object-fit:cover!important}
  .v27-service-copy{order:2!important;min-height:0!important;height:auto!important;padding:28px 0 34px!important}
  .v27-service-copy-inner{width:calc(100% - (var(--v37-safe-inline) * 2))!important;max-width:none!important;margin-inline:auto!important}
  .v27-deliverables,
  .v27-process,
  .v27-prepare-grid,
  .v27-related,
  .v27-service-gateway,
  .v27-faq{
    grid-template-columns:1fr!important;
  }
  .v27-deliverables,.v27-process{overflow:visible!important}
  .v27-final-quote .container{display:grid!important;grid-template-columns:1fr!important;gap:18px!important}

  /* ---- Uniform house ---- */
  .v21-uniform-hero{
    display:grid!important;
    grid-template-columns:1fr!important;
    min-height:0!important;
    height:auto!important;
  }
  .v21-uniform-visual{order:1!important;height:min(108vw,460px)!important;min-height:320px!important;max-height:460px!important}
  .v21-uniform-visual img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 25%!important}
  .v21-uniform-copy{order:2!important;min-height:0!important;height:auto!important;padding:30px 0 34px!important}
  .v21-uniform-copy-inner{width:calc(100% - (var(--v37-safe-inline) * 2))!important;margin-inline:auto!important;max-width:none!important}
  .v21-sector-grid,
  .v21-editorial-split,
  .v21-fabric-split,
  .v21-management-grid,
  .v21-process-grid,
  .v21-order-grid{
    grid-template-columns:1fr!important;
  }
  .v21-sector-grid{display:grid!important;overflow:visible!important;gap:12px!important}
  .v21-sector-card{height:min(115vw,480px)!important;min-height:330px!important;width:100%!important}
  .v21-editorial-media{min-height:0!important;grid-template-columns:1fr!important}
  .v21-editorial-media figure{height:min(115vw,500px)!important;min-height:320px!important}

  /* ---- Configurator: preview no longer steals width from fields ---- */
  .v12-config-hero{
    display:grid!important;
    grid-template-rows:minmax(320px,48svh) auto!important;
    min-height:0!important;
    height:auto!important;
  }
  .v12-config-hero-media{position:relative!important;inset:auto!important;grid-row:1!important;height:48svh!important;min-height:320px!important}
  .v12-config-hero-media img{width:100%!important;height:100%!important;object-fit:cover!important}
  .v12-config-hero-overlay{grid-row:1!important;position:absolute!important;inset:0!important}
  .v12-config-hero-inner{grid-row:2!important;position:relative!important;padding-top:26px!important;padding-bottom:34px!important;min-height:0!important}
  .v12-config-layout{display:grid!important;grid-template-columns:1fr!important;gap:20px!important}
  .v12-config-preview{position:static!important;top:auto!important;width:100%!important;max-width:100%!important;order:-1!important}
  .v12-config-workspace,.v12-config-preview{min-width:0!important}
  .v12-choice-grid,.v12-colour-grid,.v12-option-grid,.v12-form-grid{grid-template-columns:1fr!important}
  .v12-source-strip{overflow-x:auto!important;max-width:100%!important}
  .v12-submit-row{
    position:sticky!important;
    bottom:calc(var(--v37-mobile-nav) + env(safe-area-inset-bottom,0px) + 8px)!important;
    z-index:20!important;
    padding:10px!important;
    border-radius:14px!important;
    background:rgba(18,15,12,.94)!important;
    backdrop-filter:blur(12px)!important;
  }

  /* ---- Design studio wizard ---- */
  .wizard-wrap{width:100%!important;max-width:100%!important;overflow:hidden!important}
  .wizard-layout,.wizard-grid,.choice-grid,.field-grid,.field-grid.two,.fit-grid,.fit-steps{
    grid-template-columns:1fr!important;
  }
  .wizard-step{min-width:0!important;width:100%!important}
  .choice-card,.fit-card{min-width:0!important;width:100%!important}
  .wizard-progress{max-width:100%!important;overflow-x:auto!important;scrollbar-width:none!important}
  .wizard-progress::-webkit-scrollbar{display:none}
  .upload-box{max-width:100%!important}

  /* ---- Contact / newsletter forms ---- */
  .booking-grid,.newsletter-grid,.contact-grid,.contact-options,
  .form-grid,.form-grid.two,.booking-form .form-row,
  .newsletter-form .form-row{
    grid-template-columns:1fr!important;
  }
  .booking-form,.newsletter-form{min-width:0!important;max-width:100%!important}
  .booking-form input,.booking-form select,.booking-form textarea,
  .newsletter-form input,.newsletter-form select,.newsletter-form textarea{
    width:100%!important;min-width:0!important
  }

  /* ---- Customer account ---- */
  .customer-hero{
    display:grid!important;
    grid-template-rows:minmax(300px,44svh) auto!important;
    min-height:0!important;
    height:auto!important;
  }
  .customer-hero-media{position:relative!important;inset:auto!important;grid-row:1!important;height:44svh!important;min-height:300px!important}
  .customer-hero-media img{width:100%!important;height:100%!important;object-fit:cover!important}
  .customer-hero-overlay{grid-row:1!important;position:absolute!important;inset:0!important}
  .customer-hero-inner{grid-row:2!important;position:relative!important;padding-top:26px!important;padding-bottom:34px!important;min-height:0!important}
  .customer-auth-grid,.customer-summary,.message-layout,.customer-dashboard-grid,.customer-benefits{
    grid-template-columns:1fr!important;
  }
  .customer-auth-card,.customer-auth-story,.customer-dashboard,.customer-panel{min-width:0!important;max-width:100%!important}
  .customer-tabs{display:flex!important;max-width:100%!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:none!important}
  .customer-tabs::-webkit-scrollbar{display:none}
  .customer-tabs button{flex:0 0 auto!important}
  .customer-head-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}

  /* ---- Client project portal ---- */
  .v13-project-hero{min-height:0!important;height:auto!important;padding:0!important}
  .v25-project-hero-media{position:relative!important;height:42svh!important;min-height:300px!important}
  .v25-project-hero-media img{width:100%!important;height:100%!important;object-fit:cover!important}
  .v13-project-hero-inner{display:grid!important;grid-template-columns:1fr!important;gap:20px!important;padding-top:28px!important;padding-bottom:34px!important}
  .v13-project-seal{justify-self:start!important}
  .v13-project-shell,.v13-project-grid,.v13-lookup-form,.v13-summary-grid{
    grid-template-columns:1fr!important;
  }
  .v13-panel,.v13-lookup-card{min-width:0!important;width:100%!important}
  .v13-payment-list,.v13-event-list,.v13-milestone-list{max-width:100%!important;overflow:auto!important}

  /* ---- Showroom ---- */
  .v11-showroom-hero{
    display:grid!important;
    grid-template-rows:minmax(320px,48svh) auto!important;
    min-height:0!important;
    height:auto!important;
  }
  .v11-showroom-hero-media{position:relative!important;inset:auto!important;grid-row:1!important;height:48svh!important;min-height:320px!important}
  .v11-showroom-hero-media img{width:100%!important;height:100%!important;object-fit:cover!important}
  .v11-showroom-hero-overlay{position:absolute!important;inset:0!important;grid-row:1!important}
  .v11-showroom-hero-inner{position:relative!important;grid-row:2!important;padding-top:26px!important;padding-bottom:34px!important;min-height:0!important}
  .v11-showroom-facts,.v11-showroom-grid,.v11-proof-key,.v11-colour-picker{
    grid-template-columns:1fr 1fr!important;
  }
  .v11-showroom-nav{max-width:100%!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:none!important}
  .v11-showroom-nav::-webkit-scrollbar{display:none}
  .v11-showroom-card{min-width:0!important}

  /* ---- v31/v32 visual stories and expansion galleries ---- */
  .v31-visual-grid,.v31-visual-story,.v31-service-gallery,
  .v32-expansion-grid,.v32-grid,.v32-contact-grid{
    grid-template-columns:1fr!important;
  }
  .v31-visual-story figure,.v32-expansion figure{min-height:280px!important;height:min(112vw,500px)!important}

  /* ---- More gallery v36/v37 ---- */
  .v36-more-gallery .v36-gallery-head,
  .v37-support-gallery .v37-gallery-head{
    grid-template-columns:1fr!important;
    gap:16px!important;
    margin-bottom:20px!important;
  }
  .v36-gallery-grid,.v37-support-grid{grid-template-columns:1fr!important;gap:12px!important}
  .v36-gallery-card figure,.v37-support-card figure{height:min(112vw,470px)!important}

  /* ---- Footer ---- */
  .v8-footer-hero,.v5-footer-top,.v6-footer-top,.v5-footer-links,.v6-footer-links,.v5-footer-bottom{
    grid-template-columns:1fr!important;
    display:grid!important;
    gap:24px!important;
  }
  .v8-footer-hero .btn{width:100%!important;justify-content:center!important}
  .v5-footer-links,.v6-footer-links{grid-template-columns:1fr 1fr!important}
  .v5-footer-bottom{padding-bottom:22px!important}
  .v5-footer-bottom>div{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .v5-footer-bottom select{width:100%!important}

  /* ---- Tables / dense business data: internal scroll, never page overflow ---- */
  table{width:100%!important;max-width:100%!important}
  .table-wrap,.data-table-wrap,.v13-table-wrap,.customer-table-wrap{overflow-x:auto!important;max-width:100%!important;-webkit-overflow-scrolling:touch}

  /* ---- Search / lightbox / moodboard fit ---- */
  .v5-search,.v8-search,.lightbox,.moodboard-drawer{max-width:100vw!important}
  .v5-search-inner,.lightbox-figure{max-width:100%!important}
  .lightbox-figure{grid-template-columns:1fr!important}
  .lightbox-figure img{max-height:66svh!important;object-fit:contain!important}
  .moodboard-drawer{width:min(100vw,420px)!important}
}

/* ======================================================================
   SMALL PHONES — 520px and below
   ====================================================================== */
@media (max-width:520px){
  :root{--v37-safe-inline:16px}
  .v5-brand-copy small{max-width:150px!important}
  .v11-showroom-facts,.v11-showroom-grid,.v11-proof-key,.v11-colour-picker,
  .v5-footer-links,.v6-footer-links{grid-template-columns:1fr!important}
  .v19-home-hero{grid-template-rows:minmax(330px,50svh) auto!important}
  .v19-home-hero-bg{height:50svh!important;min-height:330px!important}
  .page-hero,.v9-campaign-hero,.v11-showroom-hero,.v12-config-hero,.customer-hero{
    grid-template-rows:minmax(280px,42svh) auto!important;
  }
  .page-hero-media,.v9-campaign-media,.v11-showroom-hero-media,.v12-config-hero-media,.customer-hero-media{
    height:42svh!important;min-height:280px!important;
  }
  .v27-service-image,.v21-uniform-visual{height:min(118vw,430px)!important}
  .v32-whatsapp-float b{display:none!important}
  .v32-whatsapp-float{width:48px!important;height:48px!important;padding:0!important;display:grid!important;place-items:center!important}
  .v32-whatsapp-float span{font-size:.72rem!important;font-weight:800!important}
  .v13-project-seal{transform:scale(.9);transform-origin:left top}
}

/* ======================================================================
   VERY NARROW PHONES — 360px and below
   ====================================================================== */
@media (max-width:360px){
  :root{--v37-safe-inline:13px}
  .v5-brand-copy small{display:none!important}
  .v5-brand-copy b{font-size:.84rem!important}
  h1,.page-hero h1,.v9-campaign-hero h1,.v27-service-hero h1,
  .v21-uniform-copy h1,.customer-hero h1,.v12-config-hero h1,.v11-showroom-hero h1,.v13-project-hero h1{
    font-size:clamp(2.1rem,10.8vw,3rem)!important;
  }
  .btn{padding-inline:14px!important}
  .v5-bottom-nav small,.v6-bottom-nav small,.v8-bottom-nav small{font-size:.52rem!important}
}

/* Short landscape phone: preserve usable vertical space. */
@media (max-width:820px) and (max-height:520px) and (orientation:landscape){
  .v19-home-hero-bg,.page-hero-media,.v9-campaign-media,.v11-showroom-hero-media,.v12-config-hero-media,.customer-hero-media{
    height:62svh!important;min-height:250px!important;
  }
  .mobile-drawer,.v5-drawer,.v6-drawer,.v8-drawer{height:100dvh!important}
}

/* Accessibility: avoid forced animation for users who request reduced motion. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* ======================================================================
   V38 BRAND LOGO + FABRIC EXPERIENCE
   ====================================================================== */

/* --- New ES FASHIONS gold logo across header, loaders, drawer and footer --- */
.es-logo-brand{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:184px!important;
  min-width:184px!important;
  height:68px!important;
  padding:0!important;
  overflow:visible!important;
}
.es-brand-logo{
  display:block!important;
  width:156px!important;
  height:auto!important;
  max-height:66px!important;
  object-fit:contain!important;
  object-position:left center!important;
  filter:drop-shadow(0 4px 14px rgba(203,163,91,.15));
}
.es-loader-mark{
  display:grid!important;
  place-items:center!important;
  width:min(72vw,340px)!important;
  min-height:160px!important;
  padding:22px!important;
}
.es-loader-mark img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  filter:drop-shadow(0 12px 32px rgba(196,151,69,.2));
}
.v5-loader .es-loader-mark span,.v5-loader .es-loader-mark small,
.v8-transition .es-loader-mark span,.v8-transition .es-loader-mark small{display:none!important}
.es-footer-logo-wrap{display:flex;align-items:center;justify-content:flex-start;min-width:190px}
.es-footer-logo{display:block;width:min(210px,100%);height:auto;filter:drop-shadow(0 8px 22px rgba(212,176,106,.16))}

/* --- Fabric storytelling: tactile, editorial and premium --- */
.v38-fabric-story,
.v38-textile-library,
.v38-fabric-workbench{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 8%,rgba(194,153,87,.10),transparent 28%),
    linear-gradient(180deg,#f7f1e8 0%,#efe5d7 100%);
}
.v38-fabric-story::before,
.v38-textile-library::before,
.v38-fabric-workbench::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.16;
  background-image:
    linear-gradient(105deg,rgba(255,255,255,.7) 0 1px,transparent 1px 9px),
    linear-gradient(15deg,rgba(75,52,30,.16) 0 1px,transparent 1px 11px);
  background-size:12px 12px,16px 16px;
  mix-blend-mode:multiply;
}
.v38-fabric-story>.container,
.v38-textile-library>.container,
.v38-fabric-workbench>.container{position:relative;z-index:1}
.v38-fabric-intro{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(280px,.72fr);
  gap:clamp(26px,5vw,80px);
  align-items:end;
  margin-bottom:34px;
}
.v38-fabric-intro h2{
  margin:8px 0 0;
  max-width:820px;
  font-size:clamp(3rem,5.4vw,6.6rem);
  line-height:.88;
  letter-spacing:-.045em;
}
.v38-fabric-intro>p{margin:0;color:#675b4e;line-height:1.8;max-width:610px}

.v38-fabric-stage{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(280px,.75fr);
  gap:10px;
  background:#0b0a09;
  padding:10px;
  box-shadow:0 30px 80px rgba(44,30,15,.14);
}
.v38-fabric-stage figure{margin:0;position:relative;overflow:hidden;background:#15120f}
.v38-fabric-main{min-height:660px}
.v38-fabric-main img,.v38-fabric-swatches img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .75s ease}
.v38-fabric-main:hover img,.v38-fabric-swatches figure:hover img{transform:scale(1.035)}
.v38-fabric-main::after,.v38-fabric-swatches figure::after,.v38-textile-card::after,.v38-workbench-grid figure::after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 46%,rgba(0,0,0,.78) 100%);pointer-events:none
}
.v38-fabric-main figcaption{
  position:absolute;z-index:2;left:26px;right:26px;bottom:24px;color:#fff
}
.v38-fabric-main figcaption span,.v38-textile-card figcaption span,.v38-workbench-grid figcaption span{
  display:block;color:#d8b36d;font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px
}
.v38-fabric-main figcaption strong{display:block;font-family:"Playfair Display",serif;font-size:clamp(1.8rem,3vw,3.2rem);line-height:1}
.v38-fabric-swatches{display:grid;grid-template-rows:repeat(3,1fr);gap:10px}
.v38-fabric-swatches figure{min-height:210px}
.v38-fabric-swatches figcaption{position:absolute;z-index:2;left:16px;right:16px;bottom:15px;color:#fff}
.v38-fabric-swatches b{display:block;font-family:"Playfair Display",serif;font-size:1.35rem;line-height:1.05}
.v38-fabric-swatches small{display:block;margin-top:5px;color:rgba(255,255,255,.72);font-size:.68rem;letter-spacing:.04em}

.v38-fabric-notes{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin-top:28px;
  border:1px solid #d5c8b6;
  background:#d5c8b6;
}
.v38-fabric-notes article{background:#f8f3eb;padding:28px;min-height:210px}
.v38-fabric-notes span{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid #b89761;border-radius:50%;font-size:.62rem;font-weight:800;color:#8c6a35}
.v38-fabric-notes h3{font-size:1.5rem;margin:22px 0 10px}
.v38-fabric-notes p{margin:0;color:#6e6358;line-height:1.72}
.v38-fabric-story .center-action{display:flex!important;justify-content:center!important;gap:10px!important;flex-wrap:wrap!important;margin-top:32px!important}
.v38-fabric-story .btn-outline{border:1px solid #191611;background:transparent;color:#191611}

/* --- Textile library cards --- */
.v38-textile-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr .75fr;
  grid-auto-rows:320px;
  gap:10px;
}
.v38-textile-card{margin:0;position:relative;overflow:hidden;background:#111}
.v38-textile-card.feature{grid-row:span 2}
.v38-textile-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .75s ease,filter .75s ease}
.v38-textile-card:hover img{transform:scale(1.035);filter:saturate(1.06)}
.v38-textile-card figcaption{position:absolute;z-index:2;left:18px;right:18px;bottom:17px;color:#fff}
.v38-textile-card figcaption strong{display:block;font-family:"Playfair Display",serif;font-size:1.55rem;line-height:1.05}
.v38-textile-card.feature figcaption strong{font-size:clamp(2rem,3vw,3.3rem)}
.v38-textile-card figcaption small{display:block;margin-top:6px;color:rgba(255,255,255,.72);line-height:1.45;max-width:330px}
.v38-textile-note{
  display:flex;justify-content:space-between;align-items:center;gap:32px;
  margin-top:28px;padding:28px 30px;border:1px solid #d4c3aa;background:rgba(255,255,255,.46);backdrop-filter:blur(8px)
}
.v38-textile-note h3{font-size:clamp(1.8rem,3vw,3.2rem);margin:7px 0 8px}
.v38-textile-note p{margin:0;color:#6c6053;max-width:760px;line-height:1.7}
.v38-textile-note .btn{flex:0 0 auto}

/* --- Fabric & Sewing workbench --- */
.v38-workbench-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  grid-template-rows:300px 300px;
  gap:10px;
  padding:10px;
  background:#0a0908;
  box-shadow:0 28px 70px rgba(35,24,13,.14);
}
.v38-workbench-grid figure{margin:0;position:relative;overflow:hidden;background:#111}
.v38-workbench-large{grid-row:1/3}
.v38-workbench-grid figure:nth-child(4){grid-column:2/4}
.v38-workbench-grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .75s ease}
.v38-workbench-grid figure:hover img{transform:scale(1.035)}
.v38-workbench-grid figcaption{position:absolute;z-index:2;left:18px;right:18px;bottom:16px;color:#fff}
.v38-workbench-grid figcaption strong{display:block;font-family:"Playfair Display",serif;font-size:1.45rem}
.v38-workbench-grid figcaption small{display:block;margin-top:5px;color:rgba(255,255,255,.7);line-height:1.4}
.v38-workbench-large figcaption strong{font-size:clamp(2rem,3vw,3rem)}

@media (max-width:1100px){
  .es-logo-brand{width:150px!important;min-width:150px!important}.es-brand-logo{width:132px!important;max-height:58px!important}
  .v38-fabric-intro{grid-template-columns:1fr;gap:18px}
  .v38-textile-grid{grid-template-columns:1fr 1fr;grid-auto-rows:330px}.v38-textile-card.feature{grid-column:1/-1;grid-row:auto;min-height:520px}
  .v38-workbench-grid{grid-template-columns:1fr 1fr;grid-template-rows:420px 280px 280px}.v38-workbench-large{grid-column:1/-1;grid-row:auto}.v38-workbench-grid figure:nth-child(4){grid-column:1/-1}
}

@media (max-width:760px){
  .es-logo-brand{width:124px!important;min-width:124px!important;height:60px!important}.es-brand-logo{width:112px!important;max-height:54px!important}
  .es-logo-brand-mobile{width:145px!important;min-width:145px!important}.es-logo-brand-mobile .es-brand-logo{width:136px!important}
  .es-loader-mark{width:min(78vw,260px)!important;min-height:120px!important;padding:14px!important}
  .es-footer-logo-wrap{min-width:0}.es-footer-logo{width:170px}
  .v38-fabric-intro{margin-bottom:22px}
  .v38-fabric-intro h2{font-size:clamp(2.55rem,11vw,4.2rem)}
  .v38-fabric-stage{grid-template-columns:1fr;padding:7px;gap:7px}
  .v38-fabric-main{min-height:470px}
  .v38-fabric-swatches{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:7px}
  .v38-fabric-swatches figure{min-height:230px}
  .v38-fabric-swatches figure:last-child{grid-column:1/-1;min-height:260px}
  .v38-fabric-notes{grid-template-columns:1fr}
  .v38-fabric-notes article{min-height:0;padding:22px}
  .v38-fabric-story .center-action{display:grid!important;grid-template-columns:1fr!important}.v38-fabric-story .center-action .btn{width:100%!important}
  .v38-textile-grid{grid-template-columns:1fr;grid-auto-rows:360px}.v38-textile-card.feature{grid-column:auto;min-height:480px}.v38-textile-card{min-height:360px}
  .v38-textile-note{align-items:flex-start;flex-direction:column;padding:22px}.v38-textile-note .btn{width:100%!important;justify-content:center!important}
  .v38-workbench-grid{grid-template-columns:1fr;grid-template-rows:none;padding:7px;gap:7px}.v38-workbench-large,.v38-workbench-grid figure:nth-child(4){grid-column:auto;grid-row:auto}.v38-workbench-grid figure{min-height:330px}.v38-workbench-large{min-height:480px!important}
}

@media (max-width:420px){
  .es-logo-brand{width:104px!important;min-width:104px!important}.es-brand-logo{width:96px!important;max-height:48px!important}
  .es-logo-brand-mobile{width:132px!important;min-width:132px!important}.es-logo-brand-mobile .es-brand-logo{width:124px!important}
  .v38-fabric-main{min-height:400px}.v38-fabric-swatches{grid-template-columns:1fr}.v38-fabric-swatches figure,.v38-fabric-swatches figure:last-child{grid-column:auto;min-height:250px}
  .v38-textile-card,.v38-textile-grid{min-height:0}.v38-textile-grid{grid-auto-rows:320px}.v38-textile-card.feature{min-height:410px}
}