:root{
  --bg:#08090A;
  --panel:#101113;
  --panel2:#151619;
  --line:rgba(255,255,255,.09);
  --text:#F7F7F5;
  --muted:#96999F;
  --soft:#C7C9CC;
  --white:#fff;
}

*{box-sizing:border-box}

html{
  background:var(--bg);
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:
    radial-gradient(circle at 75% 5%,rgba(255,255,255,.055),transparent 26rem),
    var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit}

header{
  height:78px;
  padding:0 max(28px,calc((100% - 1440px)/2));
  display:flex;
  align-items:center;
  justify-content:space-between;
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(8,9,10,.78);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}

.logo{
  color:#fff;
  text-decoration:none;
  font-size:19px;
  font-weight:800;
  letter-spacing:.18em;
}

.logo b{
  color:#8E9298;
  font-weight:500;
}

nav{
  display:flex;
  align-items:center;
  gap:30px;
}

nav a{
  color:#B8BABE;
  text-decoration:none;
  font-size:13px;
  font-weight:600;
  letter-spacing:.04em;
  transition:.25s ease;
}

nav a:hover{color:#fff}

main{
  max-width:1440px;
  margin:auto;
  padding:32px 28px 100px;
}

.hero{
  min-height:72vh;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:clamp(40px,7vw,100px);
  margin-bottom:80px;
  border:1px solid var(--line);
  border-radius:30px;
  background:
    radial-gradient(circle at 78% 22%,rgba(255,255,255,.12),transparent 27%),
    linear-gradient(135deg,#17191c 0%,#0b0c0e 42%,#050506 100%);
  box-shadow:0 40px 100px rgba(0,0,0,.42);
}

.hero:before{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  right:-100px;
  top:-160px;
  border-radius:50%;
  background:rgba(255,255,255,.045);
  filter:blur(10px);
}

.hero>*{
  position:relative;
  z-index:2;
}

.hero>p:first-child{
  margin:0 0 20px;
  color:#999DA3;
  font-size:12px;
  font-weight:700;
  letter-spacing:.24em;
  text-transform:uppercase;
}

.hero h1{
  max-width:1050px;
  margin:0 0 24px;
  font-size:clamp(52px,7.4vw,108px);
  line-height:.91;
  letter-spacing:-.055em;
  font-weight:800;
  text-transform:uppercase;
}

.hero h1 span{
  color:#777B81;
}

.hero p{
  max-width:650px;
  margin:0 0 34px;
  color:#A9ACB1;
  font-size:17px;
  line-height:1.7;
}

.btn,.ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  min-height:50px;
  padding:0 24px;
  border-radius:999px;
  border:1px solid transparent;
  font-size:13px;
  font-weight:750;
  letter-spacing:.03em;
  text-decoration:none;
  cursor:pointer;
  transition:.25s ease;
}

.btn{
  background:#F4F4F2;
  color:#090A0B;
}

.btn:hover{
  background:#fff;
  transform:translateY(-2px);
  box-shadow:0 12px 35px rgba(255,255,255,.12);
}

.ghost{
  margin-left:8px;
  background:transparent;
  color:#fff;
  border-color:var(--line);
}

section{margin-bottom:70px}

section h1,section h2{
  letter-spacing:-.04em;
}

section h1{
  font-size:clamp(38px,5vw,68px);
  margin:10px 0 30px;
}

section h2{
  font-size:clamp(28px,3.5vw,48px);
  margin:0 0 28px;
}

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

.card{
  min-height:300px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:24px;
  color:#fff;
  text-decoration:none;
  background:
    radial-gradient(circle at 75% 15%,rgba(255,255,255,.07),transparent 35%),
    var(--panel);
  border:1px solid var(--line);
  border-radius:22px;
  transition:transform .35s ease,border-color .35s ease,background .35s ease;
}

.card:hover{
  transform:translateY(-7px);
  border-color:rgba(255,255,255,.2);
  background-color:#151619;
}

.card span{
  color:#777B81;
  font-size:11px;
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.card h3{
  flex:1;
  margin:22px 0;
  font-size:19px;
  line-height:1.35;
  letter-spacing:-.025em;
}

.card b{
  font-size:22px;
  letter-spacing:-.03em;
}

.card small{
  margin-top:7px;
  color:#777B81;
}

.crumbs{
  margin:10px 0 26px;
  color:#6F7379;
  font-size:12px;
}

.crumbs a{
  color:#AEB1B5;
  text-decoration:none;
}

.search{
  display:flex;
  gap:10px;
  max-width:850px;
  margin:20px 0 38px;
}

.search input,
.product select,
.checkout input,
.checkout select,
.checkout textarea,
.modalbox input{
  width:100%;
  padding:15px 16px;
  color:#fff;
  background:#111214;
  border:1px solid var(--line);
  border-radius:12px;
  outline:none;
}

.search input:focus,
.checkout input:focus,
.checkout select:focus,
.checkout textarea:focus{
  border-color:rgba(255,255,255,.32);
}

.search button{
  padding:0 25px;
  color:#08090A;
  background:#fff;
  border:0;
  border-radius:12px;
  font-weight:750;
  cursor:pointer;
}

.product{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:60px;
  padding:38px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:28px;
}

.gallery{
  display:grid;
  gap:12px;
}

.gallery img{
  width:100%;
  max-height:620px;
  object-fit:contain;
  padding:18px;
  background:#0B0C0D;
  border:1px solid var(--line);
  border-radius:20px;
}

.photo{
  min-height:520px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#555960;
  background:#0B0C0D;
  border:1px solid var(--line);
  border-radius:20px;
  font-size:36px;
  font-weight:900;
  letter-spacing:.08em;
}

.product h1{
  margin-top:0;
  font-size:clamp(34px,4vw,58px);
  line-height:1.02;
}

.bigprice{
  margin:25px 0;
  font-size:34px;
  font-weight:800;
}

.qty{
  display:flex;
  width:156px;
  margin:18px 0;
}

.qty button,.qty input{
  width:52px;
  height:46px;
  color:#fff;
  text-align:center;
  background:#111214;
  border:1px solid var(--line);
}

.specs{
  max-width:900px;
  overflow:hidden;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:18px;
}

.specs div{
  display:grid;
  grid-template-columns:1fr 1fr;
  padding:15px 18px;
  border-bottom:1px solid var(--line);
}

.specs span{color:#85898F}

.checkout{
  max-width:700px;
  padding:30px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:24px;
}

.checkout label{
  display:block;
  margin-bottom:9px;
  font-weight:650;
}

.checkout textarea{resize:vertical}

.ordersummary{
  display:flex;
  justify-content:space-between;
  margin:14px 0 22px;
  padding:18px;
  background:#090A0B;
  border:1px solid var(--line);
  border-radius:14px;
  font-size:18px;
}

.cartrow{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:20px;
  align-items:center;
  margin-bottom:10px;
  padding:18px 20px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
}

.cartrow small{
  display:block;
  margin-top:6px;
  color:#777B81;
}

.cartrow button{
  width:36px;
  height:36px;
  color:#fff;
  background:#1B1C1F;
  border:1px solid var(--line);
  border-radius:50%;
}

.carttotal{
  padding:24px 0;
  text-align:right;
  font-size:24px;
}

.modal{
  display:none;
  position:fixed;
  inset:0;
  z-index:200;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(12px);
}

.modal.show{display:flex}

.modalbox{
  position:relative;
  width:min(460px,100%);
  padding:30px;
  background:#111214;
  border:1px solid var(--line);
  border-radius:24px;
  box-shadow:0 30px 100px #000;
}

.x{
  position:absolute;
  right:15px;
  top:12px;
  color:#fff;
  background:none;
  border:0;
  font-size:26px;
}

.success{
  padding:80px 30px;
  text-align:center;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:28px;
}

.successmark{
  width:72px;
  height:72px;
  display:grid;
  place-items:center;
  margin:0 auto 22px;
  color:#090A0B;
  background:#fff;
  border-radius:50%;
  font-size:34px;
}

.muted{
  color:#777B81;
  font-size:13px;
  line-height:1.6;
}

.suggest{
  position:relative;
  z-index:10;
  max-height:260px;
  overflow:auto;
  margin-top:-9px;
  margin-bottom:10px;
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:0 20px 50px #0008;
}

.suggest button{
  display:block;
  width:100%;
  padding:12px;
  color:#ddd;
  text-align:left;
  background:#121315;
  border:0;
  border-bottom:1px solid var(--line);
}

.suggest button:hover{background:#1A1B1E}

footer{
  padding:45px 24px;
  color:#666A70;
  text-align:center;
  background:#050506;
  border-top:1px solid var(--line);
  font-size:12px;
  letter-spacing:.08em;
}

@media(max-width:1000px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .product{gap:30px}
}

@media(max-width:760px){
  header{
    height:68px;
    padding:0 18px;
  }

  .logo{font-size:16px}

  nav{gap:15px}
  nav a{font-size:12px}
  nav a:nth-child(2),
  nav a:nth-child(3){display:none}

  main{padding:16px 14px 75px}

  .hero{
    min-height:72vh;
    margin-bottom:50px;
    padding:34px 24px;
    border-radius:22px;
  }

  .hero h1{
    font-size:clamp(46px,14vw,70px);
  }

  .hero p{font-size:15px}

  .product{
    grid-template-columns:1fr;
    gap:25px;
    padding:18px;
    border-radius:20px;
  }

  .photo{min-height:320px}

  .product h1{font-size:36px}
}

@media(max-width:540px){
  .grid{grid-template-columns:1fr}
  .card{min-height:240px}

  .search{
    display:grid;
    grid-template-columns:1fr;
  }

  .search button{height:48px}

  .cartrow{
    grid-template-columns:1fr auto;
  }

  .cartrow>button{
    grid-column:2;
    grid-row:1/3;
  }

  .checkout{padding:20px}

  .specs div{
    grid-template-columns:1fr;
    gap:5px;
  }
}

/* ===== BLACK PREMIUM HORECA HOME ===== */

.direction-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}

.direction{
  min-height:440px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:38px;
  color:#fff;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.09);
  border-radius:28px;
  background:#101113;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),
             border-color .4s ease;
}

.direction:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 75% 20%,
      rgba(255,255,255,.14),
      transparent 32%),
    linear-gradient(145deg,
      rgba(255,255,255,.055),
      transparent 45%);
  transition:transform .7s ease;
}

.direction:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    to top,
    rgba(0,0,0,.78),
    transparent 65%
  );
}

