/* =========================================================
   SILICOODATE — glass tableware & kitchenware
   Palette: clear glass (aqua) on ink, with molten-glass amber
   ========================================================= */

:root{
  --ink:        #0a1518;
  --ink-2:      #102126;
  --ink-3:      #17313a;
  --paper:      #f6f8f8;
  --paper-2:    #eaf1f0;
  --paper-3:    #dde9e8;

  --glass:      #4fb3ad;
  --glass-lt:   #8fd3cf;
  --glass-pale: #d9edeb;
  --glass-deep: #2c7b78;

  --molten:     #e08a2e;
  --molten-lt:  #f2b56a;

  --txt:        #0a1518;
  --txt-2:      #4a6168;
  --txt-3:      #7c9199;
  --on-dark:    #eef6f5;
  --on-dark-2:  #9db9bb;

  --line:       rgba(10,21,24,.11);
  --line-dark:  rgba(143,211,207,.16);

  --serif: "Cormorant Garamond", "Songti SC", "Times New Roman", Georgia, serif;
  --sans:  "Inter", system-ui, -apple-system, "Segoe UI", "PingFang SC",
           "Microsoft YaHei", "Hiragino Sans GB", sans-serif;

  --wrap: 1240px;
  --r:    14px;
  --ease: cubic-bezier(.22,.75,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:96px; -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--paper); color:var(--txt);
  font-family:var(--sans); font-size:16px; line-height:1.65;
  font-weight:400; letter-spacing:.005em;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{ max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; font-weight:500; line-height:1.15; letter-spacing:-.015em; }
p{ margin:0; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
.sprite{ position:absolute; width:0; height:0; overflow:hidden; }
:focus-visible{ outline:2px solid var(--glass); outline-offset:3px; border-radius:4px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(18px,4vw,40px); }
.ic{ width:18px; height:18px; flex:0 0 auto; display:inline-block; vertical-align:middle; }
.ic--lg{ width:28px; height:28px; }

/* ---------- glassware illustration ---------- */
.ware{
  color:var(--glass-deep);
  width:auto; aspect-ratio:120/160; display:block;
  filter:drop-shadow(0 12px 18px rgba(44,123,120,.14));
}
.ware--xl{ height:250px; } .ware--lg{ height:190px; }
.ware--md{ height:150px; }  .ware--cat{ height:104px; }
.ware--card{ height:150px; }
.sec--dark .ware, .hero .ware{ color:var(--glass-lt); filter:drop-shadow(0 14px 28px rgba(0,0,0,.35)); }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  padding:.92em 1.5em; border-radius:100px; border:1px solid transparent;
  font-size:.92rem; font-weight:500; letter-spacing:.01em; cursor:pointer;
  transition:transform .25s var(--ease), background .25s, color .25s, border-color .25s, box-shadow .25s;
}
.btn--sm{ padding:.62em 1.15em; font-size:.85rem; }
.btn--solid{ background:var(--molten); color:#fff; box-shadow:0 8px 22px -8px rgba(224,138,46,.65); }
.btn--solid:hover{ background:#c9761f; transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(224,138,46,.7); }
.btn--ghost{ border-color:var(--line); color:var(--txt); background:transparent; }
.btn--ghost:hover{ border-color:var(--glass); color:var(--glass-deep); background:rgba(79,179,173,.07); transform:translateY(-2px); }
.sec--dark .btn--ghost, .hero .btn--ghost{ border-color:var(--line-dark); color:var(--on-dark); }
.sec--dark .btn--ghost:hover, .hero .btn--ghost:hover{ border-color:var(--glass-lt); color:var(--glass-lt); background:rgba(143,211,207,.1); }
.btn .ic{ width:17px; height:17px; transition:transform .3s var(--ease); }
.btn:hover .ic{ transform:translateX(4px); }

/* ---------- topbar ---------- */
.topbar{ background:var(--ink); color:var(--on-dark-2); font-size:.78rem; }
.topbar__in{ display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:40px; flex-wrap:wrap; }
.topbar__note{ display:flex; align-items:center; gap:.55em; letter-spacing:.02em; }
.topbar__note .ic{ width:15px; height:15px; color:var(--molten-lt); }
.topbar__right{ display:flex; align-items:center; gap:20px; }
.topbar__link{ display:inline-flex; align-items:center; gap:.45em; transition:color .2s; }
.topbar__link .ic{ width:14px; height:14px; opacity:.7; }
.topbar__link:hover{ color:var(--glass-lt); }
.topbar__link--plain{ cursor:default; }
.topbar__link--plain:hover{ color:inherit; }

/* ---------- header ---------- */
.hdr{
  position:sticky; top:0; z-index:60;
  background:rgba(246,248,248,.82); backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid transparent; transition:box-shadow .3s, border-color .3s, background .3s;
}
.hdr.is-stuck{ border-bottom-color:var(--line); box-shadow:0 10px 30px -22px rgba(10,21,24,.5); }
.hdr__in{ display:flex; align-items:center; justify-content:space-between; gap:28px; min-height:74px; }

.brand{ display:flex; align-items:center; gap:11px; }
.brand__mark{ width:38px; height:38px; color:var(--glass-deep); display:block; flex:0 0 auto; }
.brand__mark svg{ width:100%; height:100%; }
.brand__txt{ display:flex; flex-direction:column; line-height:1.1; }
.brand__name{ font-size:1.06rem; font-weight:700; letter-spacing:.16em; }
.brand__desc{ font-size:.63rem; letter-spacing:.19em; text-transform:uppercase; color:var(--glass-deep); font-weight:600; margin-top:3px; }

.nav{ display:flex; align-items:center; gap:clamp(14px,1.9vw,28px); }
.nav > a{ font-size:.885rem; font-weight:450; color:var(--txt-2); position:relative; padding:4px 0; transition:color .2s; white-space:nowrap; }
.nav > a::after{ content:""; position:absolute; left:0; bottom:0; height:1.5px; width:0; background:var(--glass); transition:width .3s var(--ease); }
.nav > a:hover{ color:var(--txt); } .nav > a:hover::after{ width:100%; }
.nav > a.is-active{ color:var(--txt); } .nav > a.is-active::after{ width:100%; }
.nav__cta{ color:#fff !important; }
.nav__cta::after{ display:none; }
.nav__close{ display:none; }
.burger{ display:none; background:none; border:1px solid var(--line); border-radius:10px; padding:8px; cursor:pointer; }

/* ---------- hero ---------- */
.hero{ position:relative; background:var(--ink); color:var(--on-dark); overflow:hidden; isolation:isolate; }
.hero__glow{
  position:absolute; inset:-25% -10% auto -10%; height:120%;
  background:
    radial-gradient(46% 55% at 74% 34%, rgba(79,179,173,.30), transparent 66%),
    radial-gradient(40% 48% at 16% 78%, rgba(224,138,46,.16), transparent 68%),
    radial-gradient(70% 60% at 50% 0%, rgba(143,211,207,.12), transparent 70%);
  z-index:-1; filter:blur(6px);
}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; opacity:.5;
  background-image:linear-gradient(rgba(143,211,207,.05) 1px, transparent 1px);
  background-size:100% 62px;
  mask-image:linear-gradient(to bottom, transparent, #000 30%, #000 70%, transparent);
}
.hero__in{
  display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(30px,5vw,64px); align-items:center;
  padding-block:clamp(58px,8vw,104px) clamp(56px,7vw,96px);
}
.eyebrow{
  font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--glass-deep); margin-bottom:18px;
}
.hero .eyebrow, .sec--dark .eyebrow{ color:var(--glass-lt); }
.hero__h1{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(2.5rem,5.4vw,4.35rem); line-height:1.03; letter-spacing:-.02em;
  margin-bottom:24px; text-wrap:balance;
}
.hero__h1 em{
  font-style:italic; color:var(--glass-lt); position:relative; white-space:nowrap;
}
.hero__h1 em::after{
  content:""; position:absolute; left:0; right:0; bottom:.1em; height:.06em;
  background:linear-gradient(90deg, var(--molten), transparent); border-radius:2px;
}
.hero__lede{ color:var(--on-dark-2); font-size:clamp(.98rem,1.15vw,1.08rem); max-width:56ch; line-height:1.7; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }

.hero__stats{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px;
  margin-top:46px; padding-top:28px; border-top:1px solid var(--line-dark);
}
.hero__stats li{ display:flex; flex-direction:column; gap:3px; }
.hero__stats b{
  font-family:var(--serif); font-size:clamp(1.7rem,2.7vw,2.3rem);
  font-weight:500; color:var(--glass-lt); line-height:1;
}
.hero__stats span{ font-size:.74rem; letter-spacing:.05em; color:var(--on-dark-2); text-transform:uppercase; }

/* hero shelf of glassware */
.hero__art{ display:flex; justify-content:center; }
.shelf{ width:100%; max-width:560px; }
.shelf__row{
  display:flex; align-items:flex-end; justify-content:center;
  gap:clamp(4px,1.6vw,20px); padding-bottom:6px;
}
.shelf__row--back{ opacity:.92; }
.shelf__line{
  height:1px; margin-bottom:clamp(18px,3.4vw,38px);
  background:linear-gradient(90deg, transparent, rgba(143,211,207,.55) 18%, rgba(143,211,207,.55) 82%, transparent);
  position:relative;
}
.shelf__line::after{
  content:""; position:absolute; inset:1px 8% auto 8%; height:40px;
  background:linear-gradient(180deg, rgba(143,211,207,.14), transparent);
  filter:blur(9px);
}
@keyframes bob{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-9px) } }
.float-a{ animation:bob 7.5s var(--ease) infinite; }
.float-b{ animation:bob 8.8s var(--ease) infinite .7s; }
.float-c{ animation:bob 6.6s var(--ease) infinite 1.4s; }

/* ---------- marquee ---------- */
.marquee{
  background:var(--ink-2); color:var(--on-dark-2); overflow:hidden;
  border-block:1px solid var(--line-dark); padding-block:13px;
}
.marquee__track{
  display:flex; align-items:center; gap:26px; width:max-content;
  animation:slide 40s linear infinite;
  font-size:.74rem; letter-spacing:.22em; font-weight:600; white-space:nowrap;
}
.marquee i{ color:var(--molten); font-style:normal; font-size:.55rem; }
@keyframes slide{ to{ transform:translateX(-50%) } }

/* ---------- sections ---------- */
.sec{ padding-block:clamp(64px,8.5vw,116px); }
.sec--tint{ background:var(--paper-2); }
.sec--dark{ background:var(--ink); color:var(--on-dark); }
.sec--dark .sec__title{ color:var(--on-dark); }
.sec--dark .sec__lede{ color:var(--on-dark-2); }

.sec__head{ max-width:760px; margin:0 auto clamp(38px,5vw,60px); text-align:center; }
.sec__head--left{ margin-inline:0; text-align:left; }
.sec__head--row{
  display:grid; grid-template-columns:1fr minmax(0,420px); gap:32px;
  max-width:none; text-align:left; align-items:end;
}
.sec__title{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.95rem,3.7vw,3.05rem); line-height:1.08; letter-spacing:-.02em;
  text-wrap:balance;
}
.sec__lede{ margin-top:16px; color:var(--txt-2); font-size:1rem; line-height:1.72; }
.sec__foot{ margin-top:40px; text-align:center; }

