/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 08 2026 | 20:09:49 */
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700&family=Sulphur+Point:wght@400;500;600;700&family=Bruno+Ace&family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,400,0,0&display=swap');

/* ================================================================
   HSE ELEMENTS | WOOCOMMERCE STORE-ONLY COMING SOON | FULL CSS
   Companion: hse_elements_coming_soon_template.html
   Deliberately scoped to .hse-cs-shell / .hse-cs.
   Preserves native WooCommerce coming-soon visibility and routing.
   No JavaScript, theme overrides, or WooCommerce hook changes.
   ================================================================ */

/* 01 | PAGE FOUNDATION */
.hse-cs-shell {
  --cs-amber:#FFC84A;
  --cs-bright-amber:#FFD578;
  --cs-deep-amber:#D89B2B;
  --cs-light-amber:#FAD995;
  --cs-black:#000;
  --cs-ink:#151515;
  --cs-white:#fff;
  --cs-ease:cubic-bezier(.22,1,.36,1);
  --cs-radius:18px;
  --cs-gutter:clamp(20px,4.6vw,86px);
  --cs-max:1520px;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  background:#F7F7F5;
}
.hse-cs-shell > .hse-cs { margin-block-start:0; }
.hse-cs,
.hse-cs * ,
.hse-cs *::before,
.hse-cs *::after { box-sizing:border-box; }
.hse-cs {
  position:relative;
  isolation:isolate;
  display:block;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  color:var(--cs-white);
  font-family:'Sulphur Point',Arial,sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.hse-cs :is(h1,h2,h3,p) { margin:0; }
.hse-cs :is(h1,h2,h3) {
  font-family:'Oxanium',Arial,sans-serif;
  font-weight:500;
  letter-spacing:-.045em;
  line-height:1.06;
  text-wrap:balance;
}
.hse-cs a { text-decoration:none; }
.hse-cs :is(a,button):focus-visible {
  outline:3px solid var(--cs-amber);
  outline-offset:4px;
}
.hse-cs .hse-cs__symbol,
.hse-cs .material-symbols-rounded {
  display:inline-grid;
  place-items:center;
  flex:none;
  font-family:'Material Symbols Rounded'!important;
  font-size:24px;
  font-weight:400;
  font-style:normal;
  line-height:1!important;
  letter-spacing:normal!important;
  text-transform:none;
  white-space:nowrap;
  direction:ltr;
  -webkit-font-feature-settings:'liga';
  font-feature-settings:'liga';
  -webkit-font-smoothing:antialiased;
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
}
.hse-cs__container {
  width:min(calc(100% - var(--cs-gutter)*2),var(--cs-max));
  max-width:none;
  margin-inline:auto;
}

/* 02 | BLACK/AMBER BRANDED HERO */
.hse-cs__hero {
  position:relative;
  isolation:isolate;
  min-height:clamp(665px,83svh,970px);
  display:flex;
  align-items:center;
  width:100%;
  margin:0;
  padding:clamp(112px,10.5vw,168px) 0 clamp(92px,8vw,125px);
  overflow:hidden;
  background:
    radial-gradient(ellipse at 12% 0%,rgba(255,200,74,.14),transparent 45%),
    radial-gradient(ellipse at 100% 85%,rgba(255,200,74,.075),transparent 48%),
    linear-gradient(130deg,#171918 0%,#0A0B0B 64%,#151515 100%);
}
.hse-cs__hero::after {
  content:'';
  position:absolute;
  z-index:0;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,200,74,.56),transparent);
  pointer-events:none;
}
.hse-cs__ambient { position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.hse-cs__ambient-diamond {
  position:absolute;
  display:block;
  aspect-ratio:1;
  border:1px solid rgba(255,213,120,.20);
  border-radius:clamp(15px,2.4vw,30px);
  background:linear-gradient(135deg,rgba(255,200,74,.095),rgba(255,255,255,.015) 76%);
  box-shadow:inset 0 1px rgba(255,255,255,.08);
  transform:rotate(45deg);
  animation:hse-cs-ambient-float 16s ease-in-out infinite;
}
.hse-cs__ambient-diamond--one { width:clamp(280px,34vw,565px); top:-290px; left:-150px; }
.hse-cs__ambient-diamond--two { width:clamp(180px,20vw,330px); bottom:-165px; right:-105px; animation-delay:-7s; }
.hse-cs__ambient-diamond--three { width:clamp(120px,13vw,210px); bottom:-158px; left:30%; animation-delay:-12s; }
@keyframes hse-cs-ambient-float {
  0%,100% { transform:translate3d(0,0,0) rotate(45deg); }
  50% { transform:translate3d(8px,-23px,0) rotate(45deg); }
}
.hse-cs__layout {
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(45px,6vw,108px);
  align-items:center;
}

/* 03 | EYEBROW, HEADLINE, BODY COPY */
.hse-cs__content { width:100%; max-width:790px; min-width:0; }
.hse-cs .hse-cs__eyebrow {
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:fit-content;
  max-width:100%;
  margin:0 0 clamp(30px,3.4vw,50px);
  padding:9px 16px;
  border:1px solid rgba(255,200,74,.8);
  border-radius:999px;
  background:rgba(255,200,74,.2);
  color:var(--cs-amber);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
  backdrop-filter:blur(18px) saturate(135%);
  box-shadow:inset 0 1px rgba(255,255,255,.22),0 5px 20px rgba(216,155,43,.12);
  font:700 clamp(10px,.8vw,13px)/1.35 'Oxanium',Arial,sans-serif;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.hse-cs__eyebrow .hse-cs__symbol { font-size:19px; }
.hse-cs .hse-cs__overline {
  margin:0 0 14px;
  color:var(--cs-light-amber);
  font:700 clamp(12px,.85vw,14px)/1.45 'Oxanium',Arial,sans-serif;
  letter-spacing:.19em;
}
.hse-cs #hse-cs-title {
  max-width:800px;
  margin:0;
  color:#fff;
  font-size:clamp(46px,5.3vw,85px);
  line-height:1.045;
  letter-spacing:-.055em;
  text-transform:none;
}
.hse-cs #hse-cs-title em { font-style:normal; color:var(--cs-amber); }
.hse-cs .hse-cs__description {
  max-width:620px;
  margin:clamp(23px,2.5vw,36px) 0 0;
  color:rgba(255,255,255,.84);
  font:400 clamp(16px,1.3vw,20px)/1.6 'Sulphur Point',Arial,sans-serif;
}

/* 04 | BRAND BUTTONS */
.hse-cs__actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin-top:clamp(29px,3vw,42px);
}
.hse-cs .hse-cs__button {
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:fit-content;
  max-width:100%;
  min-height:50px;
  margin:0;
  padding:12px 19px;
  overflow:hidden;
  border:1px solid transparent;
  border-radius:10px;
  font:700 12px/1.35 'Oxanium',Arial,sans-serif;
  letter-spacing:.018em;
  text-align:center;
  text-transform:uppercase;
  cursor:pointer;
  transition:transform .29s var(--cs-ease),background-color .29s ease,
    border-color .29s ease,color .29s ease,box-shadow .29s ease;
}
.hse-cs__button::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:var(--cs-active-wipe,#fff);
  transform:translateX(-102%);
  transition:transform .42s var(--cs-ease);
  pointer-events:none;
}
.hse-cs__button:active::before { transform:translateX(0); }
.hse-cs .hse-cs__button .hse-cs__symbol { font-size:19px; transition:transform .29s var(--cs-ease); }
.hse-cs__button:hover { transform:translateY(-3px); }
.hse-cs__button:hover .hse-cs__symbol { transform:scale(1.06); }
.hse-cs__button:active { transform:translateY(0); }
.hse-cs .hse-cs__button--primary {
  --cs-active-wipe:#fff;
  background:var(--cs-amber);
  color:#000;
  box-shadow:0 10px 30px rgba(216,155,43,.13),inset 0 1px rgba(255,255,255,.25);
}
.hse-cs .hse-cs__button--primary:hover {
  background:var(--cs-bright-amber);
  color:#000;
  box-shadow:0 14px 36px rgba(216,155,43,.22);
}
.hse-cs .hse-cs__button--primary:active {
  border-color:var(--cs-amber);
  color:#000;
  box-shadow:inset 0 0 0 1px rgba(255,200,74,.4),0 0 0 3px rgba(255,200,74,.12);
}
.hse-cs .hse-cs__button--glass {
  --cs-active-wipe:#000;
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.38);
  color:#fff;
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  backdrop-filter:blur(18px) saturate(130%);
  box-shadow:inset 0 1px rgba(255,255,255,.12);
}
.hse-cs .hse-cs__button--glass:hover {
  background:var(--cs-amber);
  border-color:var(--cs-amber);
  color:#000;
  box-shadow:0 10px 25px rgba(0,0,0,.17);
}
.hse-cs .hse-cs__button--glass:active {
  background:#000;
  border-color:var(--cs-amber);
  color:var(--cs-amber);
}
.hse-cs .hse-cs__notice {
  display:inline-flex;
  align-items:center;
  gap:11px;
  width:fit-content;
  max-width:100%;
  margin:clamp(32px,3vw,43px) 0 0;
  padding:12px 17px;
  border:1px solid rgba(196,204,211,.72);
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:rgba(255,255,255,.90);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
  backdrop-filter:blur(18px) saturate(135%);
  box-shadow:inset 0 1px rgba(255,255,255,.17);
  font:400 13px/1.4 'Sulphur Point',Arial,sans-serif;
}
.hse-cs__notice .hse-cs__symbol { font-size:19px; color:var(--cs-light-amber); }

