:root{
  --glass-top: rgba(255,255,255,.045);
  --glass-bottom: rgba(255,255,255,.012);
  --glass-border: rgba(126,10,66,.90);

  --magenta-edge-dark: rgba(58,4,30,.99);
  --magenta-edge-mid: rgba(128,10,66,.98);
  --magenta-edge-light: rgba(255,56,154,.92);
  --magenta-edge-hot: rgba(255,164,220,.86);

  --glass-shadow-inner: rgba(0,0,0,.55);
  --pink-edge: rgba(190,18,96,.98);

  --text:#f6f2f4;
  --muted:rgba(246,242,244,.76);
  --soft:rgba(246,242,244,.58);
}

*{
  box-sizing:border-box;
}

html,
body{
  margin:0;
  padding:0;
  width:100%;
  min-height:100%;
}

body{
  font-family:Georgia,"Times New Roman",serif;
  color:var(--text);
  display:flex;
  justify-content:center;
  padding:46px 20px;
  position:relative;
  overflow-x:hidden;
  background:
    linear-gradient(rgba(0,0,0,.92), rgba(0,0,0,.92)),
    url("carbon-fiber.jpg");
  background-size:auto, 280px;
  background-repeat:no-repeat, repeat;
  background-position:center, center top;
}

body::before,
body::after,
.page::before{
  display:none;
}

.page{
  width:100%;
  max-width:1100px;
  position:relative;
  z-index:1;
}

/* NAV */

.nav-wrap{
  margin-bottom:46px;
  position:relative;
  z-index:2;
}

.nav-wrap::before{
  content:"";
  position:absolute;
  left:8%;
  right:8%;
  top:10px;
  height:76px;
  border-radius:999px;
  background:
    radial-gradient(circle, rgba(255,95,175,.24), transparent 72%);
  filter:blur(26px);
  opacity:.55;
  pointer-events:none;
}

.top-bar{
  position:relative;
  padding:22px 34px;
  border-radius:999px;
  border:1px solid var(--glass-border);
  background:
    linear-gradient(180deg,var(--glass-top),var(--glass-bottom));
  backdrop-filter:blur(18px) saturate(175%);
  -webkit-backdrop-filter:blur(18px) saturate(175%);
  box-shadow:
    0 22px 48px rgba(0,0,0,.7),
    inset 0 2px 0 rgba(104,8,54,.95),
    inset 0 -10px 28px var(--glass-shadow-inner),
    0 0 28px rgba(255,70,170,.08);
  overflow:hidden;
}

.top-bar::before{
  content:"";
  position:absolute;
  top:2px;
  left:10%;
  right:10%;
  height:1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--magenta-edge-dark) 14%,
      var(--magenta-edge-mid) 34%,
      var(--magenta-edge-light) 48%,
      var(--magenta-edge-hot) 50%,
      var(--magenta-edge-light) 52%,
      var(--magenta-edge-mid) 66%,
      var(--magenta-edge-dark) 86%,
      transparent
    );
  pointer-events:none;
}

.top-bar::after{
  content:"";
  position:absolute;
  bottom:0;
  left:22%;
  right:22%;
  height:2px;
  background:
    linear-gradient(90deg,transparent,var(--pink-edge),transparent);
  pointer-events:none;
}

.nav-links{
  display:flex;
  justify-content:center;
  gap:30px;
  flex-wrap:wrap;
}

.nav-links a{
  color:white;
  text-decoration:none;
  font-size:.74rem;
  letter-spacing:.21em;
  text-transform:uppercase;
  padding:12px 14px;
  border-radius:999px;
  transition:.25s;
}

.nav-links a:hover,
.nav-links a.active{
  background:rgba(255,255,255,.09);
  box-shadow:
    0 0 18px rgba(255,95,175,.28),
    inset 0 1px 0 rgba(255,255,255,.16);
}

/* HERO / CARDS */

.hero-wrap{
  position:relative;
  z-index:2;
  margin-bottom:28px;
}

.hero-wrap::before{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  top:22px;
  height:140px;
  border-radius:999px;
  background:
    radial-gradient(circle, rgba(255,95,175,.20), transparent 78%);
  filter:blur(34px);
  opacity:.55;
  pointer-events:none;
}

