:root{
    --bg:#0e0e0e;
    --fg:#f3f3f3;        /* белее текст */
    --muted:#b6b6b6;     /* серый для ссылок */
    --line:#262626;      /* разделители как на рефе */
    --card:#151515;
    --focus:#ffffff;
    --radius:0.5rem;
	
    --bg-body: #eeeff3;
    --shadow: 0 0 0 1px rgba(0,0,0,.02), 0 8px 24px rgba(0,0,0,.10);
    --shadowx: 0 0 0 1px rgba(0,0,0,.02), 0 6px 8px rgba(0,0,0,.10), 0 16px 56px rgba(0,0,0,.18);
	
	--c-bg:#eeeff3;
	    --c-fg:#1f2328;
	    --c-muted:#4f5662;
	    --c-line:#d7dbe2;
	    --c-card:#ffffff;
	    --c-link:#0f172a;
	    --c-callout:#0b3d2c;
	    --c-callout-bg:#e8f5ef;
	    --radius: .75rem;
		
        --ink:#1f2328;  --focus:#3b82f6; 
        --radius:.5rem; --pad:1rem; --gap:1rem;
	
  }


  @font-face {
    font-family: 'Cereal VF';
    src: url('fonts/w_wght.woff2') format('woff2');
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    unicode-range:
      U+0000-00FF,
      U+2000-206F,
      U+20A0-20CF;
  }

  @font-face {
    font-family: 'Cereal VF';
    src: url('fonts/italics_w_wght.woff2') format('woff2');
    font-style: italic;
    font-weight: 200 900;
    font-display: swap;
    unicode-range:
      U+0000-00FF,
      U+2000-206F,
      U+20A0-20CF;
  }

  @font-face {
    font-family: 'Cereal VF';
    src: url('fonts/cyril_w_wght.woff2') format('woff2');
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    unicode-range: U+0400-04FF;
  }
  
  @font-face{
  	font-display:block;
  	font-family:"icon";
  	font-style:normal;
  	font-weight:400;
  	src:
  		url('fonts/icons/icon.ttf?324ox4') format("truetype"),
  		url('fonts/icons/icon.woff?324ox4') format("woff"),
  		url('fonts/icons/icon.svg?324ox4#icon') format("svg")
  }


html {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	tab-size: 4;
}

*, *::before, *::after {
	box-sizing: inherit;
}

body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd {
	margin: 0;
}

body {
	min-height: 100vh;
	line-height: 1.5;
	margin: 0;
	font-family: 'Cereal VF';
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}
 
body.white {
	padding-top: 50px;
}

img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
}

input, button, textarea, select {
	font: inherit;
	color: inherit;
}

ul[role="list"], ol[role="list"] {
	list-style: none;
	margin: 0;
	padding: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	html:focus-within { scroll-behavior: auto; }
	*, *::before, *::after {
		animation: none !important;
		transition: none !important;
		scroll-behavior: auto !important;
	}
}




main{
  position: relative;
  z-index: 1;
  background: var(--bg-body);
  min-height: 110vh;              /* всегда во весь экран */
  margin-bottom: 100vh;           /* место под футер */
  border-radius: 0 0 2.5rem 2.5rem;
  box-shadow: var(--shadow);
  color: #222;
}

main > div{
  max-width: 80rem;
  margin: 0 auto;
  padding: 3rem 2rem 4rem;
}