/* ---------- categories ---------- */
.cats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:clamp(14px,1.6vw,22px); }
.cat{
  background:#fff; border:1px solid var(--line); border-radius:var(--r);
  padding:30px 28px 26px; display:flex; flex-direction:column; align-items:flex-start;
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s;
  position:relative; overflow:hidden;
}
.cat::before{
  content:""; position:absolute; inset:auto -30% -60% -30%; height:70%;
  background:radial-gradient(50% 100% at 50% 100%, rgba(79,179,173,.14), transparent 70%);
  opacity:0; transition:opacity .4s;
}
.cat:hover{ transform:translateY(-6px); box-shadow:0 26px 44px -30px rgba(10,21,24,.45); border-color:rgba(79,179,173,.4); }
.cat:hover::before{ opacity:1; }
.cat .ware{ margin-bottom:16px; }
.cat h3{ font-size:1.22rem; font-weight:600; letter-spacing:-.01em; }
.cat p{ margin-top:9px; color:var(--txt-2); font-size:.92rem; line-height:1.6; flex:1; }
.cat__meta{
  margin-top:16px; padding-top:14px; border-top:1px dashed var(--line);
  width:100%; font-size:.76rem; letter-spacing:.055em; color:var(--glass-deep); font-weight:600; text-transform:uppercase;
}

