/* LAVI v1.41 — exhibition-day responsive/UI/UX stabilization */

/* Global stability */
.site-header{
  background:rgba(255,255,255,.985)!important;
  border-bottom:1px solid #e7e1d8!important;
  backdrop-filter:blur(14px);
}
main[id="main"], #main{overflow:clip}
.page-hero,.section,[id]{scroll-margin-top:90px}
img{height:auto}

/* Hero: preserve poster, simplify hierarchy */
.hero-slider .hero-visual.has-media{background:#f4f0e8!important}
.hero-slider .hero-visual.has-media img{object-fit:contain!important;object-position:center!important}
.hero-controls{z-index:20!important}
.hero-copy h1{max-width:13ch}

/* Product cards: clean badges and image hierarchy */
.product-card{height:100%;display:flex;flex-direction:column}
.product-card .product-info{display:flex;flex:1;flex-direction:column}
.product-card .product-info>.text-link,
.product-card .product-info>a.text-link{margin-top:auto;align-self:flex-start}
.product-visual.has-image img{width:100%;height:100%;object-fit:contain;background:#f7f4ee}
.product-visual>span,
.product-visual.has-image>span{
  top:14px!important;
  inset-inline-end:14px!important;
  inset-inline-start:auto!important;
  max-width:45%!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#5d5550!important;
  font-size:10px!important;
  font-weight:600!important;
  letter-spacing:.08em!important;
  text-shadow:0 1px 5px rgba(255,255,255,.95)!important;
}
.product-warranty-badge{top:12px!important;inset-inline-start:12px!important;inset-inline-end:auto!important;font-size:9px!important;padding:5px 8px!important}

/* CTA / helper sections */
.split-callout{align-items:center}
.split-callout h2{max-width:900px}

/* Configurator visual refinement */
.wardrobe-plan .config-panel.active{
  box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px #701d20!important;
}
.wardrobe-plan-wrap{overflow:hidden}
.door-color{min-height:100%;touch-action:manipulation}
.text-tool,.button,.tabs a,.category-card,.product-card a{touch-action:manipulation}

/* Tablet: use the reliable mobile header instead of squeezed desktop navigation */
@media (min-width:701px) and (max-width:980px){
  body:has(.mobile-nav-state:checked){overflow:hidden}
  .site-header{min-height:68px}
  .site-header .container.header-row{
    width:calc(100% - 24px)!important;
    height:68px!important;
    min-height:68px!important;
    display:grid!important;
    grid-template-columns:46px minmax(0,1fr) 104px!important;
    grid-template-areas:"menu actions brand"!important;
    align-items:center!important;
    gap:8px!important;
    padding:0!important;
    direction:ltr!important;
  }
  .brand{grid-area:brand!important;margin:0!important;justify-self:end!important;z-index:106!important}
  .brand img{width:100px!important;max-height:31px!important;object-fit:contain!important}
  .mobile-nav-state{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
  .nav-toggle{
    grid-area:menu!important;display:grid!important;width:44px!important;height:44px!important;place-content:center!important;
    margin:0!important;padding:6px!important;border:1px solid #d8d3c9!important;background:#fff!important;
    position:relative!important;z-index:106!important;cursor:pointer!important
  }
  .nav-toggle span{display:block!important;width:24px!important;height:1.5px!important;margin:3px 0!important;background:#111!important}
  .nav-toggle b{display:none!important}
  .header-actions{
    grid-area:actions!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;
    flex-direction:row!important;gap:6px!important;min-width:0!important;position:relative!important;z-index:106!important;direction:ltr!important
  }
  .header-actions .theme-toggle,.header-actions .language-switcher{display:none!important}
  .header-actions .header-cta{display:inline-flex!important;order:1!important;min-height:38px!important;height:38px!important;padding:0 10px!important;font-size:9px!important;white-space:nowrap!important}
  .header-actions .header-call{order:2!important}.header-actions .header-catalog{order:3!important}
  .header-actions .header-call,.header-actions .header-catalog{display:grid!important;place-items:center!important;width:38px!important;height:38px!important;min-width:38px!important;padding:0!important;border-radius:50%!important}
  .header-actions .header-catalog span{display:none!important}
  .main-nav{
    position:fixed!important;inset:68px 0 0!important;z-index:105!important;display:none!important;flex-direction:column!important;
    align-items:stretch!important;gap:0!important;width:100%!important;padding:14px 24px 30px!important;overflow-y:auto!important;
    background:rgba(255,255,255,.995)!important;border-top:1px solid #e5dfd5!important;box-shadow:0 24px 60px rgba(0,0,0,.08)!important
  }
  .mobile-nav-state:checked ~ .main-nav,.main-nav.open{display:flex!important}
  .mobile-nav-backdrop{position:fixed!important;inset:68px 0 0!important;z-index:104!important;background:rgba(0,0,0,.22)!important}
  .mobile-nav-state:checked ~ .mobile-nav-backdrop{display:block!important}
  .mobile-menu-head{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:2px 0 12px!important;border-bottom:1px solid #e2ddd4!important}
  .main-nav>a{width:100%!important;padding:12px 2px!important;border-bottom:1px solid #eee9e1!important;font-size:14px!important}
  .main-nav>a:after{display:none!important}
  .mobile-menu-settings{display:grid!important;gap:17px!important;margin-top:20px!important;padding-top:18px!important;border-top:1px solid #d9d3ca!important}
}

/* Mobile and tablet content layout */
@media (max-width:900px){
  .container{width:min(100% - 24px,1180px)!important}

  /* Home hero: one clean column; poster first, copy second */
  .hero-slider,.hero-slide{min-height:0!important}
  .hero-slide{padding:22px 0 58px!important}
  .hero-slide .hero-grid{display:flex!important;flex-direction:column!important;gap:18px!important;align-items:stretch!important}
  .hero-visual{order:1!important;width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:4/5!important;padding:8px!important}
  .hero-copy{order:2!important;width:100%!important}
  .hero-copy h1{max-width:none!important;font-size:25px!important;line-height:1.5!important;margin:0 0 10px!important;letter-spacing:-.01em!important}
  .hero-copy>p{font-size:14px!important;line-height:1.95!important;margin:0!important}
  .hero-actions{margin-top:14px!important;gap:8px!important}
  .hero-actions .button{width:auto!important;min-height:44px!important;padding:0 16px!important;font-size:12px!important}
  .hero-meta{margin-top:14px!important;font-size:11px!important;gap:7px!important;line-height:1.8!important}
  .hero-controls{bottom:12px!important}

  /* Features become readable rows */
  .feature-row{grid-template-columns:1fr!important}
  .feature-row article{border-left:0!important;border-bottom:1px solid #ddd!important;padding:20px 18px!important}
  .feature-row article:last-child{border-bottom:0!important}

  /* Product families and product listings */
  .category-grid,.category-grid-dynamic,.products-grid,.listing-grid{grid-template-columns:1fr!important}
  .category-card{grid-template-rows:auto auto!important}
  .category-visual{min-height:300px!important}
  .category-card>div:last-child{padding:22px!important}
  .products-grid{gap:18px!important}
  .product-visual{height:auto!important;aspect-ratio:1/1!important}
  .product-info{padding:20px!important}
  .product-info>div{display:block!important}
  .product-info h2,.product-info h3{font-size:22px!important;line-height:1.55!important}
  .product-info p{font-size:14px!important;line-height:1.9!important}

  /* Page hero and tabs */
  .page-hero,.page-hero.compact{padding:48px 0 34px!important}
  .page-hero h1{font-size:34px!important;line-height:1.45!important}
  .page-hero p{font-size:15px!important;line-height:1.9!important}
  .tabs{margin-bottom:24px!important;flex-wrap:wrap!important}
  .tabs a{min-height:44px!important;padding:10px 16px!important}

  /* Contact page: no squeezed columns */
  .contact-grid{grid-template-columns:1fr!important;gap:18px!important}
  .inquiry-form{order:1!important;padding:22px!important}
  .contact-panel{order:2!important;padding:26px 22px!important}
  .form-head{align-items:flex-start!important;gap:12px!important}
  .form-head span{font-size:22px!important;line-height:1.5!important}
  .form-row{grid-template-columns:1fr!important;gap:0!important}
  .inquiry-form .button{width:100%!important}

  /* CTA sections */
  .split-callout{flex-direction:column!important;align-items:stretch!important;gap:20px!important}
  .split-callout h2{font-size:28px!important;line-height:1.6!important}
  .split-callout .button{width:100%!important}

  /* Configurator */
  .door-configurator-section{padding:46px 0!important}
  .configurator-heading{margin-bottom:22px!important}
  .configurator-step,.configurator-preview-card,.configurator-palette-card,.configuration-result{padding:16px!important}
  .wardrobe-plan-wrap{padding:8px 22px 42px 4px!important}
  .active-panel-status{grid-template-columns:1fr!important;gap:3px!important}
  .plan-tools{gap:10px!important}
  .door-color-palette{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media (max-width:420px){
  .hero-copy h1{font-size:23px!important}
  .page-hero h1{font-size:30px!important}
  .door-color-palette{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .header-actions .header-cta{max-width:98px!important}
}