.hero-card,
.content-card,
.product-card,
.trust-card,
.faq-item{
  position:relative;
  border:1px solid var(--glass-border);
  background:
    linear-gradient(180deg,var(--glass-top),var(--glass-bottom));
  backdrop-filter:blur(18px) saturate(175%);
  -webkit-backdrop-filter:blur(18px) saturate(175%);
  box-shadow:
    0 46px 110px rgba(0,0,0,.82),
    inset 0 2px 0 rgba(104,8,54,.95),
    inset 0 -18px 42px rgba(0,0,0,.7),
    0 0 34px rgba(255,70,170,.06);
  overflow:hidden;
}

.hero-card{
  border-radius:36px;
  padding:58px 54px 56px;
  text-align:center;
}

.content-card{
  border-radius:26px;
  padding:34px 32px 30px;
}

.trust-card{
  border-radius:24px;
  padding:18px 22px;
  text-align:center;
}

.hero-card::before,
.content-card::before,
.product-card::before,
.trust-card::before,
.faq-item::before{
  content:"";
  position:absolute;
  top:2px;
  left:12%;
  right:12%;
  height:1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--magenta-edge-dark) 14%,
      var(--magenta-edge-mid) 34%,
      var(--magenta-edge-light) 48%,
      var(--magenta-edge-hot) 50%,
      var(--magenta-edge-light) 52%,
      var(--magenta-edge-mid) 66%,
      var(--magenta-edge-dark) 86%,
      transparent
    );
  pointer-events:none;
}

.hero-card::after,
.content-card::after,
.product-card::after,
.trust-card::after,
.faq-item::after{
  content:"";
  position:absolute;
  bottom:0;
  left:26%;
  right:26%;
  height:2px;
  background:
    linear-gradient(90deg,transparent,var(--pink-edge),transparent);
  pointer-events:none;
}

/* INNER PAGE LOGO */

.inner-logo-wrap{
  position:relative;
  display:flex;
  justify-content:center;
  margin-bottom:18px;
}

.inner-logo-wrap::before{
  content:"";
  position:absolute;
  width:min(440px,100%);
  height:150px;
  top:-10px;
  left:50%;
  transform:translateX(-50%);
  background:
    radial-gradient(
      ellipse at 50% 34%,
      rgba(255,255,255,.09),
      rgba(255,255,255,.035) 24%,
      rgba(255,95,175,.045) 50%,
      transparent 74%
    );
  filter:blur(18px);
  pointer-events:none;
}

.inner-logo{
  width:min(260px,72%);
  position:relative;
  z-index:1;
  filter:
    drop-shadow(0 18px 40px rgba(0,0,0,.86))
    drop-shadow(0 0 18px rgba(255,60,170,.07));
}

/* TYPOGRAPHY */

.eyebrow{
  display:inline-block;
  margin-bottom:18px;
  font-size:.72rem;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(255,255,255,.7);
}

h1{
  margin:0 0 18px;
  font-size:clamp(2rem, 4.4vw, 3.4rem);
  font-weight:500;
  letter-spacing:.03em;
}

.hero-text{
  max-width:760px;
  margin:0 auto;
  font-size:1.06rem;
  line-height:1.95;
  color:var(--muted);
  text-wrap:balance;
}

.section-title{
  margin:0 0 12px;
  font-size:1.08rem;
  letter-spacing:.03em;
  font-weight:500;
  color:var(--text);
}

.section-copy,
.body-copy,
.policy-copy,
.notice-copy{
  color:var(--muted);
  font-size:1rem;
  line-height:1.9;
}

.section-copy p,
.body-copy p,
.policy-copy p,
.notice-copy p{
  margin:0 0 18px;
}

.section-copy p:last-child,
.body-copy p:last-child,
.policy-copy p:last-child,
.notice-copy p:last-child{
  margin-bottom:0;
}

.policy-copy a,
.notice-copy a,
.contact a,
.info-list a{
  color:#f3a4c7;
  text-decoration:none;
}

.policy-copy a:hover,
.notice-copy a:hover,
.contact a:hover,
.info-list a:hover{
  text-decoration:underline;
  color:#ff6bb8;
}

.policy-footer{
  margin-top:34px;
  padding-top:20px;
  border-top:1px solid rgba(243,164,199,0.12);
  font-size:.88rem;
  line-height:1.8;
  color:rgba(246,242,244,.58);
}

/* BUTTONS */