/* ---------- materials ---------- */
.mats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:clamp(14px,1.6vw,22px); }
.mat{
  border:1px solid var(--line-dark); border-radius:var(--r); padding:30px 28px;
  background:linear-gradient(160deg, rgba(143,211,207,.07), rgba(143,211,207,.02));
  transition:border-color .35s, transform .35s var(--ease);
}
.mat:hover{ border-color:rgba(143,211,207,.45); transform:translateY(-5px); }
.mat__top{ display:flex; align-items:baseline; gap:12px; }
.mat__no{ font-family:var(--serif); font-size:1.7rem; color:var(--molten-lt); line-height:1; }
.mat h3{ font-size:1.22rem; font-weight:600; color:var(--on-dark); }
.mat__use{ margin-top:12px; font-size:.88rem; color:var(--glass-lt); letter-spacing:.01em; }
.specs{ margin-top:22px; display:flex; flex-direction:column; gap:1px; background:var(--line-dark); border-radius:9px; overflow:hidden; }
.specs li{
  display:flex; justify-content:space-between; align-items:center; gap:14px;
  padding:10px 14px; background:var(--ink); font-size:.85rem;
}
.specs li span{ color:var(--on-dark-2); }
.specs li b{ font-weight:600; color:var(--on-dark); font-variant-numeric:tabular-nums; }
.mat__note{ margin-top:18px; font-size:.85rem; line-height:1.6; color:var(--on-dark-2); border-left:2px solid var(--molten); padding-left:12px; }

