*{margin:0;padding:0;box-sizing:border-box}:root{--bg:#121213;--card:#17181b;--stroke:#2a2b2f;--text:#f3f4f5;--muted:#9aa0a6;--accent:#ff6a3d}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overflow-x:hidden;overflow-y:auto;}a{text-decoration:none;color:inherit}.site-header{max-width:1200px;margin:0 auto;padding:18px 24px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}.brand{display:flex;align-items:center;gap:8px;font-weight:800}.brand-badge{background:#fff;color:#111;border-radius:8px;padding:6px 8px;font-weight:900;transition:background-position 2s linear;background-size:200% 100%}.brand:hover .brand-badge{background:linear-gradient(90deg,#fff,var(--accent),#fff);background-size:200% 100%;animation:shine 2.2s linear infinite}@keyframes shine{from{background-position:0%}to{background-position:200%}}.nav{justify-self:center;display:flex;gap:10px}.chip{border:1px solid var(--stroke);background:#141518;color:var(--text);padding:8px 14px;border-radius:999px;font-weight:700;transition:.15s}.chip:hover{background:#1c1d21;transform:translateY(-1px)}.chip.active{background:var(--accent);color:#fff;box-shadow:0 0 12px rgba(255,106,61,.45)}.search{justify-self:end;position:relative}.search input{width:260px;padding:10px 36px 10px 38px;border:1px solid var(--stroke);border-radius:12px;background:#141518;color:var(--text)}.search svg{position:absolute;left:12px;top:50%;translate:0 -50%;width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}.container{max-width:1200px;margin:0 auto;min-height:100vh;padding:6px 20px 28px;display:flex;flex-direction:column;align-items:center;gap:14px}.title{font-size:clamp(28px,6vw,64px);font-weight:900;text-align:center}.contact{background:var(--accent);color:#111;border:2px solid #000;box-shadow:0 3px 0 #000;border-radius:12px;padding:10px 18px;font-weight:900;transition:.15s}.contact:hover{transform:translateY(-1px)}.home-grid{width:100%;display:grid;gap:28px;grid-template-columns:1fr 1.55fr;grid-template-rows:auto auto;align-items:stretch}.card{position:relative;background:var(--card);border:1px solid var(--stroke);border-radius:22px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.35);transform-style:preserve-3d;transition:transform .18s ease,box-shadow .18s ease}.card .cover{position:absolute;inset:0}.card .cover img{width:100%;height:100%;object-fit:cover;display:block}.card::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 50%,transparent 60%);opacity:0;transform:translateX(-100%);transition:opacity .25s ease,transform .6s ease}.card:hover::before{opacity:1;transform:translateX(100%)}.left,.gallery{height:clamp(420px,46vh,560px)}.left{grid-column:1;grid-row:1}.gallery{grid-column:2;grid-row:1}.left .cover img,.gallery .cover img{transform:scale(1);transition:transform .6s ease;will-change:transform}.left:hover .cover img,.gallery:hover .cover img{transform:scale(1.05)}.bottom{grid-column:1 / span 2;grid-row:2;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.bottom .card{height:clamp(200px,26vh,240px);padding:18px;display:flex;flex-direction:column;justify-content:space-between}.muted{color:var(--muted)}.hashtag{font-size:26px;font-weight:900}.faq .chip{align-self:flex-start;background:#141518;border:1px solid var(--stroke);padding:10px 18px;border-radius:999px}.faq .chip:hover{background:#1c1d21}.quality{padding:0;overflow:hidden}.quality .hashtag{position:absolute;top:16px;left:18px;z-index:2}.quality .cover{position:absolute;inset:0;overflow:visible}.quality .cover img{position:absolute;bottom:-40%;left:50%;transform:translateX(-50%) scale(1);transform-origin:center bottom;width:120%;height:auto;transition:transform .45s ease;will-change:transform}.quality:hover .cover img{transform:translateX(-50%) scale(1.08)}.stats .stat{font-size:28px;font-weight:900;margin-bottom:8px}.stats .stat span{display:block;font-size:14px;color:var(--muted);font-weight:600}.stats p{font-size:14px;line-height:1.5}.tilt{will-change:transform;perspective:1000px}.tilt:hover{box-shadow:0 18px 40px rgba(0,0,0,.45)}@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.fade-seq-root .fade-seq{opacity:0;animation:fadeUp .7s ease forwards}footer{color:#9aa0a6;text-align:center;padding:12px 0;font-size:14px}.modal{position:fixed;inset:0;display:none}.modal[aria-hidden="false"]{display:block}.modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)}.modal__content{position:absolute;left:50%;top:50%;translate:-50% -50%;width:min(420px,90vw);background:#15161a;border:1px solid var(--stroke);border-radius:16px;padding:18px 18px 16px;box-shadow:0 18px 48px rgba(0,0,0,.5)}.modal__close{position:absolute;right:10px;top:10px;background:#1b1c20;border:1px solid var(--stroke);color:#fff;border-radius:10px;padding:6px 10px;cursor:pointer}.modal__content h3{font-size:22px;margin:6px 0 10px}.contact-list{list-style:none;display:grid;gap:10px}.contact-list a{color:#fff}.contact-list a:hover{color:var(--accent)}@media (max-width:1024px){.home-grid{grid-template-columns:1fr;grid-template-rows:auto auto auto}.left,.gallery{height:52vh}.gallery{grid-column:1;grid-row:2}.bottom{grid-column:1;grid-template-columns:1fr 1fr}.bottom .card{height:220px}}@media (max-width:640px){.site-header{grid-template-columns:1fr auto;gap:10px;padding:14px 16px}.nav{display:none}.search input{width:180px}.title{font-size:clamp(24px,8vw,36px)}.left,.gallery{height:44vh}.bottom{grid-template-columns:1fr;gap:16px}.bottom .card{height:200px}}
/* mobile scroll + svh patch */
body{-webkit-overflow-scrolling:touch}
@supports(height:100svh){.container{min-height:100svh}}


/* --- Mobile tweaks (safe, no layout break) --- */
@media (max-width: 600px) {
  /* Hide the big gallery image card on mobile */
  .card.gallery { display: none !important; }

  /* Allow nav chips to wrap if screen is narrow */
  .nav { flex-wrap: wrap; }
}


@media (max-width: 600px) {
  header.site-header { 
    grid-template-columns: 1fr; 
    grid-auto-flow: row; 
    row-gap: 10px;
  }
  header.site-header .nav {
    justify-content: center;
    justify-self: center;
  }
}


/* Mobile header menu */
.menu-btn { display:none; }
@media (max-width: 600px) {
  header.site-header .nav { display: none; } /* заменяем чипы на кнопку */
  .menu-btn {
    display:inline-flex;
    align-items:center; justify-content:center;
    margin-left: 8px;
    width:38px; height:38px; border-radius:10px;
    background:#1c1d21; border:1px solid var(--stroke); color:#fff;
  }
  .menu-btn svg { width:22px; height:22px; stroke: currentColor; fill:none; stroke-width:2; }
  .menu-pop {
    position: absolute; top: 64px; left: 16px; right: 16px;
    background:#111214; border:1px solid var(--stroke); border-radius:12px;
    box-shadow: 0 10px 30px rgba(0,0,0,.45);
    padding: 8px; display:none; z-index: 1000;
  }
  .menu-pop.open { display:block; }
  .menu-item {
    display:block; padding:12px 14px; border-radius:10px;
    color: var(--text); text-decoration:none; font-weight:700;
  }
  .menu-item:hover { background:#1b1c20; }
  /* Ensure header is positioning context */
  header.site-header { position: relative; }
  /* Layout: place button inside search row */
  header.site-header .search { display:flex; align-items:center; }
  header.site-header .search input { flex:1; }
}


/* --- Mobile menu alignment & positioning tweaks --- */
@media (max-width: 600px) {
  header.site-header { align-items: center; }
  header.site-header .brand { align-self: center; }

  header.site-header .search {
    display: grid;
    grid-template-columns: 1fr 42px;
    gap: 8px;
    align-items: center;
  }
  .menu-btn { width:42px; height:42px; border-radius:12px; }

  .menu-pop {
    top: calc(100% + 8px);
    left: auto;
    right: 16px;
  }
}


/* --- Mobile header: brand | search+menu in one row --- */
@media (max-width: 600px) {
  header.site-header {
    display: grid;
    grid-template-columns: auto 1fr;  /* logo | search+menu */
    align-items: center;
    column-gap: 12px;
  }
  header.site-header .nav { display: none; } /* чипы скрываем только на мобилке */
  header.site-header .search {
    display: grid;
    grid-template-columns: 1fr 44px;  /* input | menu */
    gap: 8px;
    align-items: center;
    justify-self: end;
    width: 100%;
    max-width: 420px;
  }
  header.site-header .search input {
    height: 44px;
  }
  .menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    margin: 0;              /* сброс случайных отступов */
  }
  /* dropdown от правого края, под шапкой */
  .menu-pop {
    top: calc(100% + 10px);
    left: auto;
    right: 16px;
  }
}


/* --- Mobile header FINAL: logo | search | menu button --- */
@media (max-width: 600px) {
  header.site-header {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto; /* logo | search | button */
    align-items: center;
    column-gap: 12px;
  }

  header.site-header .nav { display: none; } /* chips hidden only on mobile */

  /* search field */
  header.site-header .search {
    display: block;
    width: 100%;
    max-width: 440px;
    margin-left: 8px;        /* small nudge to the right */
  }
  header.site-header .search input { height: 44px; }

  /* menu button */
  .menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border-radius: 12px;
    margin: 0;
  }
  .menu-btn svg {
    width: 22px; height: 22px;
    stroke: currentColor; fill: none; stroke-width: 2;
    stroke-linecap: round; stroke-linejoin: round;
  }

  /* dropdown under header, pinned to right edge */
  .menu-pop { top: calc(100% + 10px); left: auto; right: 16px; }
}

/* desktop defaults for injected mobile menu */
.menu-btn{display:none}
.menu-pop{display:none}


/* ensure mobile menu button is visible on small screens */
@media (max-width: 600px) {
  .menu-btn { display: inline-flex !important; }
  header.site-header .nav { display: none !important; }
}