.direction:hover{
  transform:translateY(-6px);
  border-color:rgba(255,255,255,.22);
}

.direction:hover:before{
  transform:scale(1.08);
}

.direction>*{
  position:relative;
  z-index:2;
}

.direction small{
  position:absolute;
  top:-330px;
  color:#777b81;
  font-size:12px;
  letter-spacing:.18em;
}

.direction strong{
  font-size:clamp(42px,5vw,76px);
  line-height:.88;
  letter-spacing:-.055em;
}

.direction span{
  margin-top:22px;
  color:#96999f;
  font-size:13px;
}

.direction-hotel{
  background:
    radial-gradient(circle at 75% 18%,#33363a 0%,#151618 31%,#090a0b 72%);
}

.direction-restaurant{
  background:
    radial-gradient(circle at 70% 25%,#292b2e 0%,#121315 35%,#070708 75%);
}

.direction-spa{
  background:
    radial-gradient(circle at 75% 20%,#3b3b3b 0%,#18191a 32%,#090909 73%);
}

.direction-pro{
  background:
    radial-gradient(circle at 70% 22%,#303236 0%,#111214 34%,#060607 76%);
}

.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  margin-bottom:30px;
}

.section-head small,
.business-cta>small{
  display:block;
  margin-bottom:12px;
  color:#74787e;
  font-size:11px;
  font-weight:750;
  letter-spacing:.2em;
}

.section-head h2{
  max-width:700px;
  margin:0;
}

.section-head>a{
  padding-bottom:8px;
  color:#a7aaae;
  text-decoration:none;
  font-size:13px;
}

.section-head>a:hover{
  color:#fff;
}

.business-cta{
  min-height:500px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  overflow:hidden;
  padding:clamp(35px,6vw,80px);
  background:
    radial-gradient(circle at 80% 20%,
      rgba(255,255,255,.12),
      transparent 30%),
    linear-gradient(135deg,#151719,#08090a 65%);
  border:1px solid rgba(255,255,255,.1);
  border-radius:30px;
}

.business-cta:before{
  content:"";
  position:absolute;
  width:450px;
  height:450px;
  right:-80px;
  top:-160px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
}

.business-cta>*{
  position:relative;
  z-index:2;
}

.business-cta h2{
  max-width:950px;
  margin:0 0 24px;
  font-size:clamp(40px,6vw,82px);
  line-height:.95;
}

.business-cta p{
  max-width:620px;
  margin:0 0 30px;
  color:#999da3;
  line-height:1.7;
}

@media(max-width:760px){

  .direction-grid{
    grid-template-columns:1fr;
  }

  .direction{
    min-height:330px;
    padding:28px;
    border-radius:22px;
  }

  .direction small{
    top:-225px;
  }

  .direction strong{
    font-size:48px;
  }

  .section-head{
    display:block;
  }

  .section-head>a{
    display:inline-block;
    margin-top:18px;
  }

  .business-cta{
    min-height:430px;
    padding:32px 24px;
    border-radius:22px;
  }

  .business-cta h2{
    font-size:43px;
  }
}

/* ===== DOPOMOGA ONE HORECA MEGA MENU ===== */

.premium-header{
  position:sticky;
  top:0;
  z-index:1000;
  min-height:76px;
  display:flex;
  align-items:center;
  gap:34px;
  padding:0 4vw;
  background:rgba(8,9,10,.88);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.premium-header .logo{
  flex:0 0 auto;
}

.premium-nav{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:26px;
}

.premium-nav>a,
.catalog-trigger{
  color:#d8dadd;
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  letter-spacing:.09em;
  white-space:nowrap;
  transition:.2s ease;
}

.premium-nav>a:hover,
.catalog-trigger:hover{
  color:#fff;
}

.catalog-menu{
  position:static;
}

.catalog-trigger span{
  margin-left:5px;
}

.mega-menu{
  position:absolute;
  left:0;
  right:0;
  top:100%;
  padding:20px 4vw 32px;
  background:rgba(8,9,10,.98);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.10);
  box-shadow:0 30px 70px rgba(0,0,0,.55);
  opacity:0;
  visibility:hidden;
  transform:translateY(-8px);
  transition:.22s ease;
}

.catalog-menu:hover .mega-menu,
.catalog-menu:focus-within .mega-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.mega-inner{
  max-width:1500px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:32px;
}

.mega-column{
  min-width:0;
}

.mega-column strong{
  display:block;
  margin-bottom:18px;
  color:#fff;
  font-size:12px;
  letter-spacing:.12em;
}

.mega-column a{
  display:block;
  padding:6px 0;
  color:#8f949a;
  text-decoration:none;
  font-size:14px;
  line-height:1.35;
  transition:.18s ease;
}

.mega-column a:hover{
  color:#fff;
  transform:translateX(3px);
}

.header-actions{
  display:flex;
  align-items:center;
  gap:18px;
  flex:0 0 auto;
}

.header-actions a{
  color:#fff;
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
}

@media(max-width:1100px){

  .premium-nav{
    gap:14px;
  }

  .premium-nav>a{
    display:none;
  }

  .mega-inner{
    grid-template-columns:repeat(3,1fr);
  }
}

@media(max-width:760px){

  .premium-header{
    min-height:68px;
    padding:0 18px;
    gap:16px;
  }

  .premium-nav{
    justify-content:flex-start;
  }

  .catalog-trigger{
    font-size:11px;
  }

  .header-actions{
    margin-left:auto;
  }

  .header-actions a:first-child{
    display:none;
  }

  .mega-menu{
    position:fixed;
    top:68px;
    max-height:calc(100vh - 68px);
    overflow:auto;
    padding:24px 20px 40px;
  }

  .mega-inner{
    grid-template-columns:1fr 1fr;
    gap:28px 22px;
  }

  .mega-column a{
    font-size:13px;
  }
}

@media(max-width:480px){

  .mega-inner{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   DOPOMOGA ONE — BLACK PREMIUM HOME V2
   ========================================================= */

.hero{
  position:relative;
  min-height:78vh;
  padding:clamp(90px,12vw,170px) clamp(22px,6vw,96px) 70px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 76% 28%,rgba(255,255,255,.11),transparent 27%),
    radial-gradient(circle at 70% 55%,rgba(255,255,255,.045),transparent 36%),
    linear-gradient(120deg,#050607 0%,#0b0d0f 48%,#15181b 100%);
}

.hero:before{
  content:"";
  position:absolute;
  width:52vw;
  height:52vw;
  right:-12vw;
  top:-16vw;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  box-shadow:
    0 0 0 70px rgba(255,255,255,.018),
    0 0 0 150px rgba(255,255,255,.012);
  pointer-events:none;
}

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

.hero>p:first-child{
  margin:0 0 24px;
  font-size:11px;
  letter-spacing:.28em;
  font-weight:700;
  opacity:.58;
}

.hero h1{
  max-width:1200px;
  margin:0;
  font-size:clamp(52px,8.2vw,132px);
  line-height:.88;
  letter-spacing:-.065em;
  font-weight:600;
}

.hero h1 span{
  color:rgba(255,255,255,.34);
}

.hero h1+p{
  max-width:610px;
  margin:32px 0 36px;
  font-size:clamp(16px,1.45vw,21px);
  line-height:1.55;
  color:rgba(255,255,255,.62);
}

.hero .btn{
  align-self:flex-start;
}

/* DIRECTIONS */

.horeca-directions{
  padding:0;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.direction-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
}

.direction{
  min-height:420px;
  padding:38px 34px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
  text-decoration:none;
  color:#fff;
  background:#0b0d0f;
  border-right:1px solid rgba(255,255,255,.08);
  transition:background .35s ease,transform .35s ease;
}

.direction:last-child{
  border-right:0;
}

.direction:after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  right:-130px;
  bottom:-150px;
  background:rgba(255,255,255,.045);
  transition:transform .5s ease,background .5s ease;
}

.direction:hover{
  background:#121518;
}

.direction:hover:after{
  transform:scale(1.55);
  background:rgba(255,255,255,.075);
}

.direction small{
  font-size:11px;
  letter-spacing:.2em;
  opacity:.38;
}

.direction strong{
  position:relative;
  z-index:1;
  margin-top:auto;
  margin-bottom:24px;
  font-size:clamp(29px,2.8vw,47px);
  line-height:.94;
  letter-spacing:-.045em;
  font-weight:550;
}

.direction span{
  position:relative;
  z-index:1;
  font-size:13px;
  color:rgba(255,255,255,.48);
}

/* FEATURED PRODUCTS */

.featured-products{
  padding:110px clamp(22px,6vw,96px);
  background:#08090a;
}

.section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
  margin-bottom:48px;
}

.section-head small,
.business-cta>small{
  display:block;
  margin-bottom:14px;
  font-size:10px;
  letter-spacing:.25em;
  opacity:.42;
}

.section-head h2{
  max-width:720px;
  margin:0;
  font-size:clamp(34px,4.5vw,68px);
  line-height:.98;
  letter-spacing:-.045em;
  font-weight:550;
}

.section-head>a{
  color:rgba(255,255,255,.55);
  text-decoration:none;
  white-space:nowrap;
  padding-bottom:5px;
  border-bottom:1px solid rgba(255,255,255,.22);
}

.featured-products .grid{
  gap:1px;
  background:rgba(255,255,255,.08);
}

.featured-products .card{
  min-height:330px;
  padding:28px;
  border:0;
  border-radius:0;
  background:#0d0f11;
  display:flex;
  flex-direction:column;
  transition:background .25s ease,transform .25s ease;
}

.featured-products .card:hover{
  background:#14171a;
  transform:translateY(-3px);
}

.featured-products .card span{
  font-size:10px;
  letter-spacing:.13em;
  text-transform:uppercase;
  opacity:.4;
}

.featured-products .card h3{
  margin:20px 0 auto;
  font-size:21px;
  line-height:1.2;
  font-weight:500;
}

.featured-products .card b{
  margin-top:32px;
  font-size:18px;
}

.featured-products .card small{
  margin-top:8px;
  opacity:.45;
}

/* BUSINESS CTA */

.business-cta{
  min-height:620px;
  padding:110px clamp(22px,7vw,120px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 50%,rgba(255,255,255,.09),transparent 22%),
    linear-gradient(115deg,#111315,#08090a 72%);
  border-top:1px solid rgba(255,255,255,.08);
}

.business-cta:after{
  content:"D1";
  position:absolute;
  right:-2vw;
  bottom:-9vw;
  font-size:30vw;
  line-height:.8;
  font-weight:700;
  letter-spacing:-.1em;
  color:rgba(255,255,255,.018);
  pointer-events:none;
}

.business-cta h2{
  position:relative;
  z-index:1;
  max-width:1000px;
  margin:0;
  font-size:clamp(46px,6.7vw,105px);
  line-height:.91;
  letter-spacing:-.06em;
  font-weight:550;
}

.business-cta p{
  position:relative;
  z-index:1;
  max-width:590px;
  margin:32px 0;
  font-size:17px;
  line-height:1.6;
  color:rgba(255,255,255,.55);
}

.business-cta .btn{
  position:relative;
  z-index:1;
}

/* MOBILE */

@media(max-width:900px){
  .hero{
    min-height:72vh;
    padding:110px 20px 45px;
  }

  .hero h1{
    font-size:clamp(48px,14vw,78px);
  }

  .hero h1+p{
    margin:25px 0 30px;
  }

  .direction-grid{
    grid-template-columns:1fr 1fr;
  }

  .direction{
    min-height:290px;
    padding:25px 20px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  .direction strong{
    font-size:clamp(27px,7vw,40px);
  }

  .featured-products{
    padding:75px 20px;
  }

  .section-head{
    display:block;
  }

  .section-head>a{
    display:inline-block;
    margin-top:25px;
  }

  .business-cta{
    min-height:540px;
    padding:80px 20px;
  }

  .business-cta h2{
    font-size:clamp(45px,13vw,75px);
  }
}

@media(max-width:560px){
  .direction-grid{
    grid-template-columns:1fr;
  }

  .direction{
    min-height:230px;
  }

  .hero h1{
    letter-spacing:-.055em;
  }
}

/* ===== HORECA EQUIPMENT UNIVERSE — HOME V3 ===== */

.equipment-universe{
  padding:120px clamp(22px,6vw,96px);
  background:#0b0c0e;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.equipment-head{
  display:grid;
  grid-template-columns:1.4fr .6fr;
  gap:60px;
  align-items:end;
  margin-bottom:60px;
}

.equipment-head small,
.brand-stage small{
  display:block;
  margin-bottom:16px;
  font-size:10px;
  letter-spacing:.25em;
  opacity:.42;
}

.equipment-head h2{
  margin:0;
  font-size:clamp(45px,6vw,92px);
  line-height:.91;
  letter-spacing:-.055em;
  font-weight:550;
}

.equipment-head p{
  max-width:440px;
  margin:0;
  color:rgba(255,255,255,.5);
  line-height:1.65;
}

.equipment-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.1);
  border-left:1px solid rgba(255,255,255,.1);
}

.equipment-tile{
  min-height:260px;
  padding:28px;
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color:#fff;
  background:#0b0c0e;
  border-right:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.1);
  transition:background .3s ease;
}

.equipment-tile:hover{
  background:#15181b;
}

.equipment-tile small{
  font-size:10px;
  letter-spacing:.16em;
  opacity:.32;
}

.equipment-tile strong{
  margin:auto 0 20px;
  font-size:clamp(21px,2vw,31px);
  line-height:1.05;
  letter-spacing:-.035em;
  font-weight:500;
}

.equipment-tile span{
  font-size:12px;
  line-height:1.45;
  color:rgba(255,255,255,.43);
}

.brand-stage{
  min-height:580px;
  padding:100px clamp(22px,6vw,96px);
  display:grid;
  grid-template-columns:1fr 1fr;
  position:relative;
  overflow:hidden;
  background:#070809;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.brand-stage h2{
  max-width:760px;
  margin:0;
  font-size:clamp(42px,5vw,76px);
  line-height:.96;
  letter-spacing:-.05em;
  font-weight:550;
}

.brand-stage-name{
  align-self:center;
  justify-self:end;
  font-size:clamp(75px,11vw,175px);
  line-height:.72;
  text-align:right;
  letter-spacing:-.075em;
  font-weight:700;
  color:rgba(255,255,255,.08);
}

.brand-stage>p{
  position:absolute;
  left:clamp(22px,6vw,96px);
  bottom:80px;
  max-width:480px;
  color:rgba(255,255,255,.42);
}

@media(max-width:900px){
  .equipment-universe{
    padding:80px 20px;
  }

  .equipment-head{
    grid-template-columns:1fr;
    gap:25px;
  }

  .equipment-grid{
    grid-template-columns:1fr 1fr;
  }

  .equipment-tile{
    min-height:220px;
    padding:22px;
  }

  .brand-stage{
    min-height:520px;
    padding:75px 20px;
    grid-template-columns:1fr;
  }

  .brand-stage-name{
    justify-self:start;
    align-self:center;
    text-align:left;
  }

  .brand-stage>p{
    left:20px;
    bottom:55px;
  }
}

@media(max-width:520px){
  .equipment-grid{
    grid-template-columns:1fr;
  }

  .equipment-tile{
    min-height:180px;
  }
}

/* =========================================================
   DOPOMOGA ONE — CATALOG PRO V1
   ========================================================= */

.catalog-pro{
  padding:0 clamp(20px,5vw,80px) 120px;
  background:#08090a;
  min-height:100vh;
}

.catalog-hero{
  min-height:360px;
  padding:110px 0 55px;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:60px;
  align-items:end;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.catalog-hero small,
.catalog-side>small{
  display:block;
  margin-bottom:14px;
  font-size:10px;
  letter-spacing:.24em;
  color:rgba(255,255,255,.4);
}

.catalog-hero h1{
  margin:0;
  font-size:clamp(64px,9vw,145px);
  line-height:.78;
  letter-spacing:-.065em;
  font-weight:550;
}

.catalog-hero p{
  max-width:460px;
  margin:0;
  line-height:1.65;
  color:rgba(255,255,255,.5);
}

.catalog-toolbar{
  padding:24px 0;
  display:grid;
  grid-template-columns:minmax(260px,2fr) repeat(4,minmax(135px,1fr)) auto;
  gap:8px;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.catalog-search{
  min-height:52px;
  padding:0 16px;
  display:flex;
  align-items:center;
  gap:12px;
  background:#101214;
  border:1px solid rgba(255,255,255,.1);
}

.catalog-search span{
  font-size:24px;
  opacity:.45;
}

.catalog-search input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  font:inherit;
}

.catalog-search input::placeholder{
  color:rgba(255,255,255,.34);
}

.catalog-toolbar select,
.catalog-toolbar button{
  min-height:52px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:0;
  background:#101214;
  color:#fff;
  font:inherit;
  outline:none;
}

.catalog-toolbar button{
  padding:0 25px;
  cursor:pointer;
  background:#f3f3f1;
  color:#08090a;
  border-color:#f3f3f1;
  font-weight:650;
}

.catalog-meta{
  min-height:65px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  color:rgba(255,255,255,.45);
}

.catalog-meta a{
  color:rgba(255,255,255,.55);
  text-decoration:none;
}

.catalog-layout{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  gap:42px;
  align-items:start;
}

.catalog-side{
  position:sticky;
  top:100px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
}

.catalog-side a{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  color:rgba(255,255,255,.66);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:.2s ease;
}

.catalog-side a span{
  opacity:.3;
}

.catalog-side a:hover{
  color:#fff;
  padding-left:5px;
}

.catalog-products{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid rgba(255,255,255,.1);
  border-left:1px solid rgba(255,255,255,.1);
}

.catalog-card{
  min-width:0;
  color:#fff;
  text-decoration:none;
  background:#0b0c0e;
  border-right:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.1);
  transition:background .25s ease;
}

.catalog-card:hover{
  background:#121416;
}

.catalog-card-media{
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,255,255,.08),transparent 36%),
    #0e1012;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.catalog-card-media span{
  font-size:10px;
  letter-spacing:.25em;
  color:rgba(255,255,255,.18);
}

.catalog-card-body{
  min-height:225px;
  padding:22px;
  display:flex;
  flex-direction:column;
}

.catalog-card-body>small{
  font-size:9px;
  letter-spacing:.17em;
  color:rgba(255,255,255,.38);
  text-transform:uppercase;
}

.catalog-card h3{
  margin:14px 0 8px;
  font-size:20px;
  line-height:1.2;
  letter-spacing:-.025em;
  font-weight:500;
}

.catalog-sku{
  font-size:10px;
  letter-spacing:.08em;
  color:rgba(255,255,255,.3);
}

.catalog-card-bottom{
  margin-top:auto;
  padding-top:25px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.catalog-card-bottom b{
  font-size:18px;
  font-weight:550;
}

.catalog-card-bottom span{
  font-size:10px;
  white-space:nowrap;
}

.catalog-card-bottom .is-stock{
  color:rgba(255,255,255,.7);
}

.catalog-card-bottom .is-order{
  color:rgba(255,255,255,.36);
}

.catalog-empty{
  grid-column:1/-1;
  min-height:380px;
  padding:60px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  background:#0b0c0e;
}

.catalog-empty strong{
  font-size:34px;
  letter-spacing:-.04em;
}

.catalog-empty p{
  max-width:500px;
  color:rgba(255,255,255,.45);
}

.catalog-empty a{
  margin-top:15px;
  color:#fff;
}

/* TABLET */
@media(max-width:1180px){
  .catalog-toolbar{
    grid-template-columns:repeat(3,1fr);
  }

  .catalog-search{
    grid-column:1/-1;
  }

  .catalog-products{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* MOBILE */
@media(max-width:760px){
  .catalog-pro{
    padding:0 16px 80px;
  }

  .catalog-hero{
    min-height:290px;
    padding:90px 0 35px;
    grid-template-columns:1fr;
    gap:25px;
  }

  .catalog-hero h1{
    font-size:clamp(62px,21vw,100px);
  }

  .catalog-toolbar{
    padding:16px 0;
    grid-template-columns:1fr 1fr;
  }

  .catalog-search{
    grid-column:1/-1;
  }

  .catalog-toolbar button{
    grid-column:1/-1;
  }

  .catalog-layout{
    display:block;
  }

  .catalog-side{
    position:relative;
    top:auto;
    display:flex;
    overflow-x:auto;
    gap:8px;
    margin-bottom:20px;
    padding:0 0 12px;
    border:0;
    scrollbar-width:none;
  }

  .catalog-side::-webkit-scrollbar{
    display:none;
  }

  .catalog-side>small{
    display:none;
  }

  .catalog-side a{
    flex:0 0 auto;
    min-height:42px;
    padding:0 15px;
    border:1px solid rgba(255,255,255,.1);
    background:#101214;
    white-space:nowrap;
  }

  .catalog-side a span{
    margin-left:8px;
  }

  .catalog-products{
    grid-template-columns:1fr 1fr;
  }

  .catalog-card-body{
    min-height:190px;
    padding:15px;
  }

  .catalog-card h3{
    font-size:16px;
  }

  .catalog-card-bottom{
    display:block;
  }

  .catalog-card-bottom span{
    display:block;
    margin-top:8px;
  }
}

@media(max-width:430px){
  .catalog-toolbar{
    grid-template-columns:1fr;
  }

  .catalog-search,
  .catalog-toolbar button{
    grid-column:auto;
  }
}

/* =========================================================
   DOPOMOGA ONE — PRODUCT PRO BLACK PREMIUM V1
   ========================================================= */

.product-pro{
  background:#08090a;
  color:#fff;
  min-height:100vh;
}

.product-crumbs{
  padding:105px clamp(22px,5vw,80px) 22px;
  display:flex;
  align-items:center;
  gap:10px;
  overflow:hidden;
  white-space:nowrap;
  font-size:11px;
  color:rgba(255,255,255,.35);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.product-crumbs a{
  color:rgba(255,255,255,.52);
  text-decoration:none;
}

.product-crumbs>span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
}

.product-stage{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(390px,.65fr);
  min-height:760px;
  border-bottom:1px solid rgba(255,255,255,.1);
}

.product-gallery{
  position:relative;
  min-width:0;
  padding:55px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  align-content:start;
  background:
    radial-gradient(circle at 50% 40%,rgba(255,255,255,.08),transparent 32%),
    #0d0f11;
  border-right:1px solid rgba(255,255,255,.1);
}

.product-gallery-label{
  position:absolute;
  top:22px;
  left:26px;
  z-index:2;
  font-size:9px;
  letter-spacing:.23em;
  color:rgba(255,255,255,.28);
}

.product-gallery img{
  width:100%;
  height:auto;
  aspect-ratio:1/1;
  object-fit:contain;
  display:block;
  padding:25px;
  background:rgba(255,255,255,.018);
}

.product-gallery img:first-of-type{
  grid-column:1/-1;
  aspect-ratio:16/11;
  padding:40px;
}

.product-gallery .photo{
  grid-column:1/-1;
  min-height:580px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:clamp(42px,7vw,100px);
  line-height:.75;
  letter-spacing:-.07em;
  font-weight:700;
  color:rgba(255,255,255,.07);
}

.product-info{
  padding:clamp(42px,5vw,75px);
  display:flex;
  flex-direction:column;
  background:#090a0b;
}

.product-eyebrow{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-bottom:34px;
  font-size:9px;
  letter-spacing:.18em;
  color:rgba(255,255,255,.38);
}

.product-info h1{
  margin:0 0 30px;
  font-size:clamp(38px,4vw,68px);
  line-height:.94;
  letter-spacing:-.055em;
  font-weight:520;
}

.product-status{
  padding:17px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid rgba(255,255,255,.09);
  border-bottom:1px solid rgba(255,255,255,.09);
}

.product-status span{
  font-size:10px;
  letter-spacing:.12em;
}

.product-status small{
  color:rgba(255,255,255,.35);
}

.product-status .available{
  color:rgba(255,255,255,.88);
}

.product-status .on-order{
  color:rgba(255,255,255,.48);
}

.product-price{
  padding:34px 0;
}

.product-price small{
  display:block;
  margin-bottom:9px;
  font-size:9px;
  letter-spacing:.2em;
  color:rgba(255,255,255,.32);
}

.product-price strong{
  display:block;
  font-size:clamp(32px,3.3vw,52px);
  line-height:1;
  letter-spacing:-.045em;
  font-weight:520;
}

.product-info>label{
  margin-bottom:20px;
  font-size:11px;
  color:rgba(255,255,255,.45);
}

.product-info>label select{
  width:100%;
  min-height:52px;
  display:block;
  margin-top:8px;
  padding:0 15px;
  background:#101214;
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  border-radius:0;
}

.product-buy-row{
  display:grid;
  grid-template-columns:125px 1fr;
  gap:8px;
}

.product-qty{
  min-height:58px;
  display:grid;
  grid-template-columns:38px 1fr 38px;
  border:1px solid rgba(255,255,255,.12);
  background:#101214;
}

.product-qty button,
.product-qty input{
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  text-align:center;
  font:inherit;
}

.product-buy{
  min-height:58px;
  border-radius:0;
  font-weight:700;
  letter-spacing:.04em;
}

.product-offer{
  width:100%;
  min-height:56px;
  margin-top:8px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:0;
  background:transparent;
  color:#fff;
  cursor:pointer;
  letter-spacing:.06em;
}

.product-offer:hover{
  background:#fff;
  color:#08090a;
}

.product-service{
  margin-top:auto;
  padding-top:40px;
}

.product-service>div{
  min-height:48px;
  display:grid;
  grid-template-columns:35px 1fr;
  align-items:center;
  border-top:1px solid rgba(255,255,255,.08);
}

.product-service small{
  font-size:9px;
  color:rgba(255,255,255,.25);
}

.product-service span{
  font-size:11px;
  color:rgba(255,255,255,.52);
}

.product-details{
  padding:110px clamp(22px,6vw,96px);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(60px,9vw,150px);
  border-bottom:1px solid rgba(255,255,255,.1);
}

.product-details>div>small,
.product-business small{
  display:block;
  margin-bottom:17px;
  font-size:9px;
  letter-spacing:.23em;
  color:rgba(255,255,255,.34);
}

.product-details h2{
  margin:0 0 35px;
  font-size:clamp(37px,4vw,64px);
  line-height:.95;
  letter-spacing:-.05em;
  font-weight:520;
}

.product-description p{
  max-width:680px;
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:rgba(255,255,255,.52);
}

.product-specifications .specs{
  border-top:1px solid rgba(255,255,255,.12);
}

.product-specifications .specs>div{
  min-height:56px;
  padding:13px 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px;
  align-items:center;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.product-specifications .specs span{
  font-size:12px;
  color:rgba(255,255,255,.38);
}

.product-specifications .specs b{
  text-align:right;
  font-size:12px;
  font-weight:500;
  color:rgba(255,255,255,.8);
}

.product-business{
  min-height:500px;
  padding:100px clamp(22px,6vw,96px);
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:80px;
  align-items:end;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 30%,rgba(255,255,255,.08),transparent 28%),
    #0c0e10;
}

.product-business:after{
  content:"D1";
  position:absolute;
  right:-20px;
  top:-45px;
  font-size:320px;
  line-height:1;
  font-weight:800;
  letter-spacing:-.1em;
  color:rgba(255,255,255,.025);
  pointer-events:none;
}

.product-business h2{
  position:relative;
  z-index:1;
  margin:0;
  font-size:clamp(44px,5vw,78px);
  line-height:.92;
  letter-spacing:-.055em;
  font-weight:520;
}

.product-business>div:last-child{
  position:relative;
  z-index:1;
}

.product-business p{
  max-width:480px;
  margin:0 0 30px;
  line-height:1.7;
  color:rgba(255,255,255,.48);
}

.product-business .btn{
  min-height:58px;
}

/* One-click / B2B modal */
.product-pro~.modal .modalbox{
  background:#0d0f11;
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
}

.product-pro~.modal .modalbox>small{
  font-size:9px;
  letter-spacing:.2em;
  color:rgba(255,255,255,.35);
}

.product-pro~.modal .modalbox input{
  background:#111315;
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
}

/* TABLET */
@media(max-width:1050px){
  .product-stage{
    grid-template-columns:1fr 430px;
  }

  .product-gallery{
    padding:35px;
  }

  .product-info{
    padding:45px 32px;
  }
}

/* MOBILE */
@media(max-width:800px){
  .product-crumbs{
    padding:88px 18px 18px;
  }

  .product-stage{
    display:block;
    min-height:0;
  }

  .product-gallery{
    padding:38px 15px 15px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.1);
  }

  .product-gallery img:first-of-type{
    aspect-ratio:1/1;
    padding:18px;
  }

  .product-gallery .photo{
    min-height:390px;
  }

  .product-info{
    padding:35px 18px 45px;
  }

  .product-info h1{
    font-size:clamp(38px,12vw,58px);
  }

  .product-service{
    margin-top:35px;
  }

  .product-details{
    padding:75px 18px;
    grid-template-columns:1fr;
    gap:75px;
  }

  .product-business{
    min-height:560px;
    padding:75px 18px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:stretch;
    gap:60px;
  }

  .product-business:after{
    font-size:210px;
  }
}

@media(max-width:430px){
  .product-buy-row{
    grid-template-columns:105px 1fr;
  }

  .product-eyebrow{
    flex-direction:column;
    gap:7px;
  }

  .product-specifications .specs>div{
    grid-template-columns:1fr;
    gap:5px;
  }

  .product-specifications .specs b{
    text-align:left;
  }
}

/* =========================================================
   DOPOMOGA ONE — CART + CHECKOUT BLACK PREMIUM V1
   ========================================================= */

/* CART */

#cartPage{
  margin:35px 0 45px;
  border-top:1px solid rgba(255,255,255,.12);
}

.cartrow{
  min-height:120px;
  padding:25px 0;
  display:grid;
  grid-template-columns:1fr auto 45px;
  gap:30px;
  align-items:center;
  border-bottom:1px solid rgba(255,255,255,.09);
}

.cartrow>div:first-child{
  min-width:0;
}

.cartrow strong{
  display:block;
  margin-bottom:8px;
  font-size:18px;
  line-height:1.25;
  font-weight:500;
  color:#fff;
}

.cartrow small{
  color:rgba(255,255,255,.38);
}

.cartrow>b{
  font-size:18px;
  font-weight:520;
  white-space:nowrap;
}

.cartrow>button{
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.12);
  background:transparent;
  color:rgba(255,255,255,.55);
  cursor:pointer;
  font-size:20px;
}

.cartrow>button:hover{
  background:#fff;
  color:#08090a;
}

.carttotal{
  padding:35px 0;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:25px;
  font-size:14px;
  color:rgba(255,255,255,.45);
}

.carttotal b{
  font-size:clamp(28px,4vw,48px);
  font-weight:520;
  letter-spacing:-.04em;
  color:#fff;
}


/* CHECKOUT */

.checkout{
  max-width:1050px;
  margin:40px 0 100px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

.checkout label{
  display:flex;
  flex-direction:column;
  gap:9px;
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.42);
}

.checkout input,
.checkout select,
.checkout textarea{
  width:100%;
  min-height:56px;
  padding:0 17px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:0;
  outline:none;
  background:#0e1012;
  color:#fff;
  font:inherit;
  text-transform:none;
  letter-spacing:normal;
  transition:border-color .2s ease,background .2s ease;
}

.checkout textarea{
  min-height:120px;
  padding-top:16px;
  resize:vertical;
}

.checkout input:focus,
.checkout select:focus,
.checkout textarea:focus{
  border-color:rgba(255,255,255,.42);
  background:#111315;
}

.checkout input::placeholder,
.checkout textarea::placeholder{
  color:rgba(255,255,255,.25);
}

#companyFields{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

#warehouseLabel,
#addressLabel{
  grid-column:auto;
}