.primary-btn,
.secondary-btn,
.enter-store{
  display:inline-block;
  text-decoration:none;
  font-size:.84rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-radius:999px;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    filter .25s ease,
    background .25s ease;
  position:relative;
  overflow:hidden;
}

.primary-btn,
.enter-store{
  color:white;
  background:
    radial-gradient(120% 160% at 50% 8%, rgba(255,255,255,.22), transparent 34%),
    linear-gradient(
      145deg,
      #f652b0 0%,
      #df2d8f 22%,
      #aa145c 48%,
      #6f0b39 74%,
      #2f0117 100%
    );
  border:1px solid rgba(150,18,74,.96);
  box-shadow:
    0 0 34px rgba(220,45,135,.42),
    0 24px 52px rgba(0,0,0,.9),
    inset 0 2px 0 rgba(255,255,255,.54),
    inset 0 -16px 40px rgba(0,0,0,.74);
}

.enter-store{
  margin-top:54px;
  padding:20px 60px;
  font-size:.9rem;
}

.primary-btn{
  padding:18px 34px;
}

.primary-btn::before,
.enter-store::before{
  content:"";
  position:absolute;
  top:-145%;
  left:-28%;
  width:24%;
  height:420%;
  background:
    linear-gradient(
      120deg,
      rgba(255,255,255,0) 0%,
      rgba(255,185,225,.04) 18%,
      rgba(255,120,190,.12) 34%,
      rgba(255,225,242,.30) 50%,
      rgba(255,120,190,.12) 66%,
      rgba(255,185,225,.04) 82%,
      rgba(255,255,255,0) 100%
    );
  transform:rotate(18deg);
  filter:blur(4px);
  animation:buttonSheen 8.4s linear infinite;
  opacity:.95;
  mix-blend-mode:screen;
}

.primary-btn::after,
.enter-store::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 50% 135%, rgba(0,0,0,.35), transparent 60%),
    radial-gradient(circle at 50% -34%, rgba(255,255,255,.24), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.05) 10%, rgba(0,0,0,0) 34%, rgba(0,0,0,0) 72%, rgba(0,0,0,.18) 100%),
    linear-gradient(90deg, rgba(255,255,255,.07), transparent 7%, transparent 93%, rgba(0,0,0,.12));
  pointer-events:none;
}

.primary-btn:hover,
.secondary-btn:hover,
.enter-store:hover{
  transform:translateY(-2px);
}

.primary-btn:hover,
.enter-store:hover{
  box-shadow:
    0 0 48px rgba(220,45,135,.56),
    0 28px 70px rgba(0,0,0,.95),
    inset 0 2px 0 rgba(255,255,255,.62),
    inset 0 -18px 44px rgba(0,0,0,.8);
  filter:saturate(1.08);
}

.secondary-btn{
  color:white;
  border:1px solid rgba(170,28,90,.56);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.012));
  box-shadow:
    0 16px 34px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.08);
  padding:18px 34px;
}

.secondary-btn:hover{
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.02));
  box-shadow:
    0 18px 42px rgba(0,0,0,.5),
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 18px rgba(255,95,175,.16);
}

@keyframes buttonSheen{
  0%{ left:-30%; }
  100%{ left:112%; }
}

/* FORM */

.contact-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:26px;
  position:relative;
  z-index:2;
}

.contact-form{
  display:grid;
  gap:18px;
}

.form-row{
  display:grid;
  gap:8px;
}

.form-row label{
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.74);
}

.contact-form input,
.contact-form textarea{
  width:100%;
  border-radius:18px;
  border:1px solid rgba(170,28,90,.48);
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  color:var(--text);
  font:inherit;
  padding:16px 18px;
  outline:none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 24px rgba(0,0,0,.24);
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.contact-form textarea{
  min-height:180px;
  resize:vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:rgba(246,242,244,.42);
}

.contact-form input:focus,
.contact-form textarea:focus{
  border-color:rgba(255,95,175,.62);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(255,95,175,.18),
    0 12px 28px rgba(0,0,0,.28),
    0 0 22px rgba(255,95,175,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
}

/* FAQ */

.faq-list{
  display:grid;
  gap:18px;
  position:relative;
  z-index:2;
}

.faq-item{
  border-radius:24px;
}

.faq-item summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:24px 28px;
  position:relative;
  z-index:1;
}

.faq-item summary::-webkit-details-marker{
  display:none;
}

.faq-question{
  margin:0;
  font-size:1.02rem;
  letter-spacing:.03em;
  font-weight:500;
  color:var(--text);
}

.faq-chevron{
  flex:0 0 auto;
  width:14px;
  height:14px;
  border-right:2px solid rgba(255,255,255,.72);
  border-bottom:2px solid rgba(255,255,255,.72);
  transform:rotate(45deg);
  transition:transform .25s ease, border-color .25s ease;
  margin-top:-4px;
}

.faq-item[open] .faq-chevron{
  transform:rotate(225deg);
  border-color:#ff6bb8;
  margin-top:4px;
}

.faq-answer-wrap{
  padding:0 28px 24px;
  margin-top:-6px;
  position:relative;
  z-index:1;
}

.faq-answer-wrap::before{
  content:"";
  display:block;
  height:1px;
  margin-bottom:16px;
  background:
    linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.10), rgba(255,255,255,0));
}

