:root{
   --bg: #f6f7f8;
   --panel: #ffffff;
   --text: #111111;
   --muted: #5a5f66;
   --line: rgba(17,17,17,.10);
   --soft: rgba(17,17,17,.04);
   --shadow: 0 12px 28px rgba(0,0,0,.10);
   --radius: 12px;
   --radius-lg: 16px;
   --accent: #111111;
   --accent-2: #000000;
   --topbar-h: 30px;
 }
 
 *{ box-sizing:border-box; }
 html,body{ min-height:100%; }
 body{
   margin:0;
   font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
   background: var(--bg);
   color: var(--text);
   line-height: 1.45;
   -webkit-font-smoothing: antialiased;
 }

 button{ font: inherit; color: inherit; }

 a:focus-visible,
 button:focus-visible,
 input:focus-visible{
   outline: 3px solid rgba(27,142,74,.35);
   outline-offset: 2px;
 }
 
 a{ color:inherit; text-decoration:none; }
 
 .container{
   width: min(1180px, calc(100% - 32px));
   margin: 0 auto;
 }

 .sr-only{
   position:absolute;
   width:1px;
   height:1px;
   padding:0;
   margin:-1px;
   overflow:hidden;
   clip: rect(0,0,0,0);
   white-space:nowrap;
   border:0;
 }
 
 .topbar{
   position: sticky;
   top: 0;
   z-index: 60;
   background: linear-gradient(90deg, #6b6b6b 0%, #2b2b2b 52%, #000 100%);
   color: #fff;
   font-size: 12px;
 }
 
 .topbar-inner{
   min-height: 30px;
   display:grid;
   grid-template-columns: 1fr auto 1fr;
   align-items:center;
   gap: 10px;
 }

 .topbar-item{
   display:inline-flex;
   align-items:center;
   gap: 6px;
   color: rgba(255,255,255,.95);
   white-space: nowrap;
   padding: 6px 0;
 }
 .topbar-item:hover{ text-decoration: underline; }
 .topbar-item--center{ justify-self:center; font-weight: 700; }
 .topbar-item--right{ justify-self:end; }
 .topbar-ico{ font-size: 12px; opacity: .9; }

 .site-header{
   position: sticky;
   top: var(--topbar-h);
   z-index: 50;
   background: transparent;
   backdrop-filter: none;
   border-bottom: 0;
 }

 .header-shell{ padding: 12px 0 10px; position: relative; left: -14px; top: -10px; }

 .header-pill{
   position: relative;
   background: transparent;
   border-radius: 999px;
   box-shadow: none;
   padding: 12px 16px 12px 0;
   display:grid;
   grid-template-columns: auto 1fr auto;
   align-items:center;
   gap: 14px;
 }

 .header-pill::before{
   content:"";
   position:absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 50px;
   background: #fff;
   border-radius: 999px;
   box-shadow: 0 10px 26px rgba(0,0,0,.12);
 }

 .header-pill > *{
   position: relative;
   z-index: 1;
 }

 .brand{
   display:flex;
   align-items:center;
   gap: 6px;
   min-width: 190px;
 }

 .brand-logo{
   width: clamp(150px, 18vw, 240px);
   height: clamp(44px, 5vw, 72px);
   display:block;
   transform-origin: left center;
   transform: translateX(120px) scale(1.25);
   background: #111;
   -webkit-mask: url("../../img/logo.png") left center / contain no-repeat;
   mask: url("../../img/logo.png") left center / contain no-repeat;
 }

 .brand-name{ font-weight: 900; letter-spacing: .2px; font-size: clamp(20px, 2.2vw, 26px); line-height: 1; white-space: nowrap; }
 .brand-dot{
   margin-top: 6px;
   height: 18px;
   padding: 0 8px;
   border-radius: 999px;
   background: var(--accent);
   color: #fff;
   font-size: 11px;
   font-weight: 800;
   display:inline-flex;
   align-items:center;
 }

 .search{
   display:flex;
   position: relative;
   align-items:center;
   border: 0;
   background: #f3f4f6;
   border-radius: 999px;
   height: 44px;
   padding: 0 14px;
 }
 .search:focus-within{
   background: #fff;
   box-shadow: 0 0 0 3px rgba(17,17,17,.14);
 }
 .search-ico{ color: rgba(17,17,17,.55); font-size: 14px; }
 .search-input{
   width: 100%;
   border: none;
   outline: none;
   background: transparent;
   font-size: 14px;
 }
 .search-input:focus-visible{ outline: none; }
 .search-input::placeholder{ color: rgba(17,17,17,.45); }

 .search-panel{
   position: absolute;
   top: calc(100% + 10px);
   left: 0;
   right: 0;
   background: #fff;
   color: #111;
   border-radius: 16px;
   border: 1px solid rgba(17,17,17,.12);
   box-shadow: 0 18px 40px rgba(0,0,0,.18);
   overflow: hidden;
   z-index: 80;
 }
 .search-panel-head{
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap: 12px;
   padding: 12px 14px;
   border-bottom: 1px solid rgba(17,17,17,.10);
 }
 .search-panel-title{ font-weight: 900; font-size: 12px; letter-spacing: .2px; opacity: .92; }
 .search-panel-all{ font-weight: 800; font-size: 12px; color: rgba(17,17,17,.88); text-decoration: none; }
 .search-panel-all:hover{ text-decoration: underline; }
 .search-panel-loading,
 .search-panel-empty{ padding: 14px; font-size: 12px; color: rgba(17,17,17,.70); }
 .search-panel-list{ max-height: 380px; overflow:auto; }
 .search-panel-list::-webkit-scrollbar{ width: 10px; }
 .search-panel-list::-webkit-scrollbar-thumb{ background: rgba(17,17,17,.16); border-radius: 999px; }

 .search-item{
   display:flex;
   gap: 12px;
   padding: 10px 14px;
   border-bottom: 1px solid rgba(17,17,17,.08);
   text-decoration: none;
   color: inherit;
 }
 .search-item:last-child{ border-bottom: 0; }
 .search-item:hover{ background: rgba(17,17,17,.04); }
 .search-item-media{ width: 44px; height: 44px; border-radius: 12px; overflow:hidden; background: rgba(17,17,17,.05); flex: 0 0 auto; display:flex; align-items:center; justify-content:center; }
 .search-item-img{ width: 100%; height: 100%; object-fit: cover; display:block; }
 .search-item-ph{ width: 100%; height: 100%; display:block; background: radial-gradient(26px 18px at 35% 40%, rgba(17,17,17,.10), transparent 62%), linear-gradient(135deg, rgba(17,17,17,.08), rgba(17,17,17,.03)); }
 .search-item-meta{ min-width: 0; display:flex; flex-direction:column; justify-content:center; gap: 4px; }
 .search-item-name{ font-weight: 900; font-size: 12px; color: #111; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; }
 .search-item-sub{ font-size: 12px; color: rgba(17,17,17,.68); white-space: nowrap; overflow:hidden; text-overflow: ellipsis; }

 .header-actions{
   display:flex;
   align-items:center;
   justify-content:flex-end;
   gap: 10px;
 }

 .header-actions .icon-btn{ display:none; }
 .action{
   display:inline-flex;
   align-items:center;
   gap: 8px;
   height: 40px;
   padding: 0 12px;
   border-radius: 999px;
   border: 1px solid rgba(17,17,17,.12);
   background: #fff;
 }
 .action:hover{ background: var(--soft); }
 .action-txt{ font-size: 13px; font-weight: 600; }
 .action-ico-img{ width: 18px; height: 18px; display:block; object-fit: contain; }
 .action-txt--account{ max-width: 150px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
 .badge{
   margin-left: 2px;
   min-width: 18px;
   height: 18px;
   padding: 0 5px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   border-radius: 999px;
   background: var(--accent);
   color: #fff;
   font-size: 11px;
   font-weight: 700;
 }

 .icon-btn{
   width: 42px;
   height: 42px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   border-radius: 12px;
   border: 1px solid var(--line);
   background: #fff;
   cursor:pointer;
 }
 .icon-btn:hover{ background: var(--soft); }

 .hamburger{
   width: 18px;
   height: 2px;
   background: #111;
   position: relative;
   display:block;
 }
 .hamburger::before,
 .hamburger::after{
   content:"";
   position:absolute;
   left:0;
   width: 18px;
   height: 2px;
   background:#111;
 }
 .hamburger::before{ top:-6px; }
 .hamburger::after{ top:6px; }

 .nav{
   border-top: 1px solid var(--line);
   background: #fff;
 }
 .nav-inner{
   min-height: 46px;
   display:flex;
   align-items:center;
   gap: 18px;
   overflow:auto;
   scrollbar-width: none;
 }
 .nav-inner::-webkit-scrollbar{ display:none; }
 .nav-a{
   font-size: 13px;
   font-weight: 600;
   color: rgba(17,17,17,.88);
   white-space: nowrap;
   padding: 10px 0;
 }
 .nav-a:hover{ color: #111; }

 .nav-item{ position: relative; }
 .nav-btn{
   border: none;
   background: transparent;
   font: inherit;
   font-size: 13px;
   font-weight: 700;
   cursor:pointer;
   padding: 10px 0;
   white-space: nowrap;
   color: rgba(17,17,17,.92);
 }
 .nav-btn:hover{ color: #111; }
 .nav-btn::after{
   content: "▾";
   margin-left: 6px;
   font-size: 12px;
   opacity: .65;
 }
 .nav-item.is-open .nav-btn::after{ opacity: .9; }
 .nav-panel{
   position:absolute;
   top: calc(100% + 8px);
   left: 0;
   min-width: 220px;
   background: #fff;
   border: 1px solid var(--line);
   border-radius: 14px;
   box-shadow: var(--shadow);
   padding: 8px;
   display:none;
   z-index: 60;
 }
 .nav-item.is-open .nav-panel{ display:block; }
 .nav-link{
   display:flex;
   align-items:center;
   height: 38px;
   border-radius: 10px;
   padding: 0 10px;
   font-size: 13px;
   color: var(--text);
 }
 .nav-link:hover{ background: var(--soft); }

 .mobile-drawer{
   display:none;
   background: #fff;
   border-top: 1px solid var(--line);
 }
 .mobile-drawer.is-open{ display:block; }
 .mobile-drawer-inner{
   padding: 10px 0 16px;
   display:grid;
   gap: 8px;
 }
 .mobile-link{
   height: 44px;
   display:flex;
   align-items:center;
   padding: 0 12px;
   border-radius: 12px;
   border: 1px solid var(--line);
   background: #fff;
   font-weight: 600;
 }
 .mobile-link:hover{ background: var(--soft); }

 .overlay{
   position: fixed;
   inset: 0;
   background: rgba(0,0,0,.35);
   opacity: 0;
   pointer-events: none;
   transition: opacity .18s ease;
   z-index: 40;
 }
 .overlay.is-open{ opacity: 1; pointer-events: auto; }
 html.is-locked,
 html.is-locked body{ overflow: hidden; }

 main{ padding-bottom: 10px; }

 .hero-entry{ padding: 6px 0 14px; }
 .hero-entry-grid{
   display:grid;
   grid-template-columns: 2fr 1fr;
   gap: 14px;
 }
 .hero-side{ display:grid; grid-template-rows: 1fr 1fr; gap: 14px; }

 .hero-card{
   position: relative;
   display:block;
   border-radius: 16px;
   overflow:hidden;
   box-shadow: 0 10px 20px rgba(0,0,0,.10);
   transition: transform .18s ease, box-shadow .18s ease;
 }
 .hero-card:hover,
 .hero-card:focus-visible{
   transform: translateY(-4px);
   box-shadow: 0 18px 34px rgba(0,0,0,.14);
 }
 .hero-card--main{
   min-height: clamp(300px, 34vw, 520px);
   background: #000;
 }
 .hero-card--main::before{
   content:"";
   display:none;
 }
 .hero-card-bg{
   position:absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
   z-index: 0;
   transform: none;
   transition: transform .35s ease;
   will-change: transform;
 }
 .hero-card:hover .hero-card-bg,
 .hero-card:focus-visible .hero-card-bg{
   transform: scale(1.04);
 }

 @media (prefers-reduced-motion: reduce){
   .hero-card,
   .hero-card-bg{ transition: none; }
   .hero-card:hover,
   .hero-card:focus-visible{ transform: none; }
   .hero-card:hover .hero-card-bg,
   .hero-card:focus-visible .hero-card-bg{ transform: none; }
 }
 .hero-card-overlay{
   position:absolute;
   inset: 0;
   background:
     radial-gradient(700px 340px at 25% 40%, rgba(0,0,0,.10), rgba(0,0,0,.48) 62%),
     linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.35));
 }
 .hero-card-main,
 .hero-card-controls,
 .hero-card-note{ position:relative; z-index: 2; }
 .hero-card-main{
   padding: 26px;
   max-width: 62%;
   color: #fff;
 }

 .hero-card--main::after{ content: none; }
 .hero-card-kicker{ font-size: 13px; opacity: .95; }
 .hero-card-big{ margin-top: 14px; font-weight: 900; font-size: 64px; line-height: 1; letter-spacing: .5px; }
 .hero-card-sub{ margin-top: 6px; font-weight: 800; font-size: 22px; }
 .hero-card-note{ position:absolute; top: 14px; right: 14px; color: rgba(255,255,255,.85); font-size: 12px; }

 .hero-card--main::after{
   content: none;
   position:absolute;
   right: 18px;
   bottom: 12px;
   width: 44%;
   height: 74%;
   background:
     radial-gradient(260px 140px at 60% 35%, rgba(255,255,255,.18), transparent 60%),
     linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
   border-radius: 14px;
   transform: rotate(-6deg);
   opacity: .7;
 }

 .hero-card-controls{
   position:absolute;
   right: 14px;
   bottom: 12px;
   display:flex;
   gap: 8px;
 }
 .hero-arrow{
   width: 32px;
   height: 32px;
   border-radius: 999px;
   background: rgba(255,255,255,.22);
   border: 1px solid rgba(255,255,255,.28);
   display:inline-flex;
   align-items:center;
   justify-content:center;
   color: #fff;
   font-weight: 900;
 }

 .hero-card--side{ min-height: 133px; padding: 16px; color: #fff; }
 .hero-card--side .hero-card-bg{ object-fit: contain; }
 .hero-card--side::after{
   content:"";
   position:absolute;
   inset: 0;
   background: linear-gradient(90deg, rgba(0,0,0,.35), rgba(0,0,0,.08) 55%, rgba(0,0,0,.22));
   z-index: 1;
 }
 .hero-card--side > :not(.hero-card-bg){ position: relative; z-index: 2; }

 .hero-card--image{ padding: 0; }
 .hero-card--image .hero-card-bg{ object-fit: cover; }
 .hero-card--image::after{ content: none; }
 .hero-card--dark{
   background:
     radial-gradient(240px 140px at 30% 30%, rgba(255,255,255,.10), transparent 60%),
     linear-gradient(135deg, #111 0%, #1d1d1d 55%, #0e0e0e 100%);
 }
 .hero-card--warm{
   background:
     radial-gradient(420px 160px at 30% 30%, rgba(255,255,255,.12), transparent 62%),
     linear-gradient(135deg, #8a5a2b 0%, #caa06a 55%, #6b3f1a 100%);
 }
 .hero-side-title{ font-weight: 900; letter-spacing: .3px; font-size: 18px; }
 .hero-side-text{ margin-top: 6px; font-weight: 700; opacity: .92; }
 .hero-side-pill{
   position:absolute;
   top: 12px;
   left: 12px;
   height: 24px;
   padding: 0 10px;
   border-radius: 999px;
   background: rgba(255,255,255,.88);
   color: #111;
   font-weight: 900;
   font-size: 12px;
   display:inline-flex;
   align-items:center;
 }
 .kicker{
   display:inline-flex;
   align-items:center;
   height: 28px;
   padding: 0 10px;
   border-radius: 999px;
   background: rgba(27,142,74,.10);
   border: 1px solid rgba(27,142,74,.22);
   color: var(--accent);
   font-weight: 700;
   font-size: 12px;
 }
 .hero-title{
   margin: 12px 0 0;
   font-size: clamp(28px, 3.6vw, 44px);
   line-height: 1.05;
 }
 .hero-subtitle{
   margin: 10px 0 0;
   color: var(--muted);
   max-width: 60ch;
 }
 .hero-cta{
   margin-top: 16px;
   display:flex;
   gap: 10px;
   flex-wrap: wrap;
 }
 .hero-banner{
   border-radius: var(--radius-lg);
   border: 1px solid rgba(27,142,74,.18);
   background: radial-gradient(420px 220px at 20% 0%, rgba(27,142,74,.18), rgba(255,255,255,1) 60%);
   min-height: 200px;
   padding: 18px;
   box-shadow: var(--shadow);
 }
 .hero-banner-badge{
   width: 44px;
   height: 44px;
   border-radius: 999px;
   background: var(--accent);
   color:#fff;
   display:flex;
   align-items:center;
   justify-content:center;
   font-weight: 800;
 }
 .hero-banner-title{ margin-top: 14px; font-weight: 800; font-size: 18px; }
 .hero-banner-text{ margin-top: 8px; color: var(--muted); }

 .btn{
   display:inline-flex;
   align-items:center;
   justify-content:center;
   height: 42px;
   padding: 0 16px;
   border-radius: 999px;
   border: 1px solid var(--line);
   font-weight: 700;
   font-size: 14px;
   background: #fff;
   transition: transform .15s ease, background .15s ease, border-color .15s ease;
 }
 .btn:hover{ transform: translateY(-1px); }
 .btn-solid{
   background: var(--accent);
   border-color: rgba(27,142,74,.55);
   color: #fff;
 }
 .btn-solid:hover{ background: var(--accent-2); }
 .btn-ghost{ background: #fff; }

 .section{ padding: 22px 0; }
 .section-head{
   margin-bottom: 14px;
   display:flex;
   align-items:flex-end;
   justify-content:space-between;
   gap: 12px;
 }
 .section-title{ margin: 0; font-size: 22px; }
 .section-link{ color: var(--accent); font-weight: 700; font-size: 13px; white-space: nowrap; }

 .auth-section{ padding: 34px 0 46px; }
 .auth-wrap{ display:flex; justify-content:center; }
 .auth-card{
   width: min(560px, 100%);
   border-radius: var(--radius-lg);
   border: 1px solid var(--line);
   background: #fff;
   box-shadow: 0 16px 34px rgba(0,0,0,.10);
   padding: 22px;
 }
 .auth-title{ margin: 0; font-size: 26px; font-weight: 900; }
 .auth-subtitle{ margin-top: 8px; color: var(--muted); font-size: 13px; }

 .auth-form{ margin-top: 16px; }
 .auth-grid{ display:grid; grid-template-columns: 1fr; gap: 12px; }
 .auth-field{ display:flex; flex-direction:column; gap: 6px; }
 .auth-label{ font-weight: 800; font-size: 12px; color: rgba(17,17,17,.82); }
 .auth-input{
   height: 44px;
   padding: 0 14px;
   border-radius: 12px;
   border: 1px solid rgba(17,17,17,.12);
   background: #fff;
   outline: none;
 }
 .auth-input[type="file"]{
   height: auto;
   padding: 9px 14px;
 }
 .auth-input:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(17,17,17,.14); border-color: rgba(17,17,17,.22); }

 .auth-alert{
   margin-top: 14px;
   border-radius: 12px;
   border: 1px solid rgba(17,17,17,.14);
   background: rgba(17,17,17,.04);
   padding: 12px 12px;
   font-size: 12px;
   color: rgba(17,17,17,.82);
 }

 .auth-role{
   display: inline-flex;
   align-items: center;
   margin-left: 10px;
   height: 22px;
   padding: 0 10px;
   border-radius: 999px;
   border: 1px solid rgba(17,17,17,.14);
   background: rgba(17,17,17,.06);
   font-size: 12px;
   font-weight: 600;
   color: rgba(17,17,17,.82);
   vertical-align: middle;
 }

 .admin-grid{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
 .admin-metric{ border: 1px solid rgba(17,17,17,.12); border-radius: 12px; padding: 12px; background: #fff; }
 .admin-metric-label{ font-size: 12px; color: rgba(17,17,17,.68); }
 .admin-metric-value{ margin-top: 6px; font-size: 18px; font-weight: 700; color: rgba(17,17,17,.9); }
 .admin-table{ width: 100%; border-collapse: collapse; margin-top: 14px; }
 .admin-table th, .admin-table td{ text-align: left; padding: 10px 10px; border-bottom: 1px solid rgba(17,17,17,.10); font-size: 13px; }
 .admin-table th{ font-size: 12px; color: rgba(17,17,17,.68); font-weight: 600; }
 .admin-table tr:hover td{ background: rgba(17,17,17,.03); }

 .admin-shell{ min-height: 100vh; display: grid; grid-template-columns: 260px 1fr; background: #f6f7f8; }
 .admin-side{ position: sticky; top: 0; align-self: start; height: 100vh; padding: 18px 14px; border-right: 1px solid rgba(17,17,17,.08); background: #fff; display: flex; flex-direction: column; gap: 14px; }
 .admin-brand{ display: flex; align-items: center; justify-content: center; height: 46px; border-radius: 12px; border: 1px solid rgba(17,17,17,.10); font-weight: 900; color: #111; background: #fff; }
 .admin-nav{ display: flex; flex-direction: column; gap: 6px; }
 .admin-nav-link{ display: flex; align-items: center; height: 42px; border-radius: 12px; padding: 0 12px; border: 1px solid transparent; color: rgba(17,17,17,.84); font-weight: 800; font-size: 13px; }
 .admin-nav-link:hover{ background: rgba(17,17,17,.04); }
 .admin-nav-link.is-active{ background: rgba(17,17,17,.06); border-color: rgba(17,17,17,.10); }
 .admin-nav-badge{
   margin-left: auto;
   min-width: 18px;
   height: 18px;
   padding: 0 6px;
   border-radius: 999px;
   background: #ef4444;
   color: #fff;
   font-size: 11px;
   font-weight: 900;
   display:none;
   align-items:center;
   justify-content:center;
 }
 .admin-nav-badge.is-on{ display:inline-flex; }
 .admin-side-actions{ margin-top: auto; display: flex; flex-direction: column; gap: 8px; }

 .admin-main{ padding: 22px 22px; }
 .admin-top{ display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
 .admin-title{ margin: 0; font-size: 28px; font-weight: 900; }
 .admin-subtitle{ margin-top: 6px; font-size: 13px; color: rgba(17,17,17,.62); }
 .admin-badges{ display: flex; gap: 10px; }
 .admin-h2{ margin: 18px 0 0; font-size: 16px; font-weight: 900; color: rgba(17,17,17,.92); }
 .admin-card{ margin-top: 10px; border-radius: 14px; border: 1px solid rgba(17,17,17,.10); background: #fff; padding: 12px; box-shadow: 0 12px 24px rgba(0,0,0,.06); }

 .support-admin{ display:grid; grid-template-columns: 320px 1fr; gap: 12px; min-height: 620px; }
 .support-admin-list{ border: 1px solid rgba(17,17,17,.10); border-radius: 12px; overflow:hidden; background: #fff; display:flex; flex-direction:column; min-width: 0; }
 .support-admin-list-head{ display:flex; align-items:center; justify-content:space-between; gap: 10px; padding: 10px 10px; border-bottom: 1px solid rgba(17,17,17,.10); }
 .support-admin-list-title{ font-weight: 900; font-size: 13px; color: rgba(17,17,17,.92); }
 .support-admin-items{ overflow:auto; max-height: 720px; }
 .support-admin-empty{ padding: 12px; font-size: 12px; color: rgba(17,17,17,.70); }
 .support-admin-item{ position:relative; width: 100%; border: 0; background: transparent; padding: 10px 38px 10px 10px; text-align:left; cursor:pointer; border-bottom: 1px solid rgba(17,17,17,.08); }
 .support-admin-item:last-child{ border-bottom: 0; }
 .support-admin-item:hover{ background: rgba(17,17,17,.04); }
 .support-admin-item.is-active{ background: rgba(17,17,17,.06); }
 .support-admin-item-title{ font-weight: 900; font-size: 12px; color: rgba(17,17,17,.92); }
 .support-admin-item-sub{ margin-top: 3px; font-size: 12px; color: rgba(17,17,17,.66); }

 .support-admin-badge{
   position:absolute;
   right: 10px;
   top: 10px;
   min-width: 18px;
   height: 18px;
   padding: 0 5px;
   border-radius: 999px;
   background: #ef4444;
   color: #fff;
   font-size: 11px;
   font-weight: 900;
   display:none;
   align-items:center;
   justify-content:center;
   border: 2px solid #fff;
 }
 .support-admin-item.has-unread .support-admin-badge{ display:inline-flex; }

 .support-admin-list-badge{
   margin-left: 8px;
   min-width: 18px;
   height: 18px;
   padding: 0 6px;
   border-radius: 999px;
   background: #ef4444;
   color: #fff;
   font-size: 11px;
   font-weight: 900;
   display:none;
   align-items:center;
   justify-content:center;
 }
 .support-admin-list-badge.is-on{ display:inline-flex; }

 .support-admin-chat{ border: 1px solid rgba(17,17,17,.10); border-radius: 12px; overflow:hidden; background: #fff; display:flex; flex-direction:column; min-width: 0; }
 .support-admin-chat-head{ padding: 10px 12px; border-bottom: 1px solid rgba(17,17,17,.10); }
 .support-admin-chat-title{ font-weight: 900; font-size: 14px; color: rgba(17,17,17,.92); }
 .support-admin-chat-sub{ margin-top: 4px; font-size: 12px; color: rgba(17,17,17,.66); }
 .support-admin-messages{ flex: 1 1 auto; min-height: 280px; padding: 12px; overflow:auto; background: #f6f7f8; display:flex; flex-direction:column; gap: 8px; }
 .support-admin-bubble{ max-width: 78%; padding: 10px 12px; border-radius: 14px; font-size: 13px; line-height: 1.35; white-space: pre-wrap; word-break: break-word; border: 1px solid rgba(17,17,17,.10); background: #fff; color: rgba(17,17,17,.92); }
 .support-admin-bubble.is-user{ align-self:flex-start; }
 .support-admin-bubble.is-admin{ align-self:flex-end; background: #111; color: #fff; border-color: #111; }

 .support-admin-send{ padding: 10px 12px; border-top: 1px solid rgba(17,17,17,.10); background: #fff; }
 .support-admin-send-row textarea{ width: 100%; resize: vertical; }
 .support-admin-send-actions{ margin-top: 8px; display:flex; align-items:center; justify-content:space-between; gap: 12px; }
 .support-admin-check{ display:flex; align-items:center; gap: 8px; font-size: 12px; color: rgba(17,17,17,.72); }
 .support-admin-hint{ margin-top: 8px; font-size: 12px; min-height: 16px; }
 .support-admin-hint[data-kind="ok"]{ color: rgba(21,128,61,.92); }
 .support-admin-hint[data-kind="warn"]{ color: rgba(161,98,7,.92); }
 .support-admin-hint[data-kind="error"]{ color: rgba(185,28,28,.92); }

 .support-fab{ position: fixed; right: 18px; bottom: 18px; width: 56px; height: 56px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); background: #111; color: #fff; display:flex; align-items:center; justify-content:center; box-shadow: 0 18px 34px rgba(0,0,0,.22); cursor:pointer; z-index: 220; }
 .support-fab:hover{ background: #000; border-color: rgba(255,255,255,.18); }
 .support-fab-ico{ font-weight: 900; font-size: 12px; letter-spacing: .4px; }
 .support-fab-badge{ position:absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #ef4444; color: #fff; font-size: 11px; font-weight: 900; display:none; align-items:center; justify-content:center; border: 2px solid #fff; }
 .support-fab.has-unread .support-fab-badge{ display:inline-flex; }

 .support-panel{ position: fixed; right: 18px; bottom: 86px; width: 360px; max-width: calc(100vw - 36px); height: 460px; max-height: calc(100vh - 140px); border-radius: 16px; border: 1px solid rgba(17,17,17,.12); background: #fff; box-shadow: 0 18px 40px rgba(0,0,0,.20); overflow:hidden; z-index: 220; display:flex; flex-direction:column; }
 .support-panel[hidden]{ display:none; }
 .support-panel-head{ background: #111; color: #fff; padding: 12px 12px; display:flex; align-items:center; justify-content:space-between; gap: 10px; }
 .support-panel-title{ font-weight: 900; font-size: 13px; letter-spacing: .2px; }
 .support-panel-close{ border: 0; background: transparent; color: #fff; font-size: 18px; line-height: 1; cursor:pointer; width: 32px; height: 32px; border-radius: 10px; display:inline-flex; align-items:center; justify-content:center; }
 .support-panel-close:hover{ background: rgba(255,255,255,.10); }
 .support-panel-body{ flex: 1 1 auto; padding: 12px; overflow:auto; background: #f6f7f8; display:flex; flex-direction:column; gap: 8px; }
 .support-bubble{ max-width: 78%; padding: 10px 12px; border-radius: 14px; font-size: 13px; line-height: 1.35; white-space: pre-wrap; word-break: break-word; border: 1px solid rgba(17,17,17,.10); background: #fff; color: rgba(17,17,17,.92); }
 .support-bubble.is-admin{ align-self:flex-start; }
 .support-bubble.is-user{ align-self:flex-end; background: #111; color: #fff; border-color: #111; }
 .support-panel-form{ padding: 10px 12px; border-top: 1px solid rgba(17,17,17,.10); background: #fff; display:flex; flex-direction:column; gap: 8px; }
 .support-panel-fields{ display:grid; grid-template-columns: 1fr; gap: 8px; }
 .support-panel-actions{ display:flex; align-items:center; justify-content:space-between; gap: 10px; }
 .support-panel-hint{ font-size: 12px; min-height: 16px; color: rgba(17,17,17,.70); }

 @media (max-width: 980px){
   .support-admin{ grid-template-columns: 1fr; }
   .support-admin-list{ max-height: 280px; }
 }

 .admin-actions{ margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
 .admin-action{ display: flex; align-items: center; justify-content: center; height: 46px; border-radius: 14px; border: 1px solid rgba(17,17,17,.10); background: #fff; font-weight: 900; color: rgba(17,17,17,.88); transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
 .admin-action:hover{ transform: translateY(-1px); box-shadow: 0 12px 22px rgba(0,0,0,.08); background: #fff; }

 .admin-shell .btn-solid{
   background: #111;
   border-color: #111;
   color: #fff;
 }
 .admin-shell .btn-solid:hover{ background: #000; border-color: #000; }

 .admin-shell .btn-ghost{
   background: #fff;
   border-color: rgba(17,17,17,.16);
   color: #111;
 }

 .admin-shell .admin-action{
   background: #111;
   border-color: #111;
   color: #fff;
 }
 .admin-shell .admin-action:hover{ background: #000; border-color: #000; }

 .auth-check{ margin-top: 14px; display:flex; gap: 10px; align-items:flex-start; }
 .auth-check-input{ margin-top: 2px; }
 .auth-check-text{ font-size: 12px; color: rgba(17,17,17,.78); line-height: 1.35; }

 .auth-actions{ margin-top: 16px; display:flex; flex-direction:column; gap: 10px; }
 .auth-submit{ width: 100%; background: #111; border-color: #111; color: #fff; }
 .auth-submit:hover{ background: #000; border-color: #000; }
 .auth-secondary{ width: 100%; }

 .cat-tiles{
   display:flex;
   align-items:flex-start;
   justify-content: space-between;
   gap: 26px;
   padding: 6px 0;
   overflow:auto;
   scrollbar-width: none;
 }
 .cat-tiles::-webkit-scrollbar{ display:none; }

 .cat-tile{
   flex: 0 0 auto;
   width: 128px;
   display:flex;
   flex-direction:column;
   align-items:center;
   gap: 8px;
   transition: transform .18s ease;
 }

 .cat-tile-img{
   width: 110px;
   height: 80px;
   border-radius: 8px;
   box-shadow: 0 10px 18px rgba(0,0,0,.10);
   background:
     radial-gradient(60px 32px at 30% 35%, rgba(255,255,255,.22), transparent 62%),
     linear-gradient(135deg, rgba(17,17,17,.08), rgba(17,17,17,.02));
   transition: transform .22s ease, box-shadow .22s ease;
 }

 .cat-tile-label{
   font-size: 13px;
   font-weight: 600;
   color: rgba(17,17,17,.88);
   text-align:center;
   line-height: 1.2;
 }

 .cat-tile:hover{ transform: translateY(-2px); }
 .cat-tile:hover .cat-tile-img{
   transform: translateY(-2px) scale(1.03);
   box-shadow: 0 14px 24px rgba(0,0,0,.14);
 }

 .cat-tile-img--1{
   background-image: url("../../img/kato/karısik.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .cat-tile-img--2{
   background-image: url("../../img/kato/kuru.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .cat-tile-img--3{
   background-image: url("../../img/kato/leblebi.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .cat-tile-img--4{
   background-image: url("../../img/kato/ceko.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .cat-tile-img--5{
   background-image: url("../../img/kato/kahve.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .cat-tile-img--6{
   background-image: url("../../img/kato/avantaj.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .cat-tile-img--7{ background-image: radial-gradient(60px 32px at 30% 35%, rgba(255,255,255,.22), transparent 62%), linear-gradient(135deg, #496e2f, #d8e5c2); }
 .cat-tile-img--8{ background-image: radial-gradient(60px 32px at 30% 35%, rgba(255,255,255,.22), transparent 62%), linear-gradient(135deg, #777, #e7e7e7); }

 .carousel-head{
   margin-bottom: 12px;
   display:flex;
   align-items:flex-start;
   justify-content:space-between;
   gap: 16px;
 }
 .carousel-title .section-title{ margin: 0; }
 .carousel-subtitle{
   margin-top: 6px;
   color: var(--muted);
   font-size: 13px;
   max-width: 72ch;
 }
 .carousel-controls{ display:flex; gap: 10px; }
 .carousel-btn{
   width: 38px;
   height: 38px;
   border-radius: 999px;
   border: 1px solid var(--line);
   background: #fff;
   box-shadow: 0 10px 18px rgba(0,0,0,.08);
   display:inline-flex;
   align-items:center;
   justify-content:center;
   cursor:pointer;
   transition: transform .15s ease, box-shadow .15s ease;
 }
 .carousel-btn:hover{ transform: translateY(-1px); box-shadow: 0 14px 22px rgba(0,0,0,.10); }
 .carousel-btn:disabled{ opacity: .45; cursor:not-allowed; transform:none; box-shadow: 0 10px 18px rgba(0,0,0,.05); }

 .carousel{ position:relative; }
 .carousel-track{
   display:flex;
   gap: 30px;
   overflow:auto;
   padding: 2px 2px 8px;
   scroll-snap-type: x mandatory;
   scrollbar-width: none;
 }
 .carousel-track::-webkit-scrollbar{ display:none; }

 .p-card{
   flex: 0 0 270px;
   scroll-snap-align: start;
   border-radius: var(--radius-lg);
   border: 1px solid var(--line);
   background: #fff;
   overflow:hidden;
   box-shadow: 0 12px 24px rgba(0,0,0,.08);
   transition: transform .18s ease, box-shadow .18s ease;
 }
 .p-card:hover{
   transform: translateY(-4px) scale(1.01);
   box-shadow: 0 16px 30px rgba(0,0,0,.12);
 }
 .p-media{ display:block; }
 .p-img{
   height: 178px;
   background: radial-gradient(160px 110px at 35% 40%, rgba(255,255,255,.25), transparent 62%),
     linear-gradient(135deg, rgba(27,142,74,.25), rgba(0,0,0,0));
   transition: transform .22s ease;
 }
 img.p-img{
   width: 100%;
   height: 178px;
   display: block;
   object-fit: cover;
   object-position: center;
 }
 .p-card:hover .p-img{ transform: scale(1.05); }
 .p-img--1{
   background-image: url("../../img/urn/kaju.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--2{
   background-image: url("../../img/urn/ceviz.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--3{
   background-image: url("../../img/urn/antep.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--4{
   background-image: url("../../img/urn/badem.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--5{
   background-image: url("../../img/kato/cekirdek.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--6{
   background-image: url("../../img/kato/tuzlu.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--7{
   background-image: url("../../img/kato/soslu.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .p-img--8{
   background-image: url("../../img/kato/kabak.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }

 .p-body{ padding: 12px; }
 .p-title{ font-weight: 700; font-size: 12px; }

 .p-variants{ margin-top: 10px; display:flex; gap: 8px; flex-wrap:wrap; }
 .p-pill{
   height: 26px;
   padding: 0 10px;
   border-radius: 8px;
   border: 1px solid rgba(17,17,17,.12);
   background: #fff;
   font-size: 11px;
   cursor:pointer;
 }
 .p-pill.is-active{
   border-color: rgba(17,17,17,.55);
   background: #111;
   color: #fff;
 }

 .p-meta{ margin-top: 10px; display:flex; align-items:center; justify-content:space-between; gap: 10px; }
 .p-stars{ color: #f5b301; font-size: 12px; letter-spacing: .8px; display:flex; align-items:center; gap: 6px; }
 .p-rating{ color: rgba(17,17,17,.72); font-weight: 700; font-size: 11px; letter-spacing: 0; }

 .p-price{ margin-top: 6px; font-weight: 900; font-size: 16px; }

 .p-actions{ margin-top: 10px; display:flex; gap: 10px; }
 .p-btn{
   height: 32px;
   padding: 0 12px;
   border-radius: 999px;
   border: 1px solid rgba(17,17,17,.12);
   font-size: 11px;
   font-weight: 800;
   cursor:pointer;
   flex: 1;
 }
 .p-btn--add{ background: #111; border-color: #111; color: #fff; }
 .p-btn--add:hover{ background: #000; border-color: #000; }
 .p-btn--buy{ background: #fff; border-color: rgba(17,17,17,.55); color: #111; }
 .p-btn--buy:hover{ background: rgba(17,17,17,.06); }

 .products{
   display:grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 14px;
 }
 .products-tight{ grid-template-columns: repeat(4, 1fr); }

 .crumbs{
   display:flex;
   flex-wrap:wrap;
   gap: 8px;
   align-items:center;
   font-size: 12px;
   color: rgba(17,17,17,.65);
   margin-bottom: 12px;
 }
 .crumbs a{ color: rgba(17,17,17,.78); font-weight: 700; }
 .crumbs a:hover{ text-decoration: underline; }

 .pd-grid{
   display:grid;
   grid-template-columns: 70px minmax(0, 1.2fr) minmax(0, 1fr);
   gap: 16px;
   align-items:start;
 }
 .pd-thumbs{ display:flex; flex-direction:column; gap: 10px; }
 .pd-thumb{
   width: 70px;
   height: 70px;
   border-radius: 14px;
   border: 1px solid rgba(17,17,17,.12);
   background: #fff;
   padding: 0;
   overflow:hidden;
   cursor:pointer;
 }
 .pd-thumb.is-active{ border-color: rgba(17,17,17,.55); box-shadow: 0 10px 24px rgba(0,0,0,.10); }
 .pd-thumb img{ width:100%; height:100%; object-fit: cover; display:block; }
 .pd-thumb-ph{ width:100%; height:100%; display:block; background: radial-gradient(30px 22px at 35% 40%, rgba(17,17,17,.10), transparent 62%), linear-gradient(135deg, rgba(17,17,17,.10), rgba(17,17,17,.04)); }

 .pd-hero{
   border-radius: 18px;
   border: 1px solid rgba(17,17,17,.10);
   background: #fff;
   overflow:hidden;
   box-shadow: 0 16px 30px rgba(0,0,0,.10);
 }
 .pd-hero-img{ width:100%; height: 420px; object-fit: cover; display:block; }
 .pd-hero-ph{ height: 420px; background: radial-gradient(260px 190px at 35% 40%, rgba(17,17,17,.12), transparent 62%), linear-gradient(135deg, rgba(17,17,17,.10), rgba(17,17,17,.04)); }

 .pd-info{
   background: #fff;
   border: 1px solid rgba(17,17,17,.10);
   border-radius: 18px;
   padding: 16px;
   box-shadow: 0 16px 30px rgba(0,0,0,.08);
 }
 .pd-title{ margin: 0; font-size: 18px; font-weight: 900; }
 .pd-price{ margin-top: 10px; font-weight: 900; font-size: 18px; }
 .pd-label{ margin-top: 14px; font-size: 12px; font-weight: 900; color: rgba(17,17,17,.70); letter-spacing: .2px; }
 .pd-variants{ margin-top: 10px; display:flex; gap: 10px; flex-wrap:wrap; }

 .pd-actions{ margin-top: 14px; display:flex; align-items:center; gap: 12px; flex-wrap:wrap; }
 .pd-qty{
   display:flex;
   align-items:center;
   gap: 8px;
   border: 1px solid rgba(17,17,17,.14);
   background: #fff;
   border-radius: 999px;
   padding: 6px;
 }
 .pd-qty button{
   width: 34px;
   height: 34px;
   border-radius: 999px;
   border: 1px solid rgba(17,17,17,.14);
   background: #fff;
   font-weight: 900;
   cursor:pointer;
 }
 .pd-qty button:hover{ background: rgba(17,17,17,.06); }
 .pd-qty input{
   width: 44px;
   height: 34px;
   border: none;
   outline: none;
   text-align:center;
   font-weight: 900;
   background: transparent;
 }

 .pd-add{
   height: 44px;
   padding: 0 18px;
   border-radius: 999px;
   border: 1px solid #111;
   background: #111;
   color: #fff;
   font-weight: 900;
   cursor:pointer;
   flex: 1;
   min-width: 200px;
 }
 .pd-add:hover{ background: #000; border-color: #000; }

 .pd-desc{ margin-top: 16px; border-top: 1px solid rgba(17,17,17,.10); padding-top: 14px; }
 .pd-desc-text{ font-size: 12px; color: rgba(17,17,17,.70); line-height: 1.55; }
 .product{
   overflow:hidden;
   border-radius: var(--radius-lg);
   border: 1px solid var(--line);
   background: #fff;
   transition: transform .15s ease, box-shadow .15s ease;
 }
 .product:hover{ transform: translateY(-3px); box-shadow: 0 10px 22px rgba(0,0,0,.08); }
 .product-media{ position:relative; display:block; background: #fff; }
 .product-img{
   height: 170px;
   background: radial-gradient(140px 90px at 30% 35%, rgba(27,142,74,.14), transparent 62%), linear-gradient(180deg, rgba(17,17,17,.03), rgba(17,17,17,.00));
 }
 img.product-img{
   width: 100%;
   height: 170px;
   display: block;
   object-fit: cover;
 }
 .product-badge{
   position:absolute;
   top: 10px;
   left: 10px;
   height: 26px;
   padding: 0 10px;
   border-radius: 999px;
   background: #111;
   color:#fff;
   font-size: 12px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
 }
 .product-body{ padding: 12px; }
 .product-name{ font-weight: 700; }
 .product-row{ margin-top: 10px; display:flex; justify-content:space-between; align-items:center; gap: 10px; }
 .product-price{ font-weight: 800; }
 .product-link{ color: var(--accent); font-weight: 800; font-size: 13px; }

 .gift-section{
   margin-top: 18px;
   padding: 26px 0 30px;
   background: var(--bg);
 }
 .gift-head{ margin-bottom: 16px; }
 .gift-title{ margin: 0; color: var(--text); font-size: 20px; font-weight: 800; }

 .gift-grid{
   display:grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 18px;
 }

 .gift-card{
   text-align:center;
   color: var(--text);
 }
 .gift-media{
   height: 190px;
   border-radius: 12px;
   overflow:hidden;
   display:flex;
   align-items:flex-start;
   justify-content:center;
   padding: 16px;
   box-shadow: 0 14px 28px rgba(0,0,0,.28);
   transition: transform .18s ease, box-shadow .18s ease;
 }
 .gift-card:hover .gift-media{
   transform: translateY(-4px) scale(1.02);
   box-shadow: 0 18px 34px rgba(0,0,0,.34);
 }
 .gift-media-text{
   color: rgba(255,255,255,.95);
   font-weight: 700;
   font-size: 14px;
   line-height: 1.25;
   text-shadow: 0 2px 10px rgba(0,0,0,.35);
 }
 .gift-media--1{
   background-image:
     linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.42)),
     url("../../img/kato/hediye_1.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .gift-media--2{
   background-image:
     linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.42)),
     url("../../img/kato/hediye_2.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }
 .gift-media--3{
   background-image:
     linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.42)),
     url("../../img/kato/hediye_3.png");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
 }

 .gift-desc{
   margin-top: 10px;
   font-size: 12px;
   color: var(--muted);
 }
 .gift-cta{ margin-top: 14px; display:flex; justify-content:center; }
 .gift-btn{
   height: 32px;
   padding: 0 18px;
   border-radius: 999px;
   border: 1px solid rgba(17,17,17,.14);
   background: #fff;
   color: var(--text);
   font-weight: 800;
   font-size: 11px;
   cursor:pointer;
 }
 .gift-btn:hover{ background: var(--soft); }

 .testimonial-grid{
   display:grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 12px;
 }
 .testimonial{
   border-radius: var(--radius-lg);
   border: 1px solid var(--line);
   background: #fff;
   padding: 14px;
 }
 .testimonial:hover{ background: var(--soft); }
 .testimonial-stars{ color: #f5b301; letter-spacing: 1px; font-size: 14px; }
 .testimonial-text{ margin-top: 10px; color: var(--muted); font-size: 13px; }
 .testimonial-who{ margin-top: 12px; font-weight: 800; font-size: 13px; }

 .promo-split{ padding: 18px 0 6px; }
 .promo-grid{
   display:grid;
   grid-template-columns: 2fr 1fr;
   gap: 14px;
 }
 .promo-card{
   border-radius: var(--radius-lg);
   overflow:hidden;
   border: 1px solid rgba(17,17,17,.08);
   box-shadow: 0 16px 34px rgba(0,0,0,.10);
 }

 .promo-card--app{
   background:
     radial-gradient(620px 260px at 65% 30%, rgba(255,255,255,.10), transparent 62%),
     linear-gradient(135deg, #141518 0%, #090a0c 100%);
 }
 .promo-card--app{
   display:grid;
   grid-template-columns: 1.25fr .9fr;
   align-items:stretch;
 }
 .promo-app{ padding: 26px; }
 .promo-kicker{ font-weight: 900; letter-spacing: .8px; color: rgba(255,255,255,.78); }
 .promo-title{ margin: 6px 0 0; font-size: 28px; line-height: 1.05; color: #fff; }
 .promo-text{ margin-top: 10px; color: rgba(255,255,255,.80); font-size: 13px; max-width: 56ch; }

 .promo-stores{ margin-top: 18px; display:flex; gap: 12px; flex-wrap:wrap; }
 .store-btn{
   height: 34px;
   padding: 0 16px;
   border-radius: 999px;
   border: 1px solid rgba(255,255,255,.16);
   background: rgba(255,255,255,.06);
   color: rgba(255,255,255,.92);
   display:inline-flex;
   align-items:center;
   gap: 8px;
   font-weight: 800;
   font-size: 12px;
 }
 .store-btn:hover{ background: rgba(255,255,255,.10); }
 .store-btn.is-disabled{ opacity: .55; pointer-events: none; filter: grayscale(1); }
 .store-ico{ font-size: 14px; line-height: 1; }

 .promo-phone{
   position:relative;
   display:flex;
   align-items:center;
   justify-content:center;
   padding: 26px;
   background: transparent;
   border-left: 1px solid rgba(255,255,255,.10);
 }
 .promo-logo{
   width: min(360px, 100%);
   height: 200px;
   display:block;
   background: rgba(255,255,255,.95);
   -webkit-mask: url("../../img/logo.png") center / contain no-repeat;
   mask: url("../../img/logo.png") center / contain no-repeat;
   opacity: .98;
 }
 .promo-card--app{ position:relative; }
 .promo-card--app::after{
   content:"";
   position:absolute;
   left: -8%;
   right: -8%;
   bottom: -28px;
   height: 110px;
   display:none;
   background: transparent;
   border-radius: 999px;
   transform: rotate(-2deg);
   opacity: .70;
 }
 .promo-phone::before{ display:none; }

 .promo-card--corp{
   background:
     radial-gradient(520px 240px at 20% 15%, rgba(255,255,255,.08), transparent 60%),
     linear-gradient(135deg, #141518 0%, #090a0c 100%);
   color: rgba(255,255,255,.92);
   display:grid;
   grid-template-rows: auto 1fr;
 }
 .promo-corp{ padding: 18px; }
 .promo-corp-title{ margin: 0; font-size: 16px; font-weight: 900; }
 .promo-corp-text{ margin-top: 8px; color: rgba(255,255,255,.78); font-size: 12px; max-width: 40ch; }
 .promo-corp-btn{
   margin-top: 14px;
   height: 34px;
   padding: 0 16px;
   border-radius: 999px;
   border: 1px solid rgba(255,255,255,.16);
   background: rgba(255,255,255,.06);
   color: rgba(255,255,255,.95);
   font-weight: 900;
   font-size: 12px;
   cursor:pointer;
 }
 .promo-corp-btn:hover{ background: rgba(255,255,255,.10); }
 .promo-corp-media{
   position:relative;
   display:flex;
   align-items:flex-end;
   justify-content:flex-end;
   padding: 14px;
 }
 .promo-corp-media::before{
   content:"";
   position:absolute;
   inset: 0;
   background:
     radial-gradient(420px 220px at 70% 20%, rgba(255,255,255,.08), transparent 62%),
     linear-gradient(180deg, rgba(255,255,255,.00), rgba(255,255,255,.05));
 }
 .promo-corp-media::after{
   content:"";
   position:relative;
   width: 180px;
   height: 140px;
   border-radius: 16px;
   background:
     radial-gradient(120px 70px at 35% 30%, rgba(255,255,255,.22), transparent 62%),
     linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
   border: 1px solid rgba(255,255,255,.10);
   box-shadow: 0 18px 30px rgba(0,0,0,.22);
 }

 .trust-grid{
   display:grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 12px;
 }
 .trust-card{
   border-radius: var(--radius-lg);
   border: 1px solid var(--line);
   background: #fff;
   padding: 14px;
 }
 .trust-card:hover{ background: var(--soft); }
 .trust-ico{ font-size: 22px; }
 .trust-title{ margin-top: 10px; font-weight: 800; }
 .trust-text{ margin-top: 6px; color: var(--muted); font-size: 13px; }

 .footer{
   margin-top: 22px;
   background: #1b1d20;
   color: rgba(255,255,255,.92);
 }

 .footer-top{ padding: 44px 0 34px; background: #1b1d20; }
 .footer-top-inner{
   display:grid;
   grid-template-columns: 1.2fr 2.2fr;
   gap: 44px;
   align-items:start;
 }

 .footer-logo{
   display:inline-flex;
   align-items:center;
   gap: 8px;
 }
 .footer-logo-mark{
   width: 150px;
   height: 48px;
   display:block;
   background: rgba(255,255,255,.95);
   -webkit-mask: url("../../img/logo.png") center / contain no-repeat;
   mask: url("../../img/logo.png") center / contain no-repeat;
 }
 .footer-logo-name{ font-weight: 900; font-size: 26px; letter-spacing: .2px; }
 .footer-logo-dot{
   height: 18px;
   padding: 0 10px;
   border-radius: 999px;
   background: rgba(255,255,255,.06);
   border: 1px solid rgba(255,255,255,.16);
   color: rgba(255,255,255,.92);
   font-size: 11px;
   font-weight: 900;
   display:inline-flex;
   align-items:center;
 }

 .footer-tagline{ margin-top: 14px; color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.5; }

 .footer-actions{ margin-top: 18px; display:flex; gap: 12px; flex-wrap:wrap; }
 .footer-action-btn{
   height: 34px;
   padding: 0 16px;
   border-radius: 999px;
   border: 1px solid rgba(255,255,255,.28);
   color: rgba(255,255,255,.92);
   font-weight: 800;
   font-size: 12px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   background: rgba(0,0,0,.10);
 }
 .footer-action-btn:hover{ background: rgba(0,0,0,.18); }

 .footer-follow-title{
   margin-top: 22px;
   font-weight: 900;
   font-size: 11px;
   letter-spacing: .8px;
   text-transform: uppercase;
   color: rgba(255,255,255,.84);
 }
 .footer-social{ margin-top: 10px; display:flex; gap: 10px; }
 .social-btn{
   width: 38px;
   height: 30px;
   border-radius: 999px;
   border: 1px solid rgba(255,255,255,.22);
   display:inline-flex;
   align-items:center;
   justify-content:center;
   background: rgba(0,0,0,.10);
   color: rgba(255,255,255,.92);
   font-weight: 900;
   font-size: 12px;
 }
 .social-btn:hover{ background: rgba(0,0,0,.18); }

 .footer-cols{
   display:grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 34px;
 }
 .footer-col{ display:flex; flex-direction:column; gap: 10px; }
 .footer-col-title{ font-weight: 900; font-size: 11px; letter-spacing: .8px; text-transform: uppercase; color: rgba(255,255,255,.92); }
 .footer-link{ color: rgba(255,255,255,.70); font-weight: 600; font-size: 12px; }
 .footer-link:hover{ color: rgba(255,255,255,.95); }

 .footer-bar{ padding: 18px 0; background: #15171a; border-top: 1px solid rgba(255,255,255,.10); }
 .footer-bar-inner{
   display:grid;
   grid-template-columns: auto 1fr auto;
   gap: 18px;
   align-items:center;
 }
 .footer-pay{ display:flex; gap: 10px; align-items:center; }
 .pay-chip{
   height: 30px;
   padding: 0 12px;
   border-radius: 999px;
   background: rgba(0,0,0,.16);
   border: 1px solid rgba(255,255,255,.16);
   display:inline-flex;
   align-items:center;
   justify-content:center;
   font-weight: 900;
   font-size: 12px;
   letter-spacing: .4px;
 }

 .footer-legal{ color: rgba(255,255,255,.72); font-size: 10px; line-height: 1.45; }
 .footer-legal-text + .footer-legal-text{ margin-top: 6px; }

 .footer-qr{ display:flex; justify-content:flex-end; }
 .qr-box{
   position:relative;
   width: 78px;
   height: 78px;
   border-radius: 10px;
   display:flex;
   align-items:center;
   justify-content:center;
   background: rgba(255,255,255,.06);
   border: 1px solid rgba(255,255,255,.16);
 }
 .qr-box::before{
   content:"";
   width: 56px;
   height: 56px;
   display:block;
   background: rgba(255,255,255,.92);
   -webkit-mask: url("../../img/logo.png") center / contain no-repeat;
   mask: url("../../img/logo.png") center / contain no-repeat;
 }

 .footer-final{ background: #15171a; color: rgba(255,255,255,.72); }
 .footer-final-inner{ padding: 12px 0; text-align:center; font-size: 12px; font-weight: 700; }

 @media (max-width: 1100px){
   .cat-tiles{ gap: 18px; }
 }

 @media (max-width: 980px){
   .hero-entry-grid{ grid-template-columns: 1fr; }
   .hero-side{ grid-template-columns: 1fr 1fr; grid-template-rows: none; }
   .products{ grid-template-columns: repeat(2, 1fr); }
   .testimonial-grid{ grid-template-columns: 1fr; }
   .trust-grid{ grid-template-columns: 1fr; }
   .gift-grid{ grid-template-columns: 1fr 1fr; }
   .promo-grid{ grid-template-columns: 1fr; }
   .promo-card--app{ grid-template-columns: 1fr; }
   .promo-phone{ min-height: 240px; }
   .footer-top-inner{ grid-template-columns: 1fr; gap: 28px; }
   .footer-cols{ grid-template-columns: 1fr 1fr; }
   .footer-bar-inner{ grid-template-columns: 1fr; }
   .footer-qr{ justify-content:flex-start; }
 }

 @media (max-width: 720px){
   .topbar-inner{ flex-direction:column; justify-content:center; align-items:flex-start; padding: 8px 0; }
   .topbar-inner{ grid-template-columns: 1fr; justify-items:start; }
   .topbar-item--center{ justify-self:start; }
   .topbar-item--right{ justify-self:start; }

   .header-shell{ left: 0; top: 0; }
   .header-pill{ grid-template-columns: 1fr; border-radius: 22px; }
   .header-pill::before{ left: 0; border-radius: 22px; }
   .brand{ min-width: 0; }
   .cats{ display:none; }
   .action-txt{ display:none; }
   .header-actions .icon-btn{ display:inline-flex; }

   .nav{ display:none; }
   .mobile-drawer{ display:none; }
   .mobile-drawer.is-open{ display:block; }

   .cat-tiles{ gap: 14px; }
   .cat-tile{ width: 118px; }
   .cat-tile-img{ width: 102px; height: 74px; }
   .products{ grid-template-columns: 1fr; }
   .gift-grid{ grid-template-columns: 1fr; }
   .promo-app{ padding: 18px; }
   .promo-title{ font-size: 24px; }
   .promo-phone{ min-height: 220px; }
   .footer-cols{ grid-template-columns: 1fr; }
 }