/* ==========================================================================
   Merchants - HOME (TERRAIN look): hero with organic photo shape, "Shop by texture" tiles, "New perspectives" row, closing banner
   ========================================================================== */
.mc-home{background:var(--mc-bg);overflow-x:clip}

/* ---------- hero ---------- */
.mc-hero2{position:relative;display:flex;align-items:center;min-height:calc(min(78vw,1500px) / 1.5 + clamp(20px,3vw,48px));padding:clamp(28px,4vw,64px) var(--mc-gutter) clamp(28px,3.6vw,56px);isolation:isolate}
.mc-hero2-copy{position:relative;z-index:2;max-width:min(58%,900px)}
/* headline: heavy high-contrast display serif, very large, overlaps the photo like the Terrain mockup */
body.merchants .mc-hero2-title{margin:0 0 clamp(20px,2.4vw,38px);font-family:"Playfair Display","Cormorant Garamond",Georgia,serif;font-weight:600;font-size:clamp(3.9rem,11.4vw,12.5rem);line-height:.9;letter-spacing:-.05em;color:var(--mc-ink);text-shadow:0 0 .01em currentColor}
.mc-hero2-title span{display:block}
.mc-hero2-title span+span{padding-left:.42em}
.mc-hero2-text{max-width:min(21em,21.5vw);margin:0 0 clamp(22px,2.4vw,36px);font-family:var(--mc-serif);font-size:clamp(1.02rem,.82rem + .5vw,1.4rem);font-weight:600;line-height:1.42;color:var(--mc-text)}
/* the hero photo is a ready-cut organic shape (transparent WebP, 3:2) - no clipping or background here; it bleeds off the right edge */
.mc-hero2-photo{position:absolute;z-index:1;top:0;right:-1.2%;width:min(78%,1500px);margin:0}
.mc-hero2-photo img{display:block;width:100%;height:auto}
.mc-hero2-side{position:absolute;z-index:2;top:clamp(96px,8vw,160px);right:var(--mc-gutter);width:clamp(140px,15vw,250px);text-align:left;color:var(--mc-ink);text-shadow:0 0 14px rgba(236,229,218,.85),0 0 4px rgba(236,229,218,.6)}
.mc-hero2-side p{margin:0;font-family:var(--mc-serif);font-size:clamp(.74rem,.64rem + .22vw,.92rem);font-weight:700;letter-spacing:.22em;line-height:1.7;text-transform:uppercase;color:var(--mc-ink)}
.mc-hero2-side i{display:block;width:62px;height:1px;margin:clamp(16px,2vw,26px) 0;background:var(--mc-ink);opacity:.7}

/* ---------- section head ---------- */
.mc-sec-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 24px;margin:0 0 clamp(18px,2.2vw,34px);padding:0 var(--mc-gutter)}
.mc-sec-title{margin:0;font-family:var(--mc-serif);font-weight:500;font-size:clamp(2rem,1.5rem + 1.6vw,3rem);letter-spacing:-.015em;color:var(--mc-ink)}
.mc-sec-sub{margin:0;font-family:var(--mc-serif);font-size:clamp(1.1rem,1rem + .3vw,1.4rem);color:var(--mc-text-2)}