#checkoutSummary{
  grid-column:1/-1;
  margin-top:22px;
  padding:28px;
  background:#0d0f11;
  border:1px solid rgba(255,255,255,.1);
}

#checkoutSummary .cartrow{
  min-height:80px;
  padding:16px 0;
}

#placeOrder{
  grid-column:1/-1;
  min-height:64px;
  margin-top:5px;
  border-radius:0;
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
}

#checkoutMsg{
  grid-column:1/-1;
  min-height:20px;
  font-size:12px;
  color:rgba(255,255,255,.65);
}


/* NOVA POSHTA SUGGESTIONS */

.suggest{
  position:relative;
  z-index:30;
}

.suggest:not(:empty){
  max-height:280px;
  overflow:auto;
  margin-top:-1px;
  background:#101214;
  border:1px solid rgba(255,255,255,.14);
}

.suggest>div,
.suggest button{
  width:100%;
  padding:14px 16px;
  display:block;
  text-align:left;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:#101214;
  color:#fff;
  cursor:pointer;
}

.suggest>div:hover,
.suggest button:hover{
  background:#181b1e;
}


/* ORDER SUCCESS */

.success{
  min-height:75vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.successmark{
  width:72px;
  height:72px;
  margin-bottom:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  font-size:27px;
}

.success h1{
  margin:0 0 20px;
  max-width:900px;
  font-size:clamp(52px,8vw,120px);
  line-height:.85;
  letter-spacing:-.065em;
  font-weight:520;
}

.success p{
  color:rgba(255,255,255,.5);
}

.success .btn{
  margin-top:25px;
}


/* CHECKOUT MOBILE */

@media(max-width:700px){

  .cartrow{
    min-height:100px;
    grid-template-columns:1fr 38px;
    gap:12px;
  }

  .cartrow>b{
    grid-column:1;
    font-size:16px;
  }

  .cartrow>button{
    grid-column:2;
    grid-row:1/3;
    align-self:center;
  }

  .carttotal{
    justify-content:space-between;
  }

  .checkout{
    grid-template-columns:1fr;
    margin-top:30px;
  }

  #companyFields{
    grid-column:auto;
    grid-template-columns:1fr;
  }

  #checkoutSummary,
  #placeOrder,
  #checkoutMsg{
    grid-column:auto;
  }

  .checkout input,
  .checkout select{
    min-height:58px;
  }
}