/* ---------- filters + product grid ---------- */
.filters{ display:flex; flex-wrap:wrap; gap:9px; margin-bottom:30px; }
.chip{
  border:1px solid var(--line); background:#fff; border-radius:100px;
  padding:.5em 1.15em; font-size:.85rem; color:var(--txt-2); cursor:pointer; transition:.25s;
}
.chip:hover{ border-color:var(--glass); color:var(--glass-deep); }
.chip.is-on{ background:var(--ink); border-color:var(--ink); color:var(--on-dark); }

.grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(258px,1fr)); gap:clamp(14px,1.5vw,20px); }
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s;
}
.card.is-hidden{ display:none; }
.card:hover{ transform:translateY(-6px); box-shadow:0 28px 46px -30px rgba(10,21,24,.5); border-color:rgba(79,179,173,.4); }
.card__art{
  position:relative; display:grid; place-items:center; padding:30px 20px 22px;
  background:
    radial-gradient(58% 62% at 50% 42%, rgba(79,179,173,.16), transparent 70%),
    linear-gradient(180deg, var(--paper-2), #fff);
  border-bottom:1px solid var(--line);
}
.card__tag{
  position:absolute; top:14px; left:14px;
  background:var(--ink); color:var(--on-dark); font-size:.66rem; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; padding:.35em .8em; border-radius:100px;
}
.card__tag--hot{ background:var(--molten); color:#fff; }
.card__body{ padding:20px 22px 22px; display:flex; flex-direction:column; flex:1; }
.card__body h3{ font-size:1.06rem; font-weight:600; }
.card__body > p{ margin-top:8px; color:var(--txt-2); font-size:.875rem; line-height:1.58; flex:1; }
.card__specs{ display:flex; gap:22px; margin-top:16px; padding-top:14px; border-top:1px dashed var(--line); }
.card__specs dt{ font-size:.68rem; letter-spacing:.09em; text-transform:uppercase; color:var(--txt-3); }
.card__specs dd{ margin:2px 0 0; font-size:.85rem; font-weight:600; font-variant-numeric:tabular-nums; }
.grid__empty{ text-align:center; color:var(--txt-3); padding:40px 0; }

/* ---------- process ---------- */
.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:clamp(14px,1.6vw,22px); counter-reset:s; }
.step{
  position:relative; padding:26px 22px 24px; border-radius:var(--r);
  background:#fff; border:1px solid var(--line);
  transition:transform .35s var(--ease), border-color .35s;
}
.step:hover{ transform:translateY(-5px); border-color:rgba(79,179,173,.45); }
.step__no{
  font-family:var(--serif); font-size:2.1rem; line-height:1; color:var(--glass);
  display:block; margin-bottom:12px; opacity:.85;
}
.step h3{ font-size:1.05rem; font-weight:600; }
.step p{ margin-top:8px; color:var(--txt-2); font-size:.875rem; line-height:1.6; }

/* ---------- factory ---------- */
.factory{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(32px,5vw,64px); align-items:center; }
.factory .sec__title{ margin-top:0; }
.ticks{ margin-top:28px; display:flex; flex-direction:column; gap:13px; }
.ticks li{ display:flex; align-items:flex-start; gap:12px; font-size:.94rem; line-height:1.55; }
.ticks .ic{ color:var(--glass-lt); margin-top:3px; }
.sec--tint .ticks .ic{ color:var(--glass-deep); }

.factory__panels{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(12px,1.4vw,18px); }
.panel{
  border:1px solid var(--line-dark); border-radius:var(--r); padding:26px 22px;
  background:linear-gradient(160deg, rgba(143,211,207,.08), rgba(143,211,207,.015));
  display:flex; flex-direction:column; gap:6px;
  transition:transform .35s var(--ease), border-color .35s;
}
.panel:hover{ transform:translateY(-5px); border-color:rgba(143,211,207,.45); }
.panel .ic{ color:var(--molten-lt); margin-bottom:8px; }
.panel b{ font-family:var(--serif); font-size:clamp(1.8rem,2.8vw,2.4rem); font-weight:500; line-height:1; color:var(--on-dark); }
.panel span{ font-size:.82rem; color:var(--on-dark-2); line-height:1.5; }

/* ---------- services ---------- */
.svcs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); gap:clamp(14px,1.6vw,22px); }
.svc{
  padding:30px 26px; border-radius:var(--r); border:1px solid var(--line); background:#fff;
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.svc:hover{ transform:translateY(-6px); border-color:rgba(79,179,173,.42); box-shadow:0 26px 44px -32px rgba(10,21,24,.45); }
.svc .ic{ color:var(--glass-deep); margin-bottom:16px; }
.svc h3{ font-size:1.12rem; font-weight:600; }
.svc p{ margin-top:9px; color:var(--txt-2); font-size:.9rem; line-height:1.6; flex:1; }
.svc__meta{ margin-top:16px; font-size:.76rem; letter-spacing:.05em; text-transform:uppercase; font-weight:600; color:var(--molten); }

/* ---------- quality ---------- */
.quality{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,60px); align-items:center; }
.certs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; }
.cert{
  background:#fff; border:1px solid var(--line); border-radius:12px;
  padding:20px 16px; text-align:center; display:flex; flex-direction:column; gap:5px;
  transition:transform .3s var(--ease), border-color .3s;
}
.cert:hover{ transform:translateY(-4px); border-color:rgba(79,179,173,.45); }
.cert b{ font-size:1rem; font-weight:700; letter-spacing:.06em; color:var(--ink); }
.cert span{ font-size:.72rem; color:var(--txt-3); line-height:1.45; }

