/* XIBULUN 6.2.18 — mobile experience. Desktop editorial layout remains unchanged. */
:root{--xbl-tap:44px}
.mobile-toggle:focus-visible,.xbl-mobile-language:focus-visible,.xbl-menu a:focus-visible,.xbl-menu button:focus-visible,
.gallery-thumbs button:focus-visible,.product-card:focus-visible{outline:2px solid #151515;outline-offset:3px}
@media (max-width:760px){
  html{scroll-padding-top:73px}
  body{overflow-x:clip}
  body.xbl-menu-open{overflow:hidden;touch-action:pan-x}
  .site-header{height:68px!important;grid-template-columns:minmax(0,1fr) auto!important;gap:6px;padding:0 17px!important;z-index:1100}
  .site-header .brand{height:62px;width:74px;min-width:0}
  .site-header .brand img{max-width:67px;max-height:57px;object-fit:contain}
  .site-header .desktop-nav,.site-header .header-actions{display:none!important}
  .xbl-header-mobile-actions{display:flex;align-items:center;gap:4px;justify-self:end;align-self:center}
  .xbl-mobile-language{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:44px;border:0;background:transparent;color:#222;font-size:11px;letter-spacing:.03em;cursor:pointer}
  .site-header .mobile-toggle{display:flex!important;align-items:center;justify-content:center;position:static;min-width:48px;min-height:48px;font-family:var(--sans);font-size:23px;line-height:1;padding:0;border:0;background:transparent;cursor:pointer}
  .mobile-panel.xbl-menu{display:none;position:fixed;inset:68px 0 0;z-index:1099;max-width:none;max-height:calc(100dvh - 68px);overflow-y:auto;overscroll-behavior:contain;padding:0!important;background:#f4f1ec;box-shadow:0 20px 32px rgba(0,0,0,.08);-webkit-overflow-scrolling:touch}
  .mobile-panel.xbl-menu.open{display:block}
  .xbl-menu-inner{max-width:670px;margin:auto;padding:20px 21px max(32px,env(safe-area-inset-bottom))}
  .xbl-menu-kicker{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#787167;margin:9px 0 8px}
  .mobile-panel.xbl-menu a{display:flex;justify-content:space-between;align-items:center;min-height:49px;padding:9px 0;border-bottom:1px solid rgba(21,21,21,.12);font-size:clamp(21px,5.9vw,27px);line-height:1.25;letter-spacing:-.015em;font-family:var(--serif);color:#161616;overflow-wrap:anywhere}
  .mobile-panel.xbl-menu .xbl-subnav{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;margin-bottom:14px}
  .mobile-panel.xbl-menu .xbl-subnav a{font-family:var(--sans);font-size:13px;min-height:48px;line-height:1.35;letter-spacing:0}
  .xbl-arrow{font-family:var(--sans);font-size:14px;color:#777168;flex:none;padding-left:12px}
  .mobile-panel.xbl-menu .xbl-language-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:16px;margin-bottom:20px}
  .mobile-panel.xbl-menu .xbl-language-list a{display:flex;justify-content:center;text-align:center;min-height:45px;padding:10px 2px;border:1px solid rgba(21,21,21,.2);font-family:var(--sans);font-size:12px;letter-spacing:0}
  .mobile-panel.xbl-menu .xbl-language-list a[aria-current="page"]{background:#24211f;color:#f6f2ec}
  .mobile-panel.xbl-menu a.xbl-primary-action{display:flex;align-items:center;justify-content:space-between;min-height:54px;padding:12px 16px;font-family:var(--sans);font-size:13px;letter-spacing:.01em;background:#252220;color:#f5f1eb;border:0}
  .mobile-panel.xbl-menu .xbl-menu-footnote{font-size:10px;color:#8b847a;letter-spacing:.13em;margin-top:22px}
  /* Do not allow giant desktop type to escape a 320–430px viewport. */
  h1,h2,h3,.display,.statement,.intro-copy,.product-info,.hero-copy,.section-head{max-width:100%;overflow-wrap:break-word}
  h1{letter-spacing:-.032em!important;line-height:1.04!important}
  .hero h1,.intro-copy h1,.product-info h1,.page-head h1,.privacy-hero h1,.cm11-hero-copy h1{font-size:clamp(36px,10.1vw,48px)!important;letter-spacing:-.042em!important;line-height:1.03!important}
  .section-head .display,.statement,.cta h2,.custom-copy h2,.manufacturing-copy h2,.contact h2{font-size:clamp(33px,9vw,43px)!important;line-height:1.07!important}
  p{overflow-wrap:break-word}
  .xbl-home .hero{height:calc(100svh - 68px)!important;min-height:570px!important;max-height:840px!important}
  .xbl-home .hero > img{position:absolute;inset:0;width:100%;height:100%!important;object-fit:cover;object-position:center 50%}
  .xbl-home .hero::after{z-index:1}
  .xbl-home .hero-copy{z-index:3}
  .hero-copy{max-width:calc(100vw - 42px)!important}
  /* Always expose the first product without excessive whitespace. */
  .page-intro{padding:39px 18px 24px!important}
  .page-head{padding:44px 18px 34px!important}
  .crumb,.breadcrumb{line-height:1.6;font-size:10px;overflow-wrap:anywhere}
  .collection{padding:8px 18px 60px!important}
  .product-grid{display:grid!important;grid-template-columns:1fr!important;gap:26px!important}
  .card,.card.wide,.card.std,.card.portrait,.card.project,.card.compact{width:100%;min-width:0;max-width:100%;grid-column:auto!important}
  .card .visual{width:100%;max-width:100%;overflow:hidden}
  .card .visual img,.gallery-main img{object-fit:contain}
  .product-grid .card{opacity:1!important;transform:none!important}
  .page-intro .intro-side{max-width:100%;font-size:13px;line-height:1.55}
  /* Product detail: image leads, text stays legible and thumbnails work with touch. */
  .product-hero{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:24px!important;padding:8px 18px 54px!important}
  .product-hero > *,.product-info,.gallery,.gallery-main{min-width:0;max-width:100%}
  .gallery-main{overflow:hidden}
  .gallery-main img{max-width:100%;height:auto}
  .gallery-thumbs{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding:8px 1px 10px}
  .gallery-thumbs button{flex:0 0 auto;min-width:60px;min-height:65px;cursor:pointer}
  .product-info h1{margin-top:12px}
  .details,.related{padding:60px 18px!important}
  .detail-row{grid-template-columns:minmax(0,1fr)!important}
  .related-grid{grid-template-columns:minmax(0,1fr)!important}
  .inquiry-sheet{padding:42px 18px!important}
  /* Homepage: editorial rhythm with swipeable type cards. */
  .section{padding:60px 18px!important}
  .section-head{align-items:flex-end;gap:10px}
  .rail{margin-right:-18px!important;padding-right:18px!important;gap:13px!important;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .product-card{flex:0 0 min(81vw,350px)!important;scroll-snap-align:start}
  .product-visual{aspect-ratio:4/3!important}
  .product-name{font-size:21px!important}
  .work-section{padding:64px 18px 72px!important}
  .work-rail{margin-right:-18px!important;padding-right:18px!important;scroll-snap-type:x mandatory}
  .work-card.landscape{width:min(81vw,350px)!important}
  .work-card.portrait{width:min(69vw,310px)!important}
  .custom-copy,.manufacturing,.contact,.identity,.cta{padding-left:18px!important;padding-right:18px!important}
  /* Larger translated CTAs, grids and article layouts should stack naturally. */
  .hero-grid,.intro-grid,.identity-grid,.evidence-layout,.contact-grid,.cta-grid,.start-grid,.custom-grid,.manufacturing-grid,.cm11-hero,.cm11-start,.cm11-process-head,.cm11-workshop,.cm11-close-inner,.privacy-body article{grid-template-columns:minmax(0,1fr)!important}
  .start-grid,.cta-grid{gap:24px!important}
  .privacy-page{padding:76px 18px 70px!important}
  .privacy-hero{padding-bottom:35px!important}
  .privacy-body{max-width:100%;overflow-wrap:anywhere}
  .privacy-body article{gap:13px!important}
  .privacy-body p{font-size:13px!important;line-height:1.8!important}
  .privacy-body h2{font-size:23px!important}
  /* Legible touch targets, accessible controls, no misleading disabled submit behaviour. */
  input:not([type="checkbox"]):not([type="radio"]),textarea,select{max-width:100%;font-size:16px!important}
  .upload{position:relative}
  .upload input[type="file"]{position:absolute!important;left:0!important;top:0!important;width:1px!important;height:1px!important;min-width:0!important;max-width:1px!important;opacity:0!important}
  button,a,select{touch-action:manipulation}
  .footer{padding:24px 18px!important;gap:12px;line-height:1.7}
  .reveal,.stagger>*{opacity:1!important;transform:none!important}
  .stagger.in>*{transition:none!important}
}
@media(max-width:375px){
 .site-header{padding:0 14px!important}
 .xbl-menu-inner{padding-left:16px;padding-right:16px}
 .mobile-panel.xbl-menu .xbl-subnav{column-gap:12px}
 .mobile-panel.xbl-menu .xbl-subnav a{font-size:12px}
 .hero h1,.intro-copy h1,.product-info h1,.page-head h1{font-size:clamp(33px,10vw,42px)!important}
}
@media(min-width:761px) and (max-width:1050px){
 .site-header{padding-left:18px;padding-right:18px}
 .desktop-nav{gap:14px;font-size:11px}
 h1,h2,.display{overflow-wrap:break-word}
}
@media(prefers-reduced-motion:reduce){.mobile-panel.xbl-menu{scroll-behavior:auto}}

/* XIBULUN 6.2.19 — uncropped photography for narrow viewports.
   Complete fixtures come first; no forced portrait crop of the horizontal chandelier. */
@media(max-width:760px){
  /* The original 1900×1266 hero is a horizontal product photograph. Do NOT use cover
     in the tall phone-sized hero: it discards most of the luminaire arms. */
  body.xbl-home .hero{
    display:flex!important;flex-direction:column!important;
    width:100%;height:auto!important;min-height:0!important;max-height:none!important;
    overflow:visible!important;background:#f4f1ec!important
  }
  body.xbl-home .hero > img{
    display:block!important;position:relative!important;inset:auto!important;
    flex:0 0 auto;width:100%!important;height:auto!important;
    max-width:100%;max-height:none!important;aspect-ratio:auto!important;
    object-fit:contain!important;object-position:center!important;
    filter:saturate(.9) contrast(1.025) brightness(.99)
  }
  body.xbl-home .hero::after{display:none!important;content:none!important}
  body.xbl-home .hero-copy{
    order:2;position:relative!important;inset:auto!important;left:auto!important;
    right:auto!important;bottom:auto!important;max-width:none!important;
    width:100%;padding:29px 22px 19px!important;margin:0!important;
    color:#211d1b!important;background:#f4f1ec!important
  }
  body.xbl-home .hero-copy .eyebrow{opacity:1;color:#817a70!important;margin-bottom:12px!important}
  body.xbl-home .hero-copy h1{color:#211d1b!important}
  body.xbl-home .hero-copy .hero-sub{color:#656057!important;margin-top:14px!important;line-height:1.6}
  body.xbl-home .hero-copy .text-link{color:#211d1b!important;margin-top:18px!important;min-height:30px}
  body.xbl-home .hero-index{
    order:3;position:relative!important;inset:auto!important;right:auto!important;
    bottom:auto!important;color:#8a8177!important;padding:4px 22px 27px!important;
    font-size:9px!important;letter-spacing:.13em
  }
  /* Project and factory images represent real manufactured shapes: expose the full
     source image instead of cropping it into a forced portrait/card ratio. */
  .project-image,.project.hero .project-image,.archive-grid .project-image,
  .archive-grid .project:nth-child(2) .project-image,
  .intro-visual,.manufacturing-media,.evidence-item .frame,
  .evidence-item.large .frame,.evidence-item.tall .frame,.evidence-item.small .frame,
  .site-image .frame{
    height:auto!important;min-height:0!important;max-height:none!important;
    aspect-ratio:auto!important;overflow:hidden
  }
  .project-image img,.intro-visual img,.manufacturing-media img,.frame img,
  .site-image img{
    display:block!important;position:static!important;width:100%!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important
  }
  .evidence-item.small .frame{margin-top:0!important}
  /* Product thumb sizes remain uniform but show the whole lamp, never a cropped part. */
  .gallery-thumbs .thumb img{object-fit:contain!important}
}


/* XIBULUN 6.2.20 — restore desktop-style scroll reveal on phones.
   The shared script enables this only after verifying IntersectionObserver support.
   Hidden content is NEVER used for reduced-motion users or without JavaScript. */
@media (max-width:760px) and (prefers-reduced-motion:no-preference){
  html.xbl-motion-ready .reveal:not(.in){
    opacity:0!important;transform:translate3d(0,24px,0)!important;
  }
  html.xbl-motion-ready .reveal.in{
    opacity:1!important;transform:none!important;
    transition:opacity .72s ease,transform .72s cubic-bezier(.16,1,.3,1)!important;
  }
  html.xbl-motion-ready .stagger:not(.in)>*{
    opacity:0!important;transform:translate3d(0,20px,0)!important;
  }
  html.xbl-motion-ready .stagger.in>*{
    opacity:1!important;transform:none!important;
    transition:opacity .65s ease,transform .65s cubic-bezier(.16,1,.3,1)!important;
  }
  html.xbl-motion-ready .stagger.in>*:nth-child(2){transition-delay:.07s!important}
  html.xbl-motion-ready .stagger.in>*:nth-child(3){transition-delay:.14s!important}
  /* Each card enters when the customer actually scrolls to it, rather than hiding
     the entire long catalogue while the first row is on screen. */
  html.xbl-motion-ready .product-grid .card{
    transition:opacity .68s ease,transform .68s cubic-bezier(.16,1,.3,1)!important;
    transition-delay:0s!important;
  }
  html.xbl-motion-ready .product-grid .card:not(.xbl-card-visible){
    opacity:0!important;transform:translate3d(0,22px,0)!important;
  }
  html.xbl-motion-ready .product-grid .card.xbl-card-visible{
    opacity:1!important;transform:none!important;
  }
  html.xbl-motion-ready .image-reveal:not(.in){
    clip-path:inset(3% 0 3% 0)!important;
    transform:scale(1.015)!important;
  }
  html.xbl-motion-ready .image-reveal.in{
    clip-path:inset(0)!important;transform:none!important;
    transition:clip-path .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)!important;
  }
}