/* =====================================================================
   YELLOW BELL — reference-style layer (big type, blur showcase, lookbook strip, glass CTA)
   Uses the existing brand colours and fonts.
   ===================================================================== */
/* ---- hero: oversized two-tone headline ---- */
.yb-hero-big{font-size:clamp(52px,7.6vw,118px)!important;line-height:.92!important;letter-spacing:-.02em;font-weight:600!important;display:flex;flex-direction:column}.yb-hero-big .l1{color:var(--g1,#234a2e)}.yb-hero-big .l1 em{color:var(--y1,#e8a713);font-style:italic}.yb-hero-big .l2{color:rgba(35,74,46,.38)}.yb-drop{display:inline-flex;align-items:center;gap:8px}.yb-drop i{width:7px;height:7px;border-radius:50%;background:var(--y1,#e8a713);box-shadow:0 0 0 0 rgba(232,167,19,.5);animation:ybLive 2.2s ease-out infinite}.yb-drop span{color:var(--y1,#e8a713)}.yb-hero-grid{grid-template-columns:1.1fr .9fr!important}@media(max-width:860px){.yb-hero-grid{grid-template-columns:1fr!important}.yb-hero-big{font-size:clamp(46px,14vw,72px)!important}}.yb-hero-media{border-radius:22px!important}.yb-hero-glass{position:absolute;left:14px;bottom:14px;z-index:4;display:flex;gap:10px;pointer-events:none}.yb-hero-glass div{padding:10px 14px;border-radius:14px;background:rgba(255,253,243,.78);border:1px solid rgba(255,255,255,.7);box-shadow:0 10px 26px rgba(40,50,20,.18)}.yb-hero-glass b{display:block;font-size:12px;color:var(--g1,#234a2e)}.yb-hero-glass small{font-size:10.5px;color:#6b6b55}@media(max-width:560px){.yb-hero-glass{left:10px;right:10px;bottom:10px}.yb-hero-glass div{flex:1;padding:8px 10px}.yb-hero-glass small{display:none}}.yb-hero-dots{z-index:4}/* ---- showcase slider: blur cross-fade{padding:clamp(56px,8vw,110px) 0 clamp(20px,4vw,50px)}/* ---- lookbook strip: tall rounded cards, endless drift ---- */
.lb-sec{padding:clamp(40px,6vw,90px) 0}.lb{overflow:hidden;padding:18px 0 34px;margin-top:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}.lb-track{display:flex;gap:16px;width:max-content;animation:lbDrift 60s linear infinite;will-change:transform}.lb:hover .lb-track{animation-play-state:paused}
@keyframes lbDrift{to{transform:translate3d(-50%,0,0)}}.lb-card{flex:0 0 auto;width:clamp(150px,19vw,260px);aspect-ratio:2/3;border-radius:22px;overflow:hidden;background:#f2f0d4;box-shadow:0 18px 40px rgba(50,60,20,.16);transition:transform .6s cubic-bezier(.22,1,.36,1),box-shadow .6s}.lb-card:nth-child(even){transform:translateY(22px)}.lb-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.22,1,.36,1)}@media(hover:hover){.lb-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 26px 56px rgba(50,60,20,.26)}.lb-card:nth-child(even):hover{transform:translateY(14px) scale(1.02)}.lb-card:hover img{transform:scale(1.06)}}/* ---- hero CTA row (circle-arrow pill + "watch lookbook") ---- */
.yb-hero-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.yb-hero-btn>span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--g1,#234a2e);color:#fff;margin-left:12px;font-size:14px;transition:transform .4s cubic-bezier(.22,1,.36,1)}@media(hover:hover){.yb-hero-btn:hover>span{transform:translateX(3px) rotate(-45deg)}}.yb-watch{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--g1,#234a2e);text-decoration:none}.yb-watch i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font-style:normal;font-size:10px;padding-left:2px;background:rgba(255,253,243,.85);border:1px solid rgba(35,74,46,.25);box-shadow:0 8px 18px rgba(40,50,20,.12);transition:.35s}@media(hover:hover){.yb-watch:hover i{background:var(--g1,#234a2e);color:#fff}}/* hero dots sit at the top so they never cover the glass cards */
.yb-hero-dots{top:16px!important;bottom:auto!important;left:50%!important;right:auto!important;transform:translateX(-50%)}/* =================== 3D HERO STAGE =================== */
@property --tint{syntax:'<color>';inherits:true;initial-value:#f6d98a}
@property --deep{syntax:'<color>';inherits:true;initial-value:#3b3a20}.yb-stage{position:relative;height:clamp(440px,50vw,660px);isolation:isolate;touch-action:pan-y;outline:none;animation:rise 1s var(--ease-lux,ease) .15s both}.yb-stage-blob{position:absolute;left:50%;top:52%;width:min(86%,560px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:-3;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.85),var(--tint) 58%,color-mix(in srgb,var(--tint) 70%,#fff) 100%);box-shadow:0 40px 90px rgba(120,110,30,.18),inset 0 0 0 1px rgba(255,255,255,.6)}.yb-stage-ring{position:absolute;left:50%;top:52%;width:min(100%,650px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1.5px dashed rgba(35,74,46,.28);z-index:-2;animation:ybSpin 60s linear infinite}
@keyframes ybSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}.yb-stage-canvas,.yb-stage-fallback{position:absolute;left:0;top:0;width:100%;height:100%;transition:opacity .45s ease}.yb-stage-canvas{opacity:0;display:block}.yb-stage-fallback{object-fit:contain;object-position:50% 100%;padding:2% 0;will-change:transform;transition:opacity .35s ease,transform .3s ease}.yb-stage-floor{position:absolute;left:50%;bottom:1.5%;width:46%;height:5%;transform:translateX(-50%);z-index:-1;border-radius:50%;background:radial-gradient(ellipse at center,rgba(35,50,20,.34),transparent 70%);filter:blur(6px)}.yb-stage-card{position:absolute;z-index:3;min-width:150px;padding:12px 16px;border-radius:16px;background:rgba(255,253,243,.62);border:1px solid rgba(255,255,255,.8);box-shadow:0 14px 34px rgba(60,70,30,.16),inset 0 1px rgba(255,255,255,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:ybFloat 6s ease-in-out infinite}.yb-stage-card b{display:block;font-size:13px;color:var(--g1,#234a2e)}.yb-stage-card small{font-size:11px;color:var(--color-stone,#6b6a55)}.yb-stage-card.c1{left:0;bottom:16%}.yb-stage-card.c2{right:0;top:12%;animation-delay:-3s}
@keyframes ybFloat{50%{transform:translateY(-9px)}}.yb-stage-ui{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);display:flex;align-items:center;gap:14px;z-index:4}.yb-stage-btn{width:42px;height:42px;border-radius:50%;border:1px solid rgba(35,74,46,.25);background:rgba(255,253,243,.9);color:var(--g1,#234a2e);font-size:22px;line-height:1;cursor:pointer;box-shadow:0 8px 20px rgba(40,50,20,.14);transition:transform .3s,background .3s,color .3s}@media(hover:hover){.yb-stage-btn:hover{background:var(--g1,#234a2e);color:#fff;transform:scale(1.07)}}.yb-stage-btn:active{transform:scale(.94)}.yb-stage-count{font-size:12px;letter-spacing:.14em;color:var(--color-stone,#6b6a55);min-width:56px;text-align:center}.yb-stage-count b{color:var(--g1,#234a2e);font-size:15px}.yb-stage-dots{position:absolute;top:2px;left:50%;transform:translateX(-50%);display:flex;gap:7px;z-index:4}.yb-stage-dots button{width:8px;height:8px;border-radius:99px;border:0;padding:0;background:rgba(35,74,46,.25);cursor:pointer;transition:width .4s cubic-bezier(.22,1,.36,1),background .3s}.yb-stage-dots button.on{width:26px;background:var(--y1,#e8a713)}@media(max-width:860px){.yb-stage{order:-1;height:min(118vw,520px);margin-bottom:26px}.yb-stage-card{min-width:0;padding:9px 12px}.yb-stage-card small{display:none}.yb-stage-card.c1{bottom:22%}.yb-stage-card.c2{top:14%}}.yb-stage-btn{display:grid;place-items:center;padding:0 0 3px}/* ================= Lookbook — 3D fan carousel ================= */
.fan{position:relative;height:clamp(340px,44vw,560px);margin-top:8px;perspective:1300px;perspective-origin:50% 45%;overflow:hidden;touch-action:pan-y;cursor:grab;outline:none;user-select:none;-webkit-user-select:none}.fan:active{cursor:grabbing}.fan-card{position:absolute;left:50%;top:50%;width:clamp(170px,21vw,300px);aspect-ratio:2/3;margin:calc(clamp(170px,21vw,300px)*-.75) 0 0 calc(clamp(170px,21vw,300px)/-2);border-radius:24px;overflow:hidden;background:#f2f0d4;box-shadow:0 26px 50px rgba(50,60,20,.28);will-change:transform;backface-visibility:hidden;transform-style:preserve-3d}.fan-card img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.fan-card:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),inset 0 -60px 60px -40px rgba(255,255,255,.25)}.fan-dots{display:flex;justify-content:center;gap:8px;margin-top:6px}.fan-dots i{width:7px;height:7px;border-radius:99px;background:rgba(35,74,46,.2);cursor:pointer;transition:width .4s cubic-bezier(.22,1,.36,1),background .3s}.fan-dots i.on{width:26px;background:var(--y1,#e8a713)}/* ================= Footer — giant wordmark ================= */
.yb-wave-footer{position:relative;overflow:hidden}/* nothing may create sideways scrolling (rotating ring, glow, butterflies) */
html,body{overflow-x:clip}.yb-hero,.yb-stage{overflow-x:clip}.fan-card img,.yb-stage img{content-visibility:visible}/* =====================================================================
   HERO — colours follow the dress, small glass controls, swipe-friendly
   ===================================================================== */
.yb-hero{--tint:#f6d98a;--deep:#3b3a20;position:relative;isolation:isolate;transition:--tint .9s ease,--deep .9s ease}.yb-hero:before{content:"";position:absolute;inset:0 0 -70px;z-index:-1;pointer-events:none;
  background:
    radial-gradient(880px 640px at 76% 44%,color-mix(in srgb,var(--tint) 62%,transparent),transparent 72%),
    radial-gradient(640px 460px at 6% 6%,color-mix(in srgb,var(--tint) 30%,transparent),transparent 70%);
  -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent);mask-image:linear-gradient(180deg,#000 72%,transparent)}.yb-hero-eyebrow{color:var(--deep)!important}.yb-hero-eyebrow i{background:var(--deep)!important}.yb-hero-big .l1{color:color-mix(in srgb,var(--deep) 72%,#0d1a10)}.yb-hero-big .l1 em{color:color-mix(in srgb,var(--deep) 70%,var(--tint))}.yb-hero-big .l2{color:color-mix(in srgb,var(--deep) 36%,transparent)}.yb-hero .yb-hero-btn{background:linear-gradient(135deg,color-mix(in srgb,var(--deep) 78%,#fff),var(--deep))!important;box-shadow:0 12px 28px color-mix(in srgb,var(--deep) 34%,transparent)!important}.yb-hero .yb-watch{color:var(--deep)}.yb-hero .yb-watch i{border-color:color-mix(in srgb,var(--deep) 30%,transparent)}.yb-stage-ring{border-color:color-mix(in srgb,var(--deep) 30%,transparent)}.yb-stage-blob{box-shadow:0 40px 90px color-mix(in srgb,var(--deep) 24%,transparent),inset 0 0 0 1px rgba(255,255,255,.6)}.yb-stage-card{background:linear-gradient(135deg,rgba(255,255,255,.62),color-mix(in srgb,var(--tint) 30%,rgba(255,255,255,.3)))!important;border:1px solid rgba(255,255,255,.8)!important;-webkit-backdrop-filter:blur(12px) saturate(1.3)!important;backdrop-filter:blur(12px) saturate(1.3)!important}.yb-stage-card b{color:var(--deep)}/* swipe: finger drags the look, page still scrolls vertically */
.yb-stage{touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.yb-stage-canvas,.yb-stage-fallback{-webkit-user-drag:none;pointer-events:none}/* progress line replaces the 25 dots */
.yb-stage-bar{position:absolute;left:50%;top:4px;transform:translateX(-50%);width:min(56%,210px);height:5px;border-radius:99px;overflow:hidden;z-index:4;
  background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.75);box-shadow:inset 0 1px 2px rgba(40,50,20,.12)}.yb-stage-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--deep),color-mix(in srgb,var(--deep) 60%,var(--tint)));transition:transform .65s cubic-bezier(.22,1,.36,1)}/* ---------- small premium glass controls (hero + every carousel) ---------- */
.yb-stage-ui.yb-stage-ui{bottom:2px;gap:2px;padding:3px;border-radius:999px;
  background:linear-gradient(135deg,rgba(255,255,255,.62),rgba(255,255,255,.2));border:1px solid rgba(255,255,255,.78);
  box-shadow:0 10px 24px rgba(40,50,20,.16),inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.5)!important;backdrop-filter:blur(14px) saturate(1.5)!important}.yb-stage-btn.yb-stage-btn,.yx-arrows button,.yb-gallery-arrow.yb-gallery-arrow{
  width:30px!important;height:30px!important;border-radius:50%!important;font-size:17px!important;padding:0 0 2px!important;display:grid;place-items:center;
  color:var(--deep,#234a2e)!important;background:linear-gradient(145deg,rgba(255,255,255,.7),rgba(255,255,255,.22))!important;
  border:1px solid rgba(255,255,255,.85)!important;box-shadow:0 4px 12px rgba(40,50,20,.12),inset 0 1px 0 rgba(255,255,255,.95)!important;
  -webkit-backdrop-filter:blur(10px) saturate(1.4)!important;backdrop-filter:blur(10px) saturate(1.4)!important;transition:transform .3s,background .3s,color .3s!important}@media(hover:hover){.yb-stage-btn.yb-stage-btn:hover,.yx-arrows button:hover,.yb-gallery-arrow.yb-gallery-arrow:hover{background:linear-gradient(145deg,var(--deep,#234a2e),color-mix(in srgb,var(--deep,#234a2e) 70%,#fff))!important;color:#fff!important;transform:scale(1.08)}}.yb-stage-btn:active,.yx-arrows button:active,.yb-gallery-arrow:active{transform:scale(.92)!important}.yb-gallery-arrow.yb-gallery-arrow{top:50%;transform:translateY(-50%)}.yb-gallery-arrow.yb-gallery-arrow:active{transform:translateY(-50%) scale(.92)!important}@media(hover:hover){.yb-gallery-arrow.yb-gallery-arrow:hover{transform:translateY(-50%) scale(1.08)}}.yb-stage-count{min-width:42px!important;font-size:10px!important;letter-spacing:.12em;color:color-mix(in srgb,var(--deep) 75%,transparent)!important}.yb-stage-count b{font-size:12px!important;color:var(--deep)}/* =====================================================================
   PHONE FIXES — same UI, correctly sized: nothing wider than the screen,
   bigger product photos,.yb-gallery-main,.fan,.yb-stage{touch-action:pan-y}.yx-rail,.yb-related-grid,.yx-chips,.yb-thumb-row{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.yb-product-visual,.yb-product-copy,.yb-product-hero>*{min-width:0}.yb-thumb-row{max-width:100%;scroll-snap-type:x proximity;scrollbar-width:none}.yb-thumb-row::-webkit-scrollbar{display:none}.yb-thumb-row .yb-thumb{scroll-snap-align:start;flex:0 0 auto}.fan-card{--fw:clamp(170px,21vw,300px);width:var(--fw);margin:calc(var(--fw)*-.75) 0 0 calc(var(--fw)/-2)}@media(max-width:900px){.yb-product-hero{grid-template-columns:minmax(0,1fr)!important}.yb-product-visual,.yb-product-copy{width:100%;max-width:100%!important}
}@media(max-width:767px){/* lookbook fan: a larger centre card */
  .fan-card{--fw:min(64vw,270px)}.fan{height:calc(min(64vw,270px)*1.5 + 56px)}/* product page: full-width, taller gallery */
  .yb-showcase-stage{width:100%!important;aspect-ratio:4/5!important;padding:8px!important}.yb-thumb-row .yb-thumb{width:62px;height:82px}.yb-product-title{font-size:clamp(36px,11vw,50px)!important;overflow-wrap:anywhere}/* product grids: slightly tighter gutters so every photo is bigger */
  #yx-grid,.yb-related-grid{gap:12px 10px!important}#yx-grid{margin-inline:-6px}.yx-rail{gap:12px}.yx-rail>.yx-card{flex-basis:calc(62% - 6px)}.yx-card-info h3{font-size:13px}.yb-hero-actions{gap:14px}
}