/* ---------- markets ---------- */
.markets{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:clamp(14px,1.6vw,20px); }
.mkt{ padding:26px 22px; border-radius:var(--r); border:1px solid var(--line); background:#fff; transition:transform .35s var(--ease), border-color .35s; }
.mkt:hover{ transform:translateY(-5px); border-color:rgba(79,179,173,.42); }
.mkt b{ font-family:var(--serif); font-size:2.2rem; font-weight:500; color:var(--glass-deep); line-height:1; display:block; }
.mkt h3{ margin-top:10px; font-size:1.02rem; font-weight:600; }
.mkt p{ margin-top:7px; font-size:.83rem; color:var(--txt-2); line-height:1.55; }

/* ---------- faq ---------- */
.faq{ display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); gap:clamp(32px,5vw,60px); align-items:start; }
.faq .sec__head{ position:sticky; top:110px; margin-bottom:0; }
.acc{ display:flex; flex-direction:column; }
.acc__item{ border-bottom:1px solid var(--line); }
.acc__item summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:20px 0; font-size:1.02rem; font-weight:500; transition:color .2s;
}
.acc__item summary::-webkit-details-marker{ display:none; }
.acc__item summary:hover{ color:var(--glass-deep); }
.acc__ic{ color:var(--glass-deep); transition:transform .35s var(--ease); }
.acc__item[open] .acc__ic{ transform:rotate(45deg); }
.acc__body{ padding:0 44px 22px 0; color:var(--txt-2); font-size:.93rem; line-height:1.72; }
.acc__item[open] .acc__body{ animation:fadeUp .35s var(--ease); }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(-6px) } to{ opacity:1; transform:none } }