.faq-answer{
  margin:0;
  color:var(--muted);
  font-size:.98rem;
  line-height:1.88;
}

/* LISTS / PILLS */

.pill-list,
.info-list{
  display:grid;
  gap:14px;
  margin:0;
  padding:0;
  list-style:none;
}

.pill-list li,
.info-list li{
  padding:16px 18px;
  border-radius:18px;
  border:1px solid rgba(170,28,90,.46);
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 8px 22px rgba(0,0,0,.26);
  color:var(--muted);
  line-height:1.75;
}

.pill-list strong,
.info-list strong{
  display:block;
  margin-bottom:4px;
  color:var(--text);
  font-weight:500;
  letter-spacing:.02em;
}

.bullet-list{
  margin:0;
  padding-left:18px;
  color:var(--muted);
  font-size:.98rem;
  line-height:1.88;
}

.bullet-list li{
  margin-bottom:8px;
}

.bullet-list li:last-child{
  margin-bottom:0;
}

/* STORE */

.store-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
  position:relative;
  z-index:2;
}

.product-card{
  border-radius:24px;
  padding:18px;
  text-align:left;
  transition:
    transform .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}

.product-card:hover{
  transform:translateY(-3px);
  border-color:rgba(255,120,190,.42);
  box-shadow:
    0 0 28px rgba(223,77,141,.14),
    0 28px 60px rgba(0,0,0,.52),
    inset 0 2px 0 rgba(104,8,54,.95),
    inset 0 -18px 42px rgba(0,0,0,.7);
}

.product-image{
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
  border-radius:16px;
  display:block;
  margin-bottom:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 24px rgba(0,0,0,.24);
}

.product-title{
  margin:0 0 8px 0;
  font-size:1.05rem;
  letter-spacing:.05em;
  font-weight:500;
  color:var(--text);
}

.product-desc{
  margin:0 0 14px 0;
  line-height:1.72;
  color:var(--muted);
  font-size:.95rem;
}

.product-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.price{
  font-size:1.05rem;
  letter-spacing:.04em;
  color:var(--text);
}

.view-btn{
  display:inline-block;
  padding:10px 16px;
  border-radius:999px;
  text-decoration:none;
  font-size:.82rem;
  letter-spacing:.08em;
  white-space:nowrap;
  color:white;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(120% 160% at 50% 8%, rgba(255,255,255,.16), transparent 34%),
    linear-gradient(
      145deg,
      rgba(243,164,199,.24) 0%,
      rgba(176,24,91,.30) 48%,
      rgba(66,8,32,.62) 100%
    );
  border:1px solid rgba(243,164,199,.24);
  box-shadow:
    0 10px 24px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.10);
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    filter .25s ease,
    background .25s ease;
}

.view-btn:hover{
  transform:translateY(-1px);
  background:
    radial-gradient(120% 160% at 50% 8%, rgba(255,255,255,.19), transparent 34%),
    linear-gradient(
      145deg,
      rgba(243,164,199,.34) 0%,
      rgba(176,24,91,.40) 48%,
      rgba(66,8,32,.72) 100%
    );
  box-shadow:
    0 0 18px rgba(223,77,141,.18),
    0 14px 30px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.trust-wrap{
  margin-top:30px;
  position:relative;
  z-index:2;
}

.trust{
  margin:0;
  font-size:.8rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(243,164,199,.62);
}

/* FOOTER */

.footer{
  margin-top:70px;
  padding:8px 20px 18px;
  text-align:center;
  opacity:.82;
}

.footer-inner{
  display:flex;
  flex-direction:column;
  gap:18px;
  align-items:center;
}

.footer-links{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:22px;
}

.footer a{
  color:rgba(255,255,255,.72);
  text-decoration:none;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  transition:.2s ease;
}

.footer a:hover{
  color:#ff6bb8;
}

.footer-copy{
  color:rgba(255,255,255,.55);
  font-size:.85rem;
  line-height:1.7;
}

/* LAYOUT HELPERS */

.about-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:26px;
  position:relative;
  z-index:2;
}