main h2{ margin: 0 0 1rem; font-size: 2rem; line-height: 1.2; }
main p{ margin: 0 0 1rem; color:#444; }



.content{
    max-width: 72rem;
    margin: 0 auto;
    padding: 3rem 2rem 4rem;
    font: 400 1rem/1.7 system-ui, -apple-system, "Segoe UI", Roboto, Inter, Arial, sans-serif;
    color:#1f2328;
  }
  .content .breadcrumb{
    font-size:.95rem; margin-bottom:1.5rem; color:#4f5662; display:flex; gap:.5rem; flex-wrap:wrap;
  }
  .content .breadcrumb a{ color:#0f172a; text-decoration:none; }
  .content .breadcrumb span{ color:#4f5662; }

  .content h1{ font-size:2rem; font-weight:700; margin:0 0 .25rem; }
  .content .meta{ font-size:.95rem; color:#4f5662; margin:0 0 2rem; }

  .content section>div{
    background:#fff;
    border:1px solid #d7dbe2;
    border-radius:.75rem;
    box-shadow:0 1.2rem 2.5rem rgba(10,16,20,.04);
    padding:1.5rem 2rem;
    margin-bottom:2rem;
  }

  .content h2{ font-size:1.25rem; font-weight:700; margin:0 0 .75rem; }
  .content p{ margin:.75rem 0; }
  .content ul{ margin:.5rem 0 .75rem 1.25rem; }

  .content a{ color:#0f172a; text-underline-offset:.15em; }
  .content a:hover{ text-decoration:none; }

  .content .callout{
    background:#e8f5ef;
    border-left:.25rem solid #0b3d2c;
    border-radius:.5rem;
    padding:.75rem 1rem;
    font-size:.95rem;
    margin:1rem 0;
    color:#0c2b1e;
  }
  .content .small{ font-size:.95rem; color:#4f5662; }
  .content .closing{ border-top:1px dashed #d7dbe2; margin-top:2rem; padding-top:1rem; }
  @media(max-width:48rem){
    .content{ padding:2rem 1rem 3rem; }
    .content section>div{ padding:1.25rem; }
    .content h1{ font-size:1.6rem; }
  }
  
  
  

  /* адаптив */
  @media (max-width: 48rem){
    .content{ padding: 2rem 1rem 3rem; }
    .content article{ padding: 1.25rem; }
    .content header h1{ font-size: 1.6rem; }
  }
  
  


  footer{
    position:fixed; inset:0;
    background:var(--bg); color:var(--fg);
    z-index:0;
  }

  /* контейнер = вся высота, три зоны как на рефе */
  footer .container{
    min-height:100vh;
    max-width:88rem;
    margin:0 auto;
    padding:4rem 3rem 2.25rem;
    display:grid;
    grid-template-rows: minmax(28vh,auto) auto auto;
    gap:2.25rem;
  }

  /* TOP */
  footer .top{
    display:grid;
    grid-template-columns: 1fr 0.7fr;   /* правый блок чуть уже */
    gap: 15rem;
    align-items:start;
  }

  footer h1{
    margin:0;
	font-size: 2.4rem;
	    line-height: 1.24; font-weight:700;
    letter-spacing:-0.02em;
    max-width:28ch;                 /* укоротили строку */
  }

  /* форма подписки */
  footer form{
    display:flex; gap:0.8rem; align-items:center;
  }
  footer input[type="email"]{
    flex:1 1 24rem;
    min-width:16rem;
    height:2.75rem;
    padding:0 1rem;
    border-radius:var(--radius);
    border:1px solid var(--line);
    background:var(--card);
    color:var(--fg);
    outline:none;
  }
  footer input::placeholder{ color:#9b9b9b; }
  footer button{
    height:2.75rem; padding:0 1.25rem;
    border-radius:var(--radius);
    border:1px solid var(--line);
    background:#fff; color:#111; font-weight:600; cursor:pointer;
  }
  footer button:focus-visible,
  footer input:focus-visible{
    outline:2px solid var(--focus); outline-offset:2px;
  }

  /* соцсети — квадратные, как на рефе */
  footer .social{ display:flex; gap:.75rem; margin-top:.9rem; }
  footer .social a{
    width:2.75rem; height:2.75rem;
    display:inline-flex; align-items:center; justify-content:center;
    border-radius:.6rem;
    background:transparent;
    box-shadow: inset 0 0 0 1px var(--line);
    color:var(--fg); text-decoration:none;
    transition:.2s ease;
  }
  footer .social a:hover{ background:#1a1a1a; }

  /* подпись "Síguenos" как у рефа */
  footer .top p{ margin:.9rem 0 .4rem; color:var(--fg); font-weight:600; }

  /* разделители */
  footer hr{ height:1px; border:0; background:var(--line); margin:0; }

  /* МЕНЮ */
  footer nav{
    display:grid; gap:2.25rem 3rem;
    grid-template-columns: repeat(4, minmax(12rem,1fr));
    align-content:start;
    padding:1.25rem 0;               /* воздух над и под */
  }
  footer nav section h3{
    font-size:1.05rem; font-weight:700; margin:0 0 1rem;
    letter-spacing:-0.01em;
  }
  footer nav a{
    display:block; padding:.2rem 0;
    color:var(--muted); text-decoration:none; font-size:.85rem;
  }
  footer nav a:hover{ color:var(--fg); }

  /* БОТТОМ */
  footer .bottom{
    display:flex; justify-content:space-between; align-items:center;
    gap:1.5rem; color:var(--muted); font-size:.8rem;
    padding-top:1rem;
  }
  footer .bottom .links{ display:flex; flex-wrap:wrap; gap:1.5rem; }
  footer .bottom a{ color:#6b7280; text-decoration:none; }
  footer .bottom a:hover{ color:var(--fg); }

  /* адаптив */
  @media (max-width:64rem){
    footer .container{ padding:3.25rem 2rem 2rem; }
    footer .top{ grid-template-columns:1fr; gap:1.25rem; }
  }
  @media (max-width:48rem){
    footer nav{ grid-template-columns:1fr 1fr; }
  }
  .showmob {display:none!important;}
  @media (max-width:30rem){
    footer .bottom{ flex-direction:column; align-items:flex-start; gap:1rem; }
    footer h1{ font-size:2.1rem; max-width:26ch; }
	.hidemob {display: none!important;}
	.showmob {display: block!important;}
  }
  
  
  
  /* ===== Libro de Reclamaciones (только стили формы) ===== */


    .content h1{ margin-bottom:.5rem; }
    .content h2{ font-size:1.25rem; margin:2rem 0 .75rem; }
    .content hr.soft{ border:0; height:1px; background:var(--line); margin:1.5rem 0; }
    .content .mt-s{ margin-top:.75rem; }

    /* Карточка уже белая из общих стилей; не переопределяем. Инпуты: */
    form label{ display:flex; flex-direction:column; gap:.4rem; font-weight:500; color:var(--ink); }
    form .block{ margin:1rem 0; }
    .req{ color:#ef4444; }

    input, select, textarea{
      font: inherit; color: var(--ink);
      background: #fff;
      border:1px solid #e5e7eb; border-radius: var(--radius);
      padding:.7rem .8rem;
      outline:none;
      box-shadow: 0 1px 0 rgba(0,0,0,.02) inset;
    }
    textarea{ resize: vertical; }

    input::placeholder{ color:#9ca3af; }
    input:focus, select:focus, textarea:focus{
      border-color: var(--focus); box-shadow: 0 0 0 .15rem rgba(59,130,246,.15);
    }
    :is(input,select,textarea)[aria-invalid="true"],
    :is(input,select,textarea):invalid:focus{
      border-color:#ef4444; box-shadow:0 0 0 .15rem rgba(239,68,68,.15);
    }

    /* Радио и чекбоксы */
    fieldset{ border:0; padding:0; margin:0; }
    fieldset.inline{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
    fieldset.inline legend{ font-weight:600; margin-right:.5rem; }
    label.radio{ display:inline-flex; align-items:center; gap:.4rem; font-weight:500; color:var(--ink); }
    label.radio input{ width:1rem; height:1rem; }

    /* Сетка */
    .grid{ display:grid; }
    .gap{ gap: var(--gap); }
    .cols-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
    .cols-2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
    .span-2{ grid-column: span 2; }
    .span-3{ grid-column: 1 / -1; }

    /* Боковая памятка справа в 3-м блоке */
    .note{
      background:#f7fafc; border:1px dashed #e5e7eb; border-radius:.5rem;
      padding:.75rem .9rem; color:#374151; font-size:.95rem;
    }
    .note p{ margin:.25rem 0; }

    /* Списки */
    .bullets{ margin:1rem 0 1.25rem 1.1rem; color:#374151; }
    .bullets li{ margin:.25rem 0; }

    /* Кнопка отправки */
    section button{
      display:inline-flex; align-items:center; justify-content:center;
      padding:.85rem 1.25rem; border-radius:.6rem; border:1px solid transparent;
      background:#3b82f6; color:#fff; font-weight:700; letter-spacing:.02em;
      cursor:pointer; box-shadow: 0 6px 20px rgba(59,130,246,.25);
    }
    section button:hover{ filter: brightness(0.98); }
    section button:focus-visible{ outline:2px solid #fff; outline-offset:2px; box-shadow:0 0 0 .15rem rgba(59,130,246,.35); }

    /* Адаптив */
    @media (max-width:64rem){
      .cols-3{ grid-template-columns: 1fr 1fr; }
    }
    @media (max-width:40rem){
      .cols-3, .cols-2{ grid-template-columns: 1fr; }
      .span-2, .span-3{ grid-column:auto; }
    }
	
	
	
    /* ===== Аккордеон Para usuarios ===== */
    :root{
      --ink2:#111827; --muted2:#6b7280; --line2:#e5e7eb; --bg2:#f3f4f6; --panel2:#fff;
      --accent2:#ef4d2d; --blue2:#3b82f6;
      --radius2:1rem;
    }
    .accordion{ margin: 1.25rem auto 2rem; max-width: 75rem; }
    .accordion details{ background:transparent; border:0; border-radius:var(--radius2); margin:1rem 0; }
    .accordion summary{
      list-style:none; cursor:pointer; user-select:none;
      background:#fff; border:1px solid var(--line2); border-radius:var(--radius2);
      padding:1.25rem 1.5rem; font-weight:700; font-size:1.25rem; display:flex; align-items:center; justify-content:space-between;
      box-shadow:0 1rem 2rem rgba(17,24,39,.04);
    }
    .accordion summary::-webkit-details-marker{ display:none; }
    .accordion summary i{
      width:2rem; height:2rem; border:1px solid #e5e7eb; border-radius:50%; position:relative; flex:0 0 auto;
    }
    .accordion summary i:before,
    .accordion summary i:after{
      content:""; position:absolute; background:#6b7280; left:50%; top:50%; transform:translate(-50%,-50%);
    }
    .accordion summary i:before{ width:1rem; height:.1rem; }
    .accordion summary i:after{ width:.1rem; height:1rem; transition:.2s; }
    .accordion details[open] summary i:after{ height:0; }

    .accordion .panel{
      margin-top:.75rem; background:var(--panel2); border:1px solid var(--line2);
      border-radius:var(--radius2); padding:1.25rem 1.25rem 1.5rem;
      box-shadow:0 .5rem 1.25rem rgba(17,24,39,.06);
    }

    /* внутри */
    .muted{ color:var(--muted2); font-size:.95rem; }
    .row{ display:flex; gap:.75rem; margin-top:.5rem; }
    .row input{
      flex:1 1 auto; min-width:12rem; padding:.85rem 1rem; border:1px solid var(--line2); border-radius:999px; outline:none;
      background:#f5f6f8;
    }
    .row button{
      padding:.85rem 1.25rem; border-radius:999px; border:0; background:var(--accent2); color:#fff; font-weight:700; cursor:pointer;
    }

    .grid{ display:grid; }
    .g-2{ gap:1rem; grid-template-columns: 1fr 1fr; margin: 1rem 0; }
    @media (max-width: 56rem){ .g-2{ grid-template-columns: 1fr; } }

    .card{ background:#fff; border:1px solid var(--line2); border-radius:.9rem; padding:1rem 1.25rem; }
    .card h3{ margin:0 0 .75rem; font-size:1.1rem; }

    .steps ol{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin:1rem 0; padding:0; list-style:none; }
    .steps li{ display:flex; gap:.75rem; align-items:flex-start; }
    .steps .num{ width:2.2rem; height:2.2rem; border:2px solid var(--accent2); border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; }
    .steps p{ margin:.15rem 0 0; }
    @media (max-width:56rem){ .steps ol{ grid-template-columns:1fr; } }

    .note{ color:#6b7280; font-size:.95rem; margin-top:.5rem; }

    .term-box{
      border:1px solid #f0b7ab; border-radius:1rem; padding:1rem 1.25rem; min-height:12rem; background:#fff;
    }
    .term-title{ font-weight:800; margin-bottom:.75rem; }
    .term-box ul{ margin:.5rem 0 0 1rem; }

    .bullets{ margin:.5rem 0 0 1rem; }
    .bullets li{ margin:.3rem 0; }

    .h4{ font-weight:800; margin:.25rem 0 .5rem; }
    .city .city-body h4{ margin:.25rem 0 .25rem; }
    .info .h4{ margin-bottom:.25rem; }

    .contact-split{
      margin-top:1rem; display:grid; grid-template-columns:1fr 1fr; gap:1rem; background:#fff; border:1px solid var(--line2); border-radius:.9rem; padding:1rem 1.25rem;
    }
    .contact-split ul{ margin:.25rem 0; }
    @media (max-width:56rem){ .contact-split{ grid-template-columns:1fr; } }
	
	
	
	.hero {
	  position: relative;
	  width: 100%;
	  height: 100vh;
	  overflow: hidden;
	}

	.hero-video {
	  position: absolute;
	  top: 0; left: 0;
	  width: 100%; height: 100%;
	  object-fit: cover;
	  z-index: 0;
	}

	.hero-overlay {
	  position: relative;
	  z-index: 1;
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	  justify-content: flex-end; /* прижать к низу */
	  align-items: flex-start;   /* влево */
	  padding: 0 5% 5%;          /* отступ снизу */
	  color: #fff; 
	}
	
	
	.hero { position:relative; width:100%; height:100vh; overflow:hidden; }
	.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }

	/* затемняющий скрим */
	.hero-scrim{
		/*
	  --scrim: rgba(0,0,0,.35);
	  --grad-top: rgba(0,0,0,.15);
	  --grad-bottom: rgba(0,0,0,.55);*/
	  position:absolute; inset:0; z-index:1;
	  /*
	  background:
	    linear-gradient(to bottom, var(--grad-top), var(--grad-bottom)),
	    var(--scrim);
	  */
	  pointer-events:none;
	}

	/* твой текстовый блок прижат к низу */
	.hero-overlay{
	  position:relative; z-index:2; height:100%;
	  display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start;
	  padding:0 5% 5%;
	  color:#fff; /*max-width:60rem;*/
	}
	
	

	.hero-overlay h1 {
	  font-size: 3rem;
	  font-weight: 700;
	  margin: 0 0 1rem;
	}

	.hero-overlay hr {
	  border: 0;
	  height: 1px;
	  background: rgba(255,255,255,.6);
	  width: 100%;
	  margin: 1rem 0;
	}

	.hero-overlay p {
		color: rgba(255,255,255,.5);
	  margin: 0 0 2rem;
	  font-size: 1.1rem;
	}

	.hero-overlay .btn {
	  display: inline-block;
	  padding: .75rem 1.5rem;
	  background: #fff;
	  color: #000;
	  font-weight: 600;
	  border-radius: .5rem;
	  text-decoration: none;
	}
	.hero-overlay .btn:hover {
	  background: #f5f5f5;
	}
	
	
	
	
	.wa-fab{
	  --wa: #25D366;            /* брендовый зелёный */
	  --wa-dark: #1DA851;       /* ховер/актив */
	  position: fixed;
	  right: max(1rem, env(safe-area-inset-right));
	  bottom: max(1rem, calc(env(safe-area-inset-bottom) + 1rem));
	  z-index: 1000;
	  width: 56px; height: 56px;
	  display: inline-flex; align-items: center; justify-content: center;
	  border-radius: 50%;
	  background: var(--wa);
	  color: #fff;
	  box-shadow:
	    0 2px 8px rgba(0,0,0,.18),
	    0 8px 24px rgba(0,0,0,.12);
	  text-decoration: none;
	  transition: transform .15s ease, box-shadow .2s ease, background-color .15s ease;
	}
	.wa-fab:hover{ background: var(--wa-dark); transform: translateY(-2px);
	  box-shadow: 0 6px 18px rgba(0,0,0,.22), 0 12px 28px rgba(0,0,0,.18);
	}
	.wa-fab:active{ transform: translateY(0); }
	.wa-fab:focus-visible{
	  outline: 2px solid #fff; outline-offset: 3px;
	  box-shadow: 0 0 0 4px rgba(37,211,102,.45);
	}
	.wa-fab svg{ width: 26px; height: 26px; display:block; fill: currentColor; }

	/* лёгкая пульсация-акцент (отключается при reduce-motion) */
	@media (prefers-reduced-motion: no-preference){
	  .wa-fab::after{
	    content:""; position:absolute; inset:0; border-radius:50%;
	    box-shadow: 0 0 0 0 rgba(37,211,102,.45);
	    animation: wa-pulse 2.2s ease-out infinite;
	  }
	}
	@keyframes wa-pulse{
	  0%{ box-shadow: 0 0 0 0 rgba(37,211,102,.45); }
	  70%{ box-shadow: 0 0 0 14px rgba(37,211,102,0); }
	  100%{ box-shadow: 0 0 0 0 rgba(37,211,102,0); }
	}

	/* не мешаем при печати и на очень узких экранах опционально прячем */
	@media print{ .wa-fab{ display:none !important; } }
	@media (max-width: 360px){ .wa-fab{ width:52px; height:52px; } }
	
	
	
	
	:root{ --hdr-h:76px; --ink2:#fff; --ink2-solid2:#0f172a; --accent2:#ef4d2d; }

	.hdr{
	  position:fixed; inset:auto 0 0 0; top:0; height:var(--hdr-h); z-index:1000;
	  color:var(--ink2); background:transparent; transition:background .25s,color .25s, box-shadow .25s;
	}
	.hdr.is-solid, body.white .hdr{ background:#fff; color:var(--ink2-solid2); box-shadow:0 10px 30px rgba(0,0,0,.06); }

	.hdr__inner{
	  height:100%; /*max-width:1200px;*/ margin:0 5%; padding:0 20px;
	  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px;
	}

	/* лого слева, покрупнее */
	.hdr__logo img{ height:42px; display:block; }

	/* навигация по центру слева от действий */
	.hdr__nav{ display:flex; align-items:center; gap:10px; }
	.nav__link,
	.nav__search{
	  display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .9rem; border-radius:999px;
	  background:transparent; border:0; color:inherit; cursor:pointer; font-weight:600;
	}
	.nav__search svg{ width:25px; height:25px; }

	/* мегаменю */
	.nav__item{ position:relative; }
	.mega{
	  position:absolute; left:0; top:calc(100% + .6rem); display:grid; grid-template-columns:2fr 1fr; gap:16px;
	  min-width:680px; max-width:80vw; padding:18px; border-radius:16px;
	  background:#fff; color:#111; box-shadow:0 24px 60px rgba(17,24,39,.14);
	}
	.mega a{ display:block; padding:.4rem .55rem; border-radius:8px; color:#0f172a; text-decoration:none; }
	.mega a:hover{ background:#f5f6f8; }
	.mega .col h4{ margin:.2rem 0 .4rem; font-size:.95rem; font-weight:800; color:#0f172a; }

	/* правая часть: номер + 3 иконки */
	.hdr__actions{ display:flex; align-items:center; gap:12px; }
	.tel{ display:inline-flex; align-items:center; gap:.5rem; color:inherit; text-decoration:none; }
	.tel svg{ width:25px; height:25px; }
	.ico{ width:40px; height:40px; display:grid; place-items:center; color:inherit; text-decoration:none; }
	.ico svg{ width:25px; height:25px; }

	/* hover */
	.nav__link:hover, .nav__search:hover, .tel:hover, .ico:hover{ color:var(--accent2); }

	/* адаптив */
	@media (max-width: 960px){
	  .hdr__inner{ grid-template-columns:auto 1fr auto; gap:10px; }
	  .hdr__nav .nav__link[href*="blog"], .hdr__nav .nav__link[href*="contacto"]{ display:none; }
	  .mega{ min-width:calc(100vw - 32px); left:50%; transform:translateX(-50%); }
	  .tel span{ display:none; }
	}
	
	
	.wa-fab.is-hidden{ opacity:0; pointer-events:none; transform:translateY(8px); }
	.hdr.is-hidden{ opacity:0; transform:translateY(-100%); pointer-events:none; }
	
	[hidden]{ display:none !important; }
	
	
	/* базовые переменные мегаменю */
	:root{
	  --mega-w: clamp(680px, 72vw, 1100px);
	  --mega-pad: 18px;
	  --mega-radius: 16px;
	  --mega-shadow: 0 24px 60px rgba(17,24,39,.14);
	  --mega-line: #e5e7eb;
	  --mega-ink: #0f172a;
	  --mega-muted: #4b5563;
	}

	/* контейнер панели */
	.nav__item--mega{ position:relative; }
	.nav__item--mega .mega[hidden]{ display:none !important; }

	.nav__item--mega .mega{
	  position:absolute;
	  top: calc(100% + .6rem);
	  left: 50%;
	  transform: translateX(-50%);
	  width: var(--mega-w);
	  max-width: 96vw;

	  background:#fff; color:var(--mega-ink);
	  border:1px solid var(--mega-line);
	  border-radius: var(--mega-radius);
	  box-shadow: var(--mega-shadow);

	  padding: var(--mega-pad);
	  z-index: 1002;
	}

	/* сетка: аккуратные «колонки» без рваных высот */
	.mega .mega-list{
	  display:grid;
	  grid-template-columns: repeat(3, minmax(0,1fr));
	  gap: 12px 16px;
	  margin:0; padding:0; list-style:none;
	}
	@media (min-width: 1100px){
	  .mega .mega-list{ grid-template-columns: repeat(4, minmax(0,1fr)); }
	}

	.mega .mega-col{
	  min-width: 0; /* предотвращает разрыв сетки длинными словами */
	}

	.mega .mega-head{
	  display:block;
	  font-weight:800; font-size:.95rem;
	  padding:.45rem .55rem .35rem;
	  border-radius:10px;
	  color:var(--mega-ink);
	  text-decoration:none;
	}
	.mega .mega-head:hover{ background:#f5f6f8; }

	.mega .mega-sub{
	  margin:.25rem 0 0; padding:0; list-style:none;
	}
	.mega .mega-sub a{
	  display:block; padding:.4rem .55rem; border-radius:10px;
	  color:var(--mega-ink); text-decoration:none; font-size:.95rem;
	}
	.mega .mega-sub a:hover{ background:#f5f6f8; }

	/* тонкая разделительная линия внутри колонки (опционально) */
	/* .mega .mega-col{ border-right:1px dashed #f0f2f5; }
	   .mega .mega-col:last-child{ border-right:0; padding-right:0; } */

	/* маленький треугольник-указатель под кнопкой */
	.nav__item--mega .mega::before{
	  content:"";
	  position:absolute; top:-8px; left:50%; transform:translateX(-50%);
	  width: 14px; height: 14px;
	  background:#fff; border-left:1px solid var(--mega-line); border-top:1px solid var(--mega-line);
	  transform: translateX(-50%) rotate(45deg);
	  border-top-left-radius: 3px;
	}

	/* анимация появления (чисто по вкусу) */
	.nav__item--mega .mega{
	  opacity:0; transform: translateX(-50%) translateY(-6px);
	  transition: opacity .18s ease, transform .18s ease;
	}
	.nav__item--mega .mega:not([hidden]){
	  opacity:1; transform: translateX(-50%) translateY(0);
	}

	/* ——— Мобильный вид: фиксированная панель по ширине экрана ——— */
	@media (max-width: 960px){
	  .nav__item--mega .mega{
	    position: fixed;
	    left: 0; right: 0;
	    top: var(--hdr-h, 64px); /* высота твоего хедера */
	    transform: none;
	    width: auto; max-width: none;

	    border-radius: 0 0 var(--mega-radius) var(--mega-radius);
	    padding: calc(var(--mega-pad) + 2px) var(--mega-pad);
	    box-shadow: 0 18px 40px rgba(17,24,39,.18);
	  }
	  .nav__item--mega .mega::before{ display:none; }

	  .mega .mega-list{
	    grid-template-columns: 1fr 1fr; /* две аккуратные колонки */
	    gap: 6px 10px;
	    max-height: calc(100vh - var(--hdr-h, 64px) - 16px);
	    overflow:auto;
	    -webkit-overflow-scrolling: touch;
	  }
	}

	/* очень узкие телефоны — в одну колонку */
	@media (max-width: 430px){
	  .mega .mega-list{ grid-template-columns: 1fr; }
	}
	
	
	/* стабилизация центра: всегда fixed и по центру экрана */
	.nav__item--mega .mega{
	  position: fixed;
	  left: 50%;
	  transform: translateX(-50%);
	  top: calc(var(--hdr-h, 64px) + 10px);
	  width: clamp(680px, 72vw, 1100px);
	  max-width: 96vw;
	  z-index: 1002;
	}

	/* эффект появления (опционально) */
	.nav__item--mega .mega{
	  opacity:0; transform: translateX(-50%) translateY(-6px);
	  transition: opacity .18s ease, transform .18s ease;
	}
	.nav__item--mega .mega:not([hidden]){
	  opacity:1; transform: translateX(-50%) translateY(0);
	}

	/* треугольник под кнопкой на десктопе отключаем, т.к. панель fixed */
	.nav__item--mega .mega::before{ display:none; }

	/* мобилка — уже была fixed, оставляем как есть, можно только высоту ограничить */
	@media (max-width: 960px){
	  .nav__item--mega .mega{
	    left:0; right:0; transform:none;
	    width:auto; max-width:none;
	    top: calc(var(--hdr-h, 64px) + 2px);
	    border-radius: 0 0 16px 16px;
	    max-height: calc(100vh - var(--hdr-h, 64px) - 12px);
	    overflow:auto;
	    -webkit-overflow-scrolling: touch;
	  }
	}

	/* на всякий случай */
	[hidden]{ display:none !important; }
	
	
	/* сетка на три колонки */
	.mega .mega-list{
	  display: grid;
	  grid-template-columns: repeat(3, minmax(0,1fr));
	  gap: 1.5rem 2rem;
	  margin:0; padding:0; list-style:none;
	}

	/* каждая колонка */
	.mega .mega-col{
	  display:flex;
	  flex-direction:column;
	  gap:.35rem;
	  min-width:0;
	}

	.mega .mega-head{
	  font-weight:700;
	  font-size:1rem;
	  margin-bottom:.4rem;
	  color:#111;
	  text-decoration:none;
	}

	.mega .mega-sub{
	  list-style:none;
	  margin:0; padding:0;
	  display:flex;
	  flex-direction:column;
	  gap:.3rem;
	}
	.mega .mega-sub a{
	  font-size:.95rem;
	  text-decoration:none;
	  color:#374151;
	}
	.mega .mega-sub a:hover{
	  color:#111;
	}

	/* мобильный: колонки схлопываем */
	@media (max-width: 960px){
	  .mega .mega-list{ grid-template-columns:1fr 1fr; }
	}
	@media (max-width: 480px){
	  .mega .mega-list{ grid-template-columns:1fr; }
	}
	
	
	
	/* контейнер и сетка */
	.featured{ padding: 3.5rem 5%; background: #f3f4f6; }
	.featured-title{ margin:0 0 1.25rem; font: 800 1.6rem/1 system-ui, -apple-system, "Segoe UI", Inter, Arial, sans-serif; color:#0f172a; }
	.featured-grid{
	  display:grid; gap:1.25rem;
	  grid-template-columns: repeat(4, minmax(0,1fr));
	}
	@media (max-width: 1024px){ .featured-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
	@media (max-width: 560px){ .featured-grid{ grid-template-columns: 1fr; } }

	/* карточка */
	.post{
	  background:#fff; border:1px solid #e5e7eb; border-radius:1rem; overflow:hidden;
	  box-shadow: 0 1rem 2rem rgba(17,24,39,.06);
	  display:flex; flex-direction:column;
	}
	.post .media{ display:block; aspect-ratio: 16 / 9; background:#e5e7eb; }
	.post .media img{ width:100%; height:100%; object-fit:cover; display:block; }
	.post .body{ padding:1rem 1.1rem 1.1rem; display:flex; flex-direction:column; gap:.6rem; }
	.post h3{ font:700 1.1rem/1.3 inherit; margin:0; }
	.post h3 a{ color:#0f172a; text-decoration:none; }
	.post h3 a:hover{ text-decoration:underline; text-decoration-thickness: .08em; }
	.post p{ margin:0; color:#374151; font-size:.95rem; line-height:1.55; }
	.post .meta{ margin-top:.25rem; color:#6b7280; font-size:.85rem; display:flex; align-items:center; gap:.5rem; }
	.post .meta .dot{ opacity:.6; }
	
	
	/* ===== MOSAIC (шахматка) ===== */
	.mosaic{ padding:3rem 5%; background:#eef0f4; }

	.mosaic-grid{
	  display:grid;
	  grid-template-columns:repeat(3, minmax(0,1fr));
	  gap:1rem;
	  grid-auto-rows:10px;                  /* базовый «кирпичик» высоты */
	}

	/* карточка по умолчанию — квадрат */
	.mosaic-card{
	  display:block;
	  position:relative;
	  overflow:hidden;
	  border-radius:16px;
	  background:#e5e7eb;
	  isolation:isolate;
	  grid-row:span 28;                     /* ≈ квадрат */
	  transition:border-radius .25s, box-shadow .25s, transform .25s;
	}

	/* каждая чётная — прямоугольник (выше) */
	.mosaic-card:nth-child(even){ grid-row:span 42; }

	/* изображение на всю карточку */
	.mosaic-card > img{
	  position:absolute; inset:0;
	  width:100%; height:100%;
	  object-fit:cover; display:block;
	  transform:scale(1); transition:transform .35s ease;
	}

	/* затемнение снизу */
	.mosaic-card::after{
	  content:""; position:absolute; inset:0; z-index:1;
	  background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 60%);
	  opacity:.85; transition:opacity .25s;
	}

	/* подписи */
	.mosaic-cap{
	  position:absolute; left:16px; right:16px; bottom:14px; z-index:2;
	  color:#fff; text-shadow:0 2px 16px rgba(0,0,0,.35);
	}
	.mosaic-title{
	  display:block; font-weight:900;
	  font-size:clamp(1.1rem, 0.9rem + 1.2vw, 1.8rem);
	  line-height:1.05; letter-spacing:.01em;
	}
	.mosaic-sub{
	  display:block; margin-top:.35rem; font-weight:700; font-size:1rem;
	  opacity:0; transform:translateY(6px);
	  transition:opacity .25s, transform .25s;
	}

	/* hover */
	.mosaic-card:hover{
	  transform:translateY(-3px);
	  border-radius:22px;
	  box-shadow:0 18px 44px rgba(17,24,39,.18);
	}
	.mosaic-card:hover > img{ transform:scale(1.03); }
	.mosaic-card:hover::after{ opacity:1; }
	.mosaic-card:hover .mosaic-sub{ opacity:1; transform:translateY(0); }

	/* адаптив: 2 колонки, сохраняем шахматный рисунок */
	@media (max-width:1100px){
	  .mosaic-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); grid-auto-rows:12px; }
	  .mosaic-card{ grid-row:span 30; }
	  .mosaic-card:nth-child(even){ grid-row:span 45; }
	}

	/* мобильный: 1 колонка — одинаковая высота */
	@media (max-width:560px){
	  .mosaic-grid{ grid-template-columns:1fr; grid-auto-rows:12px; }
	  .mosaic-card, .mosaic-card:nth-child(even){ grid-row:span 36; }
	}











	/* === FIX: квадраты без налезания === */
	.mosaic-grid{
	  display:grid;
	  grid-template-columns:repeat(3, minmax(0,1fr));
	  gap:1rem;
	}
	@media (max-width:1100px){ .mosaic-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
	@media (max-width:560px){  .mosaic-grid{ grid-template-columns:1fr; } }

	.mosaic-card{
	  position:relative;          /* важно: контекст для абсолютной картинки */
	  display:block;
	  width:100%;
	  aspect-ratio:1 / 1;         /* квадрат */
	  overflow:hidden;
	  grid-row:auto !important;   /* убираем любые спаны */
	  border-radius:16px;         /* если нужно скругление */
	}

	.mosaic-card:nth-child(even){ grid-row:auto !important; }

	.mosaic-card > img{
	  position:absolute; inset:0;
	  width:100%; height:100%;
	  object-fit:cover; display:block;
	}




	/* ====== СКОУП: .catalog ====== */
	.catalog{
	  --card:#fff; --line:#ececec; --ink:#171717;
	  --muted:#6b7280; --shadow:0 .5rem 1.25rem rgba(17,24,39,.06);
	  position:relative;
	}

	/* переключатель */
	.catalog .view-toggle{
	  position:fixed; left:50%; bottom:1rem; transform:translateX(-50%);
	  display:flex; align-items:center; gap:.25rem;
	  background:#fff; border:1px solid #e5e7eb; border-radius:2rem;
	  box-shadow:0 1.5rem 2.5rem rgba(17,24,39,.15);
	  padding:.25rem .25rem .1rem; z-index:10; transition:opacity .3s ease;
	}
	.catalog .view-toggle.hidden{ opacity:0; pointer-events:none; }
	.catalog .view-toggle label,
	.catalog .view-toggle .filter{
	  padding:.7rem 1.1rem; border-radius:1.5rem; border:0; cursor:pointer;
	  font-weight:800; letter-spacing:.02em; background:#fff; color:#111827;
	}
	.catalog .view-toggle .filter{ display:inline-flex; align-items:center; gap:.5rem; border-left:1px solid #e5e7eb; }
	#view-large:checked ~ .view-toggle label[for="view-large"],
	#view-compact:checked ~ .view-toggle label[for="view-compact"]{ background:#111827; color:#fff; }

	/* GRID — фиксируем именно сетку каталога */
	.catalog .grid{
	  display:grid; gap:1rem;
	  grid-template-columns:repeat(4, minmax(0,1fr));
	}
	#view-large:checked ~ .grid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
	@media (max-width:75rem){ .catalog .grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
	@media (max-width:52rem){ .catalog .grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }

	/* CARD */
	.catalog .product-card{
	  background:rgba(255,255,255,.5); border:1px solid var(--line);
	  border-radius:1rem; overflow:hidden; box-shadow:var(--shadow);
	  display:flex; flex-direction:column; min-width:0; /* не даём контенту ломать сетку */
	}
	.catalog .product-card .media{
	  position:relative; background:#fff; padding:0; aspect-ratio:4/3;
	  display:grid; place-items:center;
	}
	.catalog .product-card .media img{ width:100%; height:100%; object-fit:contain; display:block; }
	.catalog .badge{
	  position:absolute; top:.75rem; left:.75rem; background:#ff4d3d; color:#fff;
	  font-weight:800; font-size:.9rem; line-height:1; padding:.4rem .55rem; border-radius:.4rem;
	}

	/* variants / swatches */
	.catalog .variants, .catalog .swatches{ display:flex; gap:.5rem; padding:.65rem .75rem 0; align-items:center; flex-wrap:nowrap; }
	.catalog .thumb{ width:4rem; height:4rem; overflow:hidden; background:#fff; border:none; padding:0; cursor:pointer; }
	.catalog .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
	.catalog .more{ width:2rem; height:2rem; border:1px solid #e5e7eb; border-radius:50%; background:#fff; font-weight:800; cursor:pointer; }
	.catalog .swatches span{ width:1rem; height:1rem; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px #e5e7eb; background:var(--c); }

	.catalog .meta{
	  display:grid;
	  grid-template-columns: 1fr;
	  row-gap:.55rem;
	  padding:.75rem .9rem 1rem;
	  min-width:0;
	}

	.catalog .meta .left{
	  grid-column:1 / -1;
	  min-width:0;
	}
	.catalog .cat{
	  font-size:.65rem; font-weight:800; color:#9ca3af;
	  text-transform:uppercase; letter-spacing:.06em;
	}
	.catalog .name{
	  display:block; margin:.2rem 0 .35rem;
	  font-weight:600; color:var(--ink); text-decoration:none;
	}

	.catalog .meta .right{
	  grid-column:1 / -1;
	  display:flex;
	  justify-content:flex-end;
	  align-items:center;   /* ← вот ключ: центрируем по вертикали */
	  gap:.6rem;
	  width:100%;
	}

	.catalog .price{
	  display:flex;
	  align-items:center;   /* ← вместо baseline */
	  gap:.5rem;
	  white-space:nowrap;
	}
	.catalog .price .old{
	  color:#9ca3af; text-decoration:line-through; font-size:.95rem;
	}
	.catalog .price .new{
	  color:#111; font-weight:800; font-size:1.05rem; line-height:1;
	}

	.catalog .cart{
	  display:inline-flex; align-items:center; justify-content:center;
	  width:2.25rem; height:2.25rem; flex:0 0 auto;
	  border-radius:50%; border:1px solid #e5e7eb;
	  background:#fff; color:#111; cursor:pointer;
	  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
	   border: none;
	   background: transparent;
	}
	.catalog .cart:hover{ transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,.08); }
	.catalog .cart:focus-visible{ outline:2px solid #111; border: none; outline-offset:2px; }
	.catalog .cart svg{ width:1.4rem; height:1.4rem; display:block; }

	/* wish (как было) */
	.catalog .wish{
	  position:absolute; top:.6rem; right:.6rem; width:2rem; height:2rem;
	  border-radius:50%; cursor:pointer; border:none;
	  background:url("data:image/svg+xml,%3Csvg width='22' height='20' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 20'%3E%3Cpath d='M6.4878,1.6778c1.50568,-0.00795 2.92556,0.68424 3.8236,1.86417c0.04906,0.064 0.10736,0.12091 0.17314,0.16902c0.38016,0.27791 0.91938,0.20231 1.20406,-0.16902c0.90222,-1.18272 2.3254,-1.87814 3.83614,-1.87427c2.63296,0.00687 4.76167,2.0959 4.75486,4.66623c0,3.52217 -2.5916,6.59763 -4.7652,8.5563c-1.39084,1.24156 -2.9029,2.34718 -4.5144,3.30096c-1.6115,-0.95378 -3.12356,-2.0594 -4.5144,-3.30096c-2.1758,-1.95867 -4.7674,-5.03413 -4.7674,-8.5563c0.00374,-2.57011 2.13686,-4.65249 4.7696,-4.65614zM11.4114,19.89643c1.88386,-1.05537 3.64166,-2.31239 5.2404,-3.74768c1.41504,-1.2392 2.6411,-2.66976 3.641,-4.24808c1.133,-1.84485 1.7072,-3.71976 1.7072,-5.56675c-0.00066,-1.00038 -0.2442,-1.98637 -0.71016,-2.87744c-1.63064,-3.11734 -5.54114,-4.35418 -8.73444,-2.76233c-0.57002,0.28715 -1.09384,0.65397 -1.5554,1.08887c-0.46222,-0.43491 -0.98692,-0.80173 -1.5576,-1.08887c-0.91344,-0.45552 -1.92434,-0.69327 -2.94998,-0.69348c-3.58446,-0.00129 -6.4911,2.83427 -6.49242,6.33325c0,1.847 0.5742,3.72191 1.7072,5.56675c0.99924,1.57875 2.2253,3.00952 3.641,4.24808c1.59874,1.43529 3.35654,2.69232 5.2404,3.74768c0.12606,0.06787 0.26752,0.1033 0.4114,0.10309c0.14388,0 0.28534,-0.03544 0.4114,-0.10309z' fill='%23000000'/%3E%3C/svg%3E") 50% 50% no-repeat;
	}

	/* немного ужмём на очень узких */
	@media (max-width:40rem){
	  .catalog .price .new{ font-size:1rem; }
	  .catalog .cart{ width:2rem; height:2rem; }
	}
	
	.catalog .product-card{
	  display:flex;
	  flex-direction:column;
	}

	.catalog .meta{
	  margin-top:auto;
	}

	.catalog .meta .right,
	.catalog .price{
	  align-items:center;
	}
	
	
	
	/* ===== Home Products (hero-bottom section) ===== */
	.home-products{ padding:3rem 5% 3.25rem; background:#f7f8fb; }
	.hp-inner{ max-width: 1200px; margin: 0 auto; }

	.hp-head{
	  display:flex; align-items:center; justify-content:space-between; gap:1rem;
	  margin-bottom:1rem;
	}
	.hp-head h2{
	  margin:0; font:800 1.6rem/1 system-ui, -apple-system, "Segoe UI", Inter, Arial, sans-serif; color:#0f172a;
	}

	/* Tabs */
	.hp-tabs{ display:flex; gap:.4rem; background:#fff; border:1px solid #e5e7eb; padding:.25rem; border-radius:999px; box-shadow:0 6px 18px rgba(17,24,39,.06); }
	.hp-tab{
	  padding:.55rem .9rem; border-radius:999px; border:0; background:transparent; cursor:pointer;
	  font-weight:700; color:#111827;
	}
	.hp-tab.is-active{ background:#111827; color:#fff; }

	/* Grid (4 -> 2 -> 1) */
	.hp-grid{
	  display:grid; gap:1rem;
	  grid-template-columns:repeat(4,minmax(0,1fr));
	}
	@media (max-width: 75rem){ .hp-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
	@media (max-width: 52rem){ .hp-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
	@media (max-width: 34rem){ .hp-grid{ grid-template-columns:1fr; } }

/* шапка секции */
.home-products{ padding:3rem 5% 3.25rem; background:#eef0f4; }
.hp-inner{ max-width:1280px; margin:0 auto; }

.hp-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }
.hp-head h2{ margin:0; font:800 1.6rem/1 system-ui, -apple-system, "Segoe UI", Inter, Arial, sans-serif; color:#0f172a; }

/* Табы как на рефе: большие «капсулы» без заливки, активный — с обводкой и лёгкой заливкой */
.hp-tabs{ display:flex; gap:.75rem; }
.hp-tab{
  appearance:none; border:1.5px solid transparent; background:transparent; cursor:pointer;
  padding:.7rem 1.1rem; border-radius:999px; font-weight:700; color:#111827;
  transition:.2s ease;
}
.hp-tab:is(:hover,:focus-visible){ background:#fff; border-color:#e5e7eb; }
.hp-tab.is-active{
  border-color:#1e73be; color:#111827; background:#fff; box-shadow:0 8px 22px rgba(17,24,39,.06);
}

/* Горизонтальный слайдер карточек */
.hp-slider{ overflow:hidden; }
.hp-track{
  display:flex; gap:1rem; overflow-x:auto; padding:.25rem 0 0;
  scroll-snap-type:x mandatory; scroll-padding:1rem; -webkit-overflow-scrolling:touch;
}
.hp-track > .product-card{
  flex:0 0 clamp(260px, 26vw, 320px);     /* ширина карточки */
  scroll-snap-align:start; scroll-snap-stop:always;
}

/* Точки снизу со «сдвигом вправо» */
.hp-dots{ margin-top:1.1rem; display:flex; justify-content:flex-end; gap:.45rem; transform:translateX(10px); }
.hp-dots .dot{ width:.55rem; height:.55rem; border-radius:50%; background:#d1d5db; border:0; cursor:pointer; }
.hp-dots .dot.is-active{ background:#1e73be; }