/* 05 | VISUAL: ROUNDED GEOMETRIC HSE STORE WINDOW */
.hse-cs__visual {
  position:relative;
  isolation:isolate;
  width:100%;
  min-width:0;
  height:clamp(440px,41vw,600px);
  display:flex;
  align-items:center;
  justify-content:center;
}
.hse-cs__visual-halo {
  position:absolute;
  z-index:-2;
  inset:8%;
  border-radius:50%;
  background:rgba(255,200,74,.13);
  filter:blur(72px);
  pointer-events:none;
}
.hse-cs__visual-backplate {
  position:absolute;
  z-index:-1;
  inset:8% 11% 4% 1%;
  border:2px solid rgba(255,200,74,.49);
  border-radius:calc(var(--cs-radius) + 4px);
  transform:rotate(-5deg);
  box-shadow:0 0 0 5px rgba(255,200,74,.055);
  pointer-events:none;
}
.hse-cs__visual-panel {
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  width:calc(100% - 25px);
  height:calc(100% - 37px);
  min-width:0;
  padding:clamp(22px,2.7vw,39px);
  border:2px solid rgba(255,200,74,.63);
  border-radius:var(--cs-radius);
  overflow:hidden;
  background:
    radial-gradient(circle at 68% 30%,rgba(255,200,74,.13),transparent 48%),
    linear-gradient(135deg,rgba(49,50,48,.86),rgba(13,14,14,.80));
  -webkit-backdrop-filter:blur(24px) saturate(130%);
  backdrop-filter:blur(24px) saturate(130%);
  box-shadow:0 0 0 6px rgba(255,200,74,.15),inset 0 1px rgba(255,255,255,.23),0 28px 65px rgba(0,0,0,.34);
  transition:transform .48s var(--cs-ease),border-color .45s ease,box-shadow .48s var(--cs-ease);
}
.hse-cs__visual-panel:hover {
  transform:translateY(-5px);
  border-color:rgba(255,255,255,.94);
  box-shadow:0 0 0 6px rgba(255,255,255,.19),0 34px 75px rgba(0,0,0,.36);
}
.hse-cs__visual-panel::after {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(145deg,rgba(255,255,255,.045),transparent 43%);
  pointer-events:none;
}
.hse-cs__visual-topline {
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:rgba(255,255,255,.83);
  font:400 clamp(12px,1vw,15px)/1.3 'Bruno Ace','Oxanium',sans-serif;
  letter-spacing:.035em;
}
.hse-cs .hse-cs__visual-top-icon { color:var(--cs-amber); font-size:26px; }
.hse-cs__visual-center {
  position:relative;
  display:grid;
  place-items:center;
  flex:1;
  min-height:210px;
  isolation:isolate;
}
.hse-cs__visual-diamond {
  position:absolute;
  top:50%;
  left:50%;
  aspect-ratio:1;
  border-radius:20px;
  transform:translate(-50%,-50%) rotate(45deg);
  pointer-events:none;
}
.hse-cs__visual-diamond--outer {
  width:clamp(176px,21vw,293px);
  border:1px solid rgba(255,213,120,.7);
  background:linear-gradient(145deg,rgba(255,200,74,.12),rgba(255,200,74,.025));
  box-shadow:inset 0 1px rgba(255,255,255,.23),0 0 45px rgba(255,200,74,.065);
  animation:hse-cs-diamond-float 13s ease-in-out infinite;
}
.hse-cs__visual-diamond--inner {
  width:clamp(120px,13vw,177px);
  border:1px solid rgba(255,213,120,.85);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(255,200,74,.35),rgba(255,200,74,.1));
  box-shadow:inset 0 1px rgba(255,255,255,.25);
  transform:translate(-50%,-50%) rotate(0deg);
  transition:transform .7s var(--cs-ease),background .45s ease;
}
.hse-cs__visual-panel:hover .hse-cs__visual-diamond--inner {
  transform:translate(-50%,-50%) rotate(45deg);
  background:linear-gradient(145deg,rgba(255,200,74,.45),rgba(255,200,74,.13));
}
@keyframes hse-cs-diamond-float {
  0%,100% { transform:translate(-50%,-50%) rotate(45deg); }
  50% { transform:translate(calc(-50% + 6px),calc(-50% - 13px)) rotate(45deg); }
}
.hse-cs .hse-cs__visual-main-icon {
  position:relative;
  z-index:2;
  color:var(--cs-amber);
  font-size:clamp(48px,5vw,77px);
  text-shadow:0 6px 20px rgba(0,0,0,.28);
}
.hse-cs__visual-bottom {
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.hse-cs__visual-chip {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 13px;
  border:1px solid rgba(255,200,74,.75);
  border-radius:999px;
  background:rgba(255,200,74,.18);
  color:var(--cs-bright-amber);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  font:700 11px/1.2 'Oxanium',Arial,sans-serif;
  letter-spacing:.08em;
}
.hse-cs__visual-caption {
  color:rgba(255,255,255,.72);
  font:700 11px/1.4 'Oxanium',Arial,sans-serif;
  letter-spacing:.12em;
}
.hse-cs__visual-small-card {
  position:absolute;
  z-index:4;
  right:-7px;
  bottom:10px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:13px 17px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:13px;
  background:rgba(20,21,20,.72);
  color:#fff;
  -webkit-backdrop-filter:blur(22px) saturate(135%);
  backdrop-filter:blur(22px) saturate(135%);
  box-shadow:inset 0 1px rgba(255,255,255,.13),0 12px 36px rgba(0,0,0,.25);
  font:700 10px/1.25 'Oxanium',Arial,sans-serif;
  letter-spacing:.075em;
}
.hse-cs .hse-cs__visual-small-card .material-symbols-rounded { color:var(--cs-amber); font-size:22px; }

/* 06 | TABLET / MOBILE */
@media (max-width:1100px) {
  .hse-cs__layout { grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr); gap:clamp(24px,4vw,60px); }
  .hse-cs #hse-cs-title { font-size:clamp(42px,5.1vw,66px); }
  .hse-cs__visual { height:clamp(390px,45vw,520px); }
  .hse-cs__visual-small-card { right:-3px; }
}
@media (max-width:920px) {
  .hse-cs__hero { padding:clamp(112px,12vw,146px) 0 91px; }
  .hse-cs__layout { grid-template-columns:1fr; gap:clamp(48px,7vw,80px); }
  .hse-cs__content { max-width:770px; }
  .hse-cs #hse-cs-title { font-size:clamp(44px,7.1vw,73px); }
  .hse-cs__visual { width:min(100%,650px); height:clamp(400px,65vw,550px); margin-inline:auto; }
  .hse-cs__visual-diamond--outer { width:clamp(190px,27vw,270px); }
  .hse-cs__visual-diamond--inner { width:clamp(126px,17vw,173px); }
}
@media (max-width:600px) {
  .hse-cs-shell { --cs-gutter:20px; }
  .hse-cs__hero { min-height:0; padding:clamp(106px,19vw,145px) 0 78px; }
  .hse-cs__layout { gap:47px; }
  .hse-cs__eyebrow { letter-spacing:.075em; }
  .hse-cs #hse-cs-title { font-size:clamp(39px,9.1vw,58px); }
  .hse-cs .hse-cs__description { margin-top:23px; font-size:16px; }
  .hse-cs__actions { gap:10px; }
  .hse-cs .hse-cs__button { min-height:47px; font-size:11px; padding:11px 15px; }
  .hse-cs .hse-cs__notice { border-radius:17px; margin-top:28px; }
  .hse-cs__visual { width:min(100%,470px); height:clamp(310px,83vw,410px); }
  .hse-cs__visual-panel { width:calc(100% - 18px); height:calc(100% - 30px); padding:20px; }
  .hse-cs__visual-diamond--outer { width:clamp(154px,43vw,212px); border-radius:16px; }
  .hse-cs__visual-diamond--inner { width:clamp(110px,29vw,146px); border-radius:12px; }
  .hse-cs .hse-cs__visual-main-icon { font-size:52px; }
  .hse-cs__visual-center { min-height:165px; }
  .hse-cs__visual-topline { font-size:11px; }
  .hse-cs__visual-small-card { bottom:0; right:-2px; font-size:9px; padding:11px 12px; }
  .hse-cs__visual-caption { font-size:9px; }
}
@media (max-width:430px) {
  .hse-cs-shell { --cs-gutter:18px; }
  .hse-cs__hero { padding-top:115px; }
  .hse-cs #hse-cs-title { font-size:clamp(36px,9vw,45px); }
  .hse-cs .hse-cs__eyebrow { gap:8px; padding:8px 12px; font-size:10px; letter-spacing:.055em; }
  .hse-cs__actions { display:flex; align-items:stretch; flex-direction:column; width:fit-content; max-width:100%; }
  .hse-cs .hse-cs__button { width:100%; justify-content:space-between; gap:15px; }
  .hse-cs__visual { height:clamp(295px,89vw,360px); }
  .hse-cs__visual-panel { padding:18px; }
  .hse-cs__visual-topline { font-size:10px; }
  .hse-cs__visual-bottom { gap:9px; }
  .hse-cs__visual-chip { font-size:9px; padding:8px 11px; }
  .hse-cs__visual-small-card { gap:8px; }
}

/* 07 | ACCESSIBILITY: RESPECT REDUCED MOTION */
@media (prefers-reduced-motion:reduce) {
  .hse-cs *, .hse-cs *::before, .hse-cs *::after {
    animation:none!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .hse-cs__button:hover, .hse-cs__visual-panel:hover { transform:none!important; }
}