.content-grid{
  display:grid;
  gap:26px;
  margin-top:26px;
  position:relative;
  z-index:2;
}

.secondary-wrap{
  margin-top:26px;
  position:relative;
  z-index:2;
}

.secondary-card{
  position:relative;
  border-radius:30px;
  padding:36px 36px 40px;
  border:1px solid var(--glass-border);
  background:
    linear-gradient(180deg,var(--glass-top),var(--glass-bottom));
  backdrop-filter:blur(18px) saturate(175%);
  -webkit-backdrop-filter:blur(18px) saturate(175%);
  box-shadow:
    0 30px 80px rgba(0,0,0,.62),
    inset 0 2px 0 rgba(104,8,54,.95),
    inset 0 -18px 42px rgba(0,0,0,.7),
    0 0 24px rgba(255,70,170,.05);
  overflow:hidden;
  text-align:center;
}

.secondary-card::before{
  content:"";
  position:absolute;
  top:2px;
  left:12%;
  right:12%;
  height:1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--magenta-edge-dark) 14%,
      var(--magenta-edge-mid) 34%,
      var(--magenta-edge-light) 48%,
      var(--magenta-edge-hot) 50%,
      var(--magenta-edge-light) 52%,
      var(--magenta-edge-mid) 66%,
      var(--magenta-edge-dark) 86%,
      transparent
    );
  pointer-events:none;
}

.secondary-card::after{
  content:"";
  position:absolute;
  bottom:0;
  left:26%;
  right:26%;
  height:2px;
  background:
    linear-gradient(90deg,transparent,var(--pink-edge),transparent);
  pointer-events:none;
}

.secondary-card p{
  max-width:760px;
  margin:0 auto 24px;
  color:var(--muted);
  line-height:1.9;
  font-size:1rem;
}

.cta-row{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
}

.contact{
  margin-top:42px;
  font-size:.95rem;
  opacity:.9;
}

/* RESPONSIVE */

@media (max-width:920px){
  .about-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:900px){
  .store-grid{
    grid-template-columns:repeat(2, 1fr);
  }
}

@media (max-width:820px){
  body{
    padding:20px 12px;
    background-size:auto, 230px;
  }

  .nav-wrap{
    margin-bottom:26px;
  }

  .top-bar{
    padding:16px 18px;
    border-radius:24px;
  }

  .nav-links{
    gap:16px;
  }

  .nav-links a{
    font-size:.66rem;
    letter-spacing:.13em;
    padding:8px 9px;
  }

  .hero-card{
    padding:42px 22px 40px;
    border-radius:24px;
  }

  .content-card{
    padding:26px 22px 24px;
    border-radius:22px;
  }

  .secondary-card{
    padding:28px 22px 30px;
    border-radius:22px;
  }

  .faq-item{
    border-radius:22px;
  }

  .faq-item summary{
    padding:20px 20px;
  }

  .faq-answer-wrap{
    padding:0 20px 20px;
  }

  .inner-logo{
    width:min(210px,74%);
  }

  .hero-text,
  .section-copy,
  .body-copy,
  .policy-copy,
  .notice-copy,
  .faq-answer,
  .product-desc,
  .bullet-list,
  .secondary-card p{
    font-size:.96rem;
    line-height:1.78;
  }

  .section-title{
    font-size:1rem;
  }

  .faq-question{
    font-size:.98rem;
  }

  .trust{
    font-size:.72rem;
    line-height:1.7;
  }

  .enter-store{
    width:100%;
    max-width:340px;
    padding:18px 24px;
  }

  .footer{
    margin-top:46px;
    padding:0 10px 8px;
  }

  .footer-inner{
    gap:14px;
  }

  .footer-links{
    gap:14px 16px;
  }

  .footer a{
    font-size:.62rem;
    letter-spacing:.11em;
  }
}