/* ---------- contact ---------- */
.contact{ display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); gap:clamp(32px,5vw,60px); align-items:start; }
.contact__list{ margin-top:32px; display:flex; flex-direction:column; gap:15px; }
.contact__list li{ display:flex; align-items:flex-start; gap:12px; font-size:.93rem; line-height:1.55; color:var(--on-dark-2); }
.contact__list .ic{ color:var(--glass-lt); margin-top:3px; }
.contact__list a:hover{ color:var(--glass-lt); }

/* social links */
.social{ margin-top:30px; padding-top:26px; border-top:1px solid var(--line-dark); }
.social__label{
  display:block; font-size:.72rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--glass-lt); margin-bottom:14px;
}
.social__list{ display:flex; flex-wrap:wrap; gap:10px; }
.social__link{
  display:inline-flex; align-items:center; gap:.6em;
  padding:.62em 1.15em; border-radius:100px;
  border:1px solid var(--line-dark); color:var(--on-dark-2);
  font-size:.88rem; font-weight:500;
  transition:border-color .25s, color .25s, background .25s, transform .25s var(--ease);
}
.social__link .ic{ width:16px; height:16px; }
.social__link:hover{
  border-color:var(--glass-lt); color:var(--on-dark);
  background:rgba(143,211,207,.1); transform:translateY(-2px);
}

.ftr__social{ display:flex; gap:10px; margin-top:22px; }
.ftr__social a{
  display:grid; place-items:center; width:38px; height:38px; border-radius:50%;
  border:1px solid var(--line-dark); color:var(--on-dark-2);
  transition:border-color .25s, color .25s, background .25s, transform .25s var(--ease);
}
.ftr__social .ic{ width:16px; height:16px; }
.ftr__social a:hover{
  border-color:var(--glass-lt); color:var(--on-dark);
  background:rgba(143,211,207,.1); transform:translateY(-2px);
}

.form{
  background:rgba(143,211,207,.05); border:1px solid var(--line-dark);
  border-radius:18px; padding:clamp(22px,3vw,34px); display:flex; flex-direction:column; gap:16px;
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field{ display:flex; flex-direction:column; gap:7px; }
.field > span{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--on-dark-2); font-weight:600; }
.field input, .field select, .field textarea{
  width:100%; background:rgba(10,21,24,.55); border:1px solid var(--line-dark);
  border-radius:10px; padding:.78em .95em; color:var(--on-dark); font-size:.93rem;
  transition:border-color .2s, background .2s;
}
.field textarea{ resize:vertical; min-height:118px; line-height:1.6; }
.field select{ appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--glass-lt) 50%),linear-gradient(135deg,var(--glass-lt) 50%,transparent 50%); background-position:calc(100% - 19px) 52%, calc(100% - 13px) 52%; background-size:6px 6px, 6px 6px; background-repeat:no-repeat; padding-right:40px; }
.field select option{ background:var(--ink-2); color:var(--on-dark); }
.field input::placeholder, .field textarea::placeholder{ color:rgba(157,185,187,.5); }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--glass); background:rgba(10,21,24,.75); }
.field.is-bad input, .field.is-bad textarea{ border-color:#e0663c; }
.form__foot{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:4px; }
.form__hint{ font-size:.78rem; color:var(--on-dark-2); flex:1; min-width:200px; }
.form__msg{
  margin:0; padding:13px 16px; border-radius:10px; font-size:.88rem;
  background:rgba(79,179,173,.14); border:1px solid rgba(79,179,173,.4); color:var(--glass-lt);
}
.form__msg.is-bad{ background:rgba(224,102,60,.13); border-color:rgba(224,102,60,.45); color:#f0a184; }

/* ---------- footer ---------- */
.ftr{ background:var(--ink-2); color:var(--on-dark-2); padding-top:clamp(48px,6vw,72px); }
.ftr__in{ display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr)); gap:clamp(26px,3.5vw,46px); padding-bottom:44px; }
.brand--ftr .brand__mark{ color:var(--glass-lt); }
.brand--ftr .brand__name{ color:var(--on-dark); }
.brand--ftr .brand__desc{ color:var(--glass-lt); }
.ftr__blurb{ margin-top:18px; font-size:.88rem; line-height:1.65; max-width:38ch; }
.ftr__col{ display:flex; flex-direction:column; gap:10px; }
.ftr__col h4{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--on-dark); margin-bottom:6px; }
.ftr__col a{ font-size:.88rem; transition:color .2s; }
.ftr__col a:hover{ color:var(--glass-lt); }
.ftr__bar{
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-block:20px; border-top:1px solid var(--line-dark); font-size:.78rem;
}
.ftr__legal{ color:var(--txt-3); }