/* ---------- shop by texture ---------- */
/* lighter beige band than the page (#ece5da) so the fabric tiles stand out */
.mc-tex{padding:clamp(36px,4.6vw,72px) 0 clamp(44px,5.4vw,88px);background:#f1eadd}
.mc-tex-track{scroll-padding-inline:var(--mc-gutter);display:flex;gap:clamp(16px,2vw,34px);padding:6px var(--mc-gutter) 14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.mc-tex-track::-webkit-scrollbar{display:none}
.mc-tex-tile{position:relative;flex:0 0 clamp(280px,31vw,560px);aspect-ratio:1.22/1;display:block;overflow:hidden;scroll-snap-align:start;isolation:isolate;color:#fff;border-radius:44% 56% 50% 50% / 38% 42% 58% 62%;transition:transform .7s var(--mc-ease),box-shadow .5s var(--mc-ease)}
.mc-tex-tile:nth-child(2){border-radius:50% 50% 46% 54% / 34% 40% 60% 66%}
.mc-tex-tile:nth-child(3){border-radius:42% 58% 52% 48% / 40% 36% 64% 60%}
.mc-tex-tile:nth-child(4){border-radius:54% 46% 48% 52% / 36% 44% 56% 64%}
.mc-tex-tile:nth-child(5){border-radius:46% 54% 56% 44% / 42% 38% 62% 58%}
.mc-tex-tile:hover{color:#fff;transform:translateY(-4px);box-shadow:var(--mc-shadow-lift)}
.mc-tex-tile.is-dark,.mc-tex-tile.is-dark:hover{color:var(--mc-ink)}
.mc-tex-bg{position:absolute;inset:0;z-index:-2;background-color:var(--tone,#a8957b);
  background-image:var(--tex,none),radial-gradient(120% 90% at 18% 8%,rgba(255,255,255,.22),transparent 58%),radial-gradient(90% 90% at 90% 100%,rgba(0,0,0,.22),transparent 60%),repeating-linear-gradient(45deg,rgba(0,0,0,.04) 0 2px,transparent 2px 6px),repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 2px,transparent 2px 6px);
  background-size:cover,auto,auto,auto,auto;background-position:center;transition:transform 1.1s var(--mc-ease)}
.mc-tex-tile.has-tex .mc-tex-bg{background-image:var(--tex);background-size:cover}
.mc-tex-tile:hover .mc-tex-bg{transform:scale(1.05)}
.mc-tex-tile.is-light::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(32,16,12,.34) 0,rgba(32,16,12,.1) 55%,transparent 100%)}
.mc-tex-prod-plate{position:absolute;right:5%;top:13%;bottom:13%;width:38%;display:flex;align-items:center;justify-content:center;border-radius:46% 54% 50% 50% / 52% 46% 54% 48%;background:rgba(246,241,232,.92)}
.mc-tex-prod{width:86%;height:86%;object-fit:contain;mix-blend-mode:multiply;transition:transform .8s var(--mc-ease)}
.mc-tex-tile:hover .mc-tex-prod{transform:scale(1.05)}
.mc-tex-copy{position:absolute;left:clamp(20px,3vw,44px);bottom:clamp(20px,3vw,40px);display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:52%}
.mc-tex-name{font-family:var(--mc-serif);font-weight:500;font-size:clamp(1.8rem,1.15rem + 1.5vw,3.1rem);line-height:1;letter-spacing:-.01em}
.mc-tex-subline{font-family:var(--mc-serif);font-size:clamp(.66rem,.6rem + .2vw,.8rem);font-weight:600;letter-spacing:.2em;line-height:1.6;text-transform:uppercase;opacity:.92}
.mc-tex-go{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-top:10px;border:1px solid currentColor;border-radius:50%;transition:background-color .3s var(--mc-ease),color .3s var(--mc-ease)}
.mc-tex-go .mc-icon{width:18px;height:18px}
.mc-tex-tile:hover .mc-tex-go{background:#fff;color:var(--mc-ink)}
.mc-tex-tile.is-dark:hover .mc-tex-go{background:var(--mc-ink);color:var(--mc-on-accent)}

/* finished tile pictures (images/tex-<key>.webp: fabric blob + product on cream, 3:2, background = section colour): the picture IS the tile, the label sits centre-left */
.mc-tex-tile.has-tex{flex-basis:clamp(300px,34vw,640px);aspect-ratio:3/2;border-radius:0;overflow:visible;box-shadow:none;background:none}
.mc-tex-tile.has-tex:hover{box-shadow:none}
.mc-tex-tile.has-tex.is-light::before{display:none}
.mc-tex-img{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:contain;transition:transform .8s var(--mc-ease)}
.mc-tex-tile.has-tex:hover .mc-tex-img{transform:scale(1.025)}
.mc-tex-tile.has-tex .mc-tex-copy{left:clamp(24px,6.5%,64px);top:50%;bottom:auto;transform:translateY(-50%);max-width:44%}
.mc-tex-tile.has-tex.is-light .mc-tex-copy{text-shadow:0 1px 16px rgba(24,12,8,.5)}
.mc-tex-tile.has-tex.is-dark .mc-tex-copy{text-shadow:0 0 14px rgba(241,234,221,.65)}

/* ---------- new perspectives ---------- */
.mc-newrow{padding:clamp(8px,1vw,16px) 0 clamp(40px,5vw,84px)}
.mc-newrow-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(10px,1.3vw,22px);padding:0 var(--mc-gutter)}

/* ---------- closing banner ---------- */
.mc-banner2{position:relative;display:flex;align-items:center;justify-content:flex-end;min-height:clamp(340px,34vw,620px);padding:clamp(32px,4vw,72px) var(--mc-gutter);background:#4d403b;color:var(--mc-on-dark);overflow:hidden;isolation:isolate}
.mc-banner2-photo{position:absolute;inset:0;z-index:-2}
.mc-banner2-photo img{width:100%;height:100%;object-fit:cover;object-position:left center}
.mc-banner2::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(60,48,43,0) 0,rgba(60,48,43,.35) 45%,rgba(60,48,43,.9) 78%)}
.mc-banner2-copy{width:min(100%,460px)}
body.merchants .mc-banner2-copy h2{margin:0;font-family:var(--mc-serif);font-weight:500;font-size:clamp(2rem,1.4rem + 1.9vw,3.2rem);line-height:1.08;color:var(--mc-on-dark)}
.mc-banner2-copy i{display:block;width:60px;height:1px;margin:clamp(14px,1.6vw,22px) 0;background:var(--mc-on-dark);opacity:.6}
.mc-banner2-copy p{margin:0 0 clamp(18px,2vw,28px);font-family:var(--mc-serif);font-size:clamp(1.05rem,1rem + .25vw,1.3rem);line-height:1.45;color:var(--mc-on-dark-2)}
body.merchants .mc-btn-outline-light{background:transparent;color:var(--mc-on-dark);border:1px solid var(--mc-on-dark-2)}
body.merchants .mc-btn-outline-light:hover{background:var(--mc-on-dark);color:var(--mc-ink);border-color:var(--mc-on-dark)}

/* ---------- responsive ---------- */
@media (max-width:1199.98px){.mc-newrow-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:991.98px){
  .mc-hero2{flex-direction:column;align-items:flex-start;justify-content:flex-end;min-height:0;padding-top:0}
  .mc-hero2-photo{position:relative;order:-1;right:auto;bottom:auto;width:calc(100% + var(--mc-gutter) * 2);margin:0 calc(var(--mc-gutter) * -1) 8px}
  .mc-hero2-copy{max-width:100%}
  .mc-hero2-text{max-width:min(22em,100%)}
  .mc-hero2-side{display:none}
  .mc-tex-tile{flex-basis:min(78vw,460px)}
  .mc-tex-tile.has-tex{flex-basis:min(84vw,540px)}
  .mc-banner2{justify-content:flex-start;align-items:flex-end;min-height:480px}
  .mc-banner2::before{background:linear-gradient(0deg,rgba(60,48,43,.92) 0,rgba(60,48,43,.35) 60%,rgba(60,48,43,0) 100%)}
}
@media (max-width:575.98px){.mc-newrow-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-tex-copy{max-width:60%}.mc-tex-tile.has-tex .mc-tex-copy{max-width:48%}}
@media (prefers-reduced-motion:reduce){.mc-tex-tile,.mc-tex-bg,.mc-tex-prod,.mc-tex-img{transition:none}}

/* ---------- landing motion (js/mc-motion.js): hidden start states exist only while html.mc-motion is set ---------- */
.mc-motion .mc-hero2-title,.mc-motion .mc-hero2-photo,.mc-motion .mc-hero2-text,.mc-motion .mc-hero2 .mc-btn,.mc-motion .mc-hero2-side,
.mc-motion .mc-sec-head>*,.mc-motion .mc-tex-tile,.mc-motion .mc-newrow .mc-card,.mc-motion .mc-banner2-copy>*{opacity:0}
.mc-motion .mc-hero2-photo,.mc-motion .mc-hero2-photo img,.mc-motion .mc-banner2-photo img{will-change:transform}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}