@media (max-width:640px){
  .store-grid{
    grid-template-columns:1fr;
  }

  .product-card{
    border-radius:22px;
  }
}

@media (max-width:820px) and (orientation:landscape){
  body{
    padding:10px;
    background-size:auto, 210px;
  }

  .top-bar{
    padding:12px 14px;
    border-radius:20px;
  }

  .nav-links{
    gap:10px;
  }

  .nav-links a{
    font-size:.6rem;
    letter-spacing:.1em;
    padding:7px 7px;
  }

  .hero-card{
    padding:28px 18px 26px;
    border-radius:20px;
  }

  .content-card,
  .secondary-card{
    padding:22px 18px 20px;
    border-radius:20px;
  }

  .faq-item{
    border-radius:20px;
  }

  .faq-item summary{
    padding:18px 18px;
  }

  .faq-answer-wrap{
    padding:0 18px 18px;
  }

  .inner-logo{
    width:min(180px,62%);
  }

  .footer{
    margin-top:30px;
  }

  .footer a{
    font-size:.58rem;
    letter-spacing:.1em;
  }
}

@media (prefers-reduced-motion: reduce){
  .primary-btn::before,
  .enter-store::before{
    animation:none;
  }

  .primary-btn,
  .secondary-btn,
  .enter-store,
  .nav-links a,
  .footer a,
  .contact-form input,
  .contact-form textarea,
  .faq-chevron{
    transition:none;
  }
}

/* INDEX PAGE */

.card-wrap{
  position:relative;
  z-index:2;
}

.card-wrap::before{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  top:22px;
  height:140px;
  border-radius:999px;
  background:
    radial-gradient(circle, rgba(255,95,175,.20), transparent 78%);
  filter:blur(34px);
  opacity:.55;
  pointer-events:none;
}

.card{
  position:relative;
  padding:84px 54px 62px;
  border-radius:36px;
  border:1px solid var(--glass-border);
  background:
    linear-gradient(180deg,var(--glass-top),var(--glass-bottom));
  backdrop-filter:blur(18px) saturate(175%);
  -webkit-backdrop-filter:blur(18px) saturate(175%);
  box-shadow:
    0 46px 110px rgba(0,0,0,.82),
    inset 0 2px 0 rgba(104,8,54,.95),
    inset 0 -18px 42px rgba(0,0,0,.7),
    0 0 34px rgba(255,70,170,.06);
  text-align:center;
  overflow:hidden;
}

.card::before{
  content:"";
  position:absolute;
  top:2px;
  left:12%;
  right:12%;
  height:1px;
  background:
    linear-gradient(
      90deg,
      transparent,
      var(--magenta-edge-dark) 14%,
      var(--magenta-edge-mid) 34%,
      var(--magenta-edge-light) 48%,
      var(--magenta-edge-hot) 50%,
      var(--magenta-edge-light) 52%,
      var(--magenta-edge-mid) 66%,
      var(--magenta-edge-dark) 86%,
      transparent
    );
  pointer-events:none;
}

.card::after{
  content:"";
  position:absolute;
  bottom:0;
  left:26%;
  right:26%;
  height:2px;
  background:
    linear-gradient(90deg,transparent,var(--pink-edge),transparent);
  pointer-events:none;
}

.logo-wrap{
  position:relative;
  display:flex;
  justify-content:center;
}

.logo-wrap::before{
  content:"";
  position:absolute;
  width:min(700px,100%);
  height:220px;
  top:-16px;
  left:50%;
  transform:translateX(-50%);
  background:
    radial-gradient(
      ellipse at 50% 34%,
      rgba(255,255,255,.10),
      rgba(255,255,255,.04) 24%,
      rgba(255,95,175,.05) 50%,
      transparent 74%
    );
  filter:blur(20px);
  pointer-events:none;
}

.logo{
  width:min(520px,90%);
  margin-bottom:30px;
  position:relative;
  z-index:1;
  filter:
    drop-shadow(0 22px 52px rgba(0,0,0,.9))
    drop-shadow(0 0 22px rgba(255,60,170,.08));
}

.tagline{
  max-width:640px;
  margin:auto;
  font-size:1.05rem;
  line-height:1.92;
  letter-spacing:.01em;
  color:var(--muted);
  font-weight:500;
  text-wrap:balance;
}