/* ---------- back to top ---------- */
.totop{
  position:fixed; right:22px; bottom:22px; z-index:70;
  width:44px; height:44px; border-radius:50%; display:grid; place-items:center;
  background:var(--ink); color:var(--on-dark); box-shadow:0 12px 28px -12px rgba(10,21,24,.7);
  opacity:0; visibility:hidden; transform:translateY(12px); transition:.32s var(--ease);
}
.totop.is-on{ opacity:1; visibility:visible; transform:none; }
.totop:hover{ background:var(--molten); }
.totop .ic{ transform:rotate(-90deg); width:20px; height:20px; }

/* ---------- reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .hero__in{ grid-template-columns:1fr; }
  .hero__art{ order:-1; }
  .ware--xl{ height:190px } .ware--lg{ height:150px } .ware--md{ height:120px }
  .factory, .quality, .faq, .contact{ grid-template-columns:1fr; }
  .faq .sec__head{ position:static; }
  .sec__head--row{ grid-template-columns:1fr; align-items:start; }
  .ftr__in{ grid-template-columns:1fr 1fr; }
}
/* nav collapses at 1024 rather than 860: 8 links + CTA cramp the bar below ~1100px */
@media (max-width:1024px){
  .burger{ display:grid; place-items:center; color:var(--txt); }
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(330px,86vw); z-index:80;
    background:var(--ink); color:var(--on-dark);
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:4px; padding:74px 26px 26px;
    transform:translateX(102%); transition:transform .38s var(--ease);
    box-shadow:-24px 0 60px -30px rgba(0,0,0,.8);
  }
  .nav.is-open{ transform:none; }
  .nav > a{ color:var(--on-dark-2); font-size:1.02rem; padding:13px 0; border-bottom:1px solid var(--line-dark); }
  .nav > a::after{ display:none; }
  .nav > a:hover, .nav > a.is-active{ color:var(--glass-lt); }
  .nav__cta{ margin-top:22px; justify-content:center; border-bottom:0 !important; }
  .nav__close{ display:grid; place-items:center; position:absolute; top:18px; right:18px; background:none; border:0; color:var(--on-dark); cursor:pointer; padding:6px; }
  .nav__close .ic{ width:22px; height:22px; }
  .topbar__note{ display:none; }
  .topbar__in{ justify-content:flex-end; }
  .hero__stats{ grid-template-columns:repeat(2,1fr); gap:22px 14px; }
  .factory__panels{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px){
  .topbar__link:not(:first-child){ display:none; }
  .form__row{ grid-template-columns:1fr; }
  .shelf__row{ gap:2px; }
  .ware--xl{ height:145px } .ware--lg{ height:118px } .ware--md{ height:96px }
  .ftr__in{ grid-template-columns:1fr; }
  .acc__body{ padding-right:0; }
  .card__specs{ gap:16px; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
}