/* ============================================================
   Sub-pages (treatments / insights / pricing / certificates / contact)
   + site-wide components: sticky page nav, page hero, CTA band.
   Loaded AFTER styles.css; reuses its tokens and components.
   ============================================================ */

/* ---------- sticky page nav ---------- */
.pnav{
  position:sticky;
  top:0;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:calc(20 * var(--u));
  min-height:calc(64 * var(--u));
  padding:0 calc(72 * var(--u));
  background:rgba(22,18,13,.74);
  backdrop-filter:blur(calc(14 * var(--u))) saturate(.9);
  -webkit-backdrop-filter:blur(calc(14 * var(--u))) saturate(.9);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.pnav__brand{
  font-size:calc(16.1 * var(--u) * var(--fs-text));
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.1;
  color:var(--ink);
  text-decoration:none;
  white-space:nowrap;
  transition:opacity .25s ease;
}
.pnav__brand:hover{ opacity:.7; }
.pnav__brand i{
  display:block;
  font-style:italic;
  font-weight:400;
  font-size:calc(11.3 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.45);
}
@media (min-width:1001px){
  .pnav .nav__links{
    position:static;
    display:flex;
    align-items:center;
    gap:calc(11 * var(--u));
    animation:none;
  }
  .pnav .pill{ animation:none; }
}
.pill--on{
  background:rgba(255,255,255,.92);
  border-color:rgba(255,255,255,.92);
  color:#16140f;
}
.pill--on:hover{
  background:#fff;
  border-color:#fff;
  color:#16140f;
}

/* ---------- page hero ---------- */
.phead{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:calc(150 * var(--u)) calc(72 * var(--u)) calc(96 * var(--u));
  border-bottom:1px solid rgba(255,255,255,.09);
}
.phead__bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center center;
  pointer-events:none; user-select:none; -webkit-user-drag:none;
  animation:plate-in 1.6s var(--e) both;
  z-index:1;
}
.phead__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.58) 0%, rgba(0,0,0,.18) 30%),
    linear-gradient(to top,    rgba(0,0,0,.66) 0%, rgba(0,0,0,.16) 42%),
    radial-gradient(120% 90% at 50% 42%, rgba(0,0,0,0) 38%, rgba(0,0,0,.46) 100%);
  pointer-events:none;
  animation:fade-in 1.4s ease both;
  z-index:2;
}
.phead > :not(.phead__bg):not(.phead__scrim){ position:relative; z-index:3; }
.phead .sect__no{ margin-bottom:calc(38 * var(--u)); }
.phead__title{
  margin:0;
  font-size:calc(72 * var(--u));
  font-weight:500;
  line-height:1.02;
  letter-spacing:-.03em;
}
.phead__title .line:nth-child(2){ --dl:.18s; }
.phead__note{
  margin:calc(34 * var(--u)) 0 0;
  max-width:calc(560 * var(--u));
  font-size:calc(15.4 * var(--u) * var(--fs-text));
  line-height:1.85;
  letter-spacing:.01em;
  color:var(--ink-dim);
  text-shadow:0 1px calc(14 * var(--u)) rgba(0,0,0,.55);
}

/* ---------- CTA band (site-wide, before footer) ---------- */
.cta{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  column-gap:calc(90 * var(--u));
  align-items:end;
  padding:calc(130 * var(--u)) calc(72 * var(--u));
  border-top:1px solid rgba(255,255,255,.09);
}
.cta__lead{ align-self:start; }
.cta__title{
  margin:calc(4 * var(--u)) 0 0;
  font-size:calc(46 * var(--u));
  font-weight:500;
  line-height:1.16;
  letter-spacing:-.015em;
}
.cta__note{
  margin:calc(30 * var(--u)) 0 0;
  max-width:calc(320 * var(--u));
  font-size:calc(14.0 * var(--u) * var(--fs-text));
  line-height:1.85;
  color:var(--ink-dim);
}
.cta__btns{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:calc(18 * var(--u));
}
.cta__wa{
  display:inline-flex;
  align-items:center;
  gap:calc(12 * var(--u));
  height:calc(56 * var(--u));
  padding:0 calc(30 * var(--u));
  border-radius:999px;
  background:#f3f0ea;
  color:#16140f;
  font-family:inherit;
  font-size:calc(16.1 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.01em;
  text-decoration:none;
  white-space:nowrap;
  transition:background .25s ease;
}
.cta__wa:hover{ background:#fff; }
.cta__wa svg{
  width:calc(19 * var(--u));
  height:calc(19 * var(--u));
  fill:#16140f;
  flex:0 0 auto;
}
.cta__ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:calc(56 * var(--u));
  padding:0 calc(28 * var(--u));
  border-radius:999px;
  border:1px solid rgba(255,255,255,.32);
  color:var(--ink);
  font-family:inherit;
  font-size:calc(16.1 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.01em;
  text-decoration:none;
  white-space:nowrap;
  transition:border-color .25s ease, background .25s ease;
}
.cta__ghost:hover{
  border-color:rgba(255,255,255,.7);
  background:rgba(255,255,255,.06);
}
.cta__hint{
  flex-basis:100%;
  margin:calc(4 * var(--u)) 0 0;
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.02em;
  color:rgba(255,255,255,.35);
}

/* ---------- sub-page section (slightly tighter than home) ---------- */
.section--page{ padding-top:calc(120 * var(--u)); padding-bottom:calc(120 * var(--u)); }
.section--tight{ padding-top:calc(100 * var(--u)); padding-bottom:calc(100 * var(--u)); }

/* device / laser detail rows */
.dev__row{
  display:grid;
  grid-template-columns:calc(46 * var(--u)) minmax(0,1fr);
  gap:calc(28 * var(--u));
  padding:calc(36 * var(--u)) 0;
  border-top:1px solid rgba(255,255,255,.10);
}
.dev__row:last-child{ border-bottom:1px solid rgba(255,255,255,.10); }
.dev__row .dir__no{ padding-top:calc(6 * var(--u)); }
.dev__name{
  margin:0;
  font-size:calc(26 * var(--u));
  font-weight:500;
  line-height:1.15;
  letter-spacing:-.005em;
}
.dev__name sup{
  font-size:.5em;
  font-weight:400;
  color:rgba(255,255,255,.5);
  margin-left:.1em;
}
.dev__tags{
  margin:calc(12 * var(--u)) 0 0;
  font-size:calc(12.9 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.05em;
  color:rgba(255,255,255,.5);
}
.dev__desc{
  margin:calc(14 * var(--u)) 0 0;
  max-width:calc(500 * var(--u));
  font-size:calc(14.5 * var(--u) * var(--fs-text));
  line-height:1.8;
  letter-spacing:.01em;
  color:var(--ink-dim);
}
.dev__desc b{
  font-weight:500;
  color:rgba(255,255,255,.85);
}

/* article / care list rows (editorial, no cards) */
.art__row{
  display:grid;
  grid-template-columns:calc(46 * var(--u)) minmax(0,1fr) auto;
  gap:calc(28 * var(--u));
  align-items:baseline;
  padding:calc(30 * var(--u)) 0;
  border-top:1px solid rgba(255,255,255,.10);
}
.art__row:last-child{ border-bottom:1px solid rgba(255,255,255,.10); }
.art__title{
  margin:0;
  font-size:calc(19 * var(--u));
  font-weight:500;
  line-height:1.3;
  letter-spacing:.01em;
}
.art__meta{
  margin:calc(8 * var(--u)) 0 0;
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  letter-spacing:.06em;
  color:rgba(255,255,255,.42);
}
.art__go{
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.55);
  text-decoration:none;
  white-space:nowrap;
  transition:color .25s ease;
}
.art__go:hover{ color:#fff; }
.art__row--soon .art__title{ color:rgba(255,255,255,.42); }
.art__row--soon .art__go{ color:rgba(255,255,255,.28); }

/* price rows */
.price__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:calc(24 * var(--u));
  align-items:baseline;
  padding:calc(28 * var(--u)) 0;
  border-top:1px solid rgba(255,255,255,.10);
}
.price__row:last-child{ border-bottom:1px solid rgba(255,255,255,.10); }
.price__name{
  margin:0;
  font-size:calc(20.2 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.01em;
}
.price__items{
  margin:calc(8 * var(--u)) 0 0;
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  line-height:1.8;
  letter-spacing:.02em;
  color:rgba(255,255,255,.5);
}
.price__val{
  font-size:calc(14.3 * var(--u) * var(--fs-text));
  font-style:italic;
  letter-spacing:.04em;
  color:rgba(255,255,255,.42);
  white-space:nowrap;
}
.price__note{
  margin:calc(30 * var(--u)) 0 0;
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  line-height:1.9;
  letter-spacing:.01em;
  color:rgba(255,255,255,.4);
}

/* inline "read more" link under section bodies (homepage) */
.more{
  display:inline-block;
  margin-top:calc(30 * var(--u));
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  letter-spacing:.14em;
  color:rgba(255,255,255,.55);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.22);
  padding-bottom:calc(4 * var(--u));
  transition:color .35s ease, border-color .35s ease;
}
.more:hover{ color:#fff; border-color:rgba(255,255,255,.6); }

/* certificate / ad placeholder frames */
.cert__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:calc(26 * var(--u));
}
.cert{
  position:relative;
  aspect-ratio:4/3;
  border:1px dashed rgba(255,255,255,.18);
  border-radius:calc(6 * var(--u));
  display:grid;
  place-content:center;
  text-align:center;
  gap:calc(8 * var(--u));
  padding:calc(18 * var(--u));
}
.cert__no{
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.26em;
  color:rgba(255,255,255,.4);
}
.cert__name{
  font-size:calc(17.8 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.02em;
  color:rgba(255,255,255,.78);
}
.cert__sub{
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.04em;
  color:rgba(255,255,255,.38);
}

/* contact maps */
.map{
  position:relative;
  aspect-ratio:16/10;
  border:1px solid rgba(255,255,255,.12);
  border-radius:calc(6 * var(--u));
  display:grid;
  place-content:center;
  text-align:center;
  gap:calc(8 * var(--u));
  padding:calc(18 * var(--u));
  background:rgba(255,255,255,.02);
}
.map__name{
  font-size:calc(16.6 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.02em;
  color:rgba(255,255,255,.78);
}
.map__sub{
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  letter-spacing:.04em;
  color:rgba(255,255,255,.4);
  line-height:1.8;
}
.map--link{
  text-decoration:none;
  color:inherit;
  cursor:pointer;
  transition:border-color .35s var(--e), background .35s var(--e);
}
.map--link:hover{
  border-color:rgba(255,255,255,.32);
  background:rgba(255,255,255,.045);
}
.map--link:hover .map__more{
  color:var(--ink);
  border-color:rgba(255,255,255,.5);
}
.map__more{
  display:inline-block;
  margin-top:calc(4 * var(--u));
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  letter-spacing:.03em;
  color:rgba(255,255,255,.58);
  border-bottom:1px solid rgba(255,255,255,.24);
  padding-bottom:calc(2 * var(--u));
  transition:color .3s ease, border-color .3s ease;
}

/* social link rows on contact */
.social__row{
  display:grid;
  grid-template-columns:calc(46 * var(--u)) minmax(0,1fr);
  gap:calc(28 * var(--u));
  padding:calc(26 * var(--u)) 0;
  border-top:1px solid rgba(255,255,255,.10);
}
.social__row:last-child{ border-bottom:1px solid rgba(255,255,255,.10); }
.social__name{
  margin:0;
  font-size:calc(20.2 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.01em;
}
.social__desc{
  margin:calc(8 * var(--u)) 0 0;
  font-size:calc(13.7 * var(--u) * var(--fs-text));
  line-height:1.8;
  color:var(--ink-dim);
}

/* care (aftercare) two-column groups */
.care__group{
  padding:calc(34 * var(--u)) 0;
  border-top:1px solid rgba(255,255,255,.10);
}
.care__group:last-child{ border-bottom:1px solid rgba(255,255,255,.10); }
.care__head{
  display:flex;
  align-items:baseline;
  gap:calc(16 * var(--u));
  flex-wrap:wrap;
}
.care__head h3{
  margin:0;
  font-size:calc(21 * var(--u));
  font-weight:500;
  letter-spacing:.005em;
}
.care__head span{
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.42);
}
.care__list{
  margin:calc(18 * var(--u)) 0 0;
  padding:0;
  list-style:none;
  counter-reset:care;
}
.care__list li{
  counter-increment:care;
  position:relative;
  padding:calc(9 * var(--u)) 0 calc(9 * var(--u)) calc(34 * var(--u));
  font-size:calc(14.5 * var(--u) * var(--fs-text));
  line-height:1.8;
  letter-spacing:.01em;
  color:var(--ink-dim);
}
.care__list li::before{
  content:counter(care, decimal-leading-zero);
  position:absolute;
  left:0;
  top:calc(12 * var(--u));
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.35);
}

/* ---------- footer with sitemap ---------- */
.foot--site{
  display:block;
  padding:calc(54 * var(--u)) calc(72 * var(--u)) calc(40 * var(--u));
}
.foot__nav{
  display:flex;
  flex-wrap:wrap;
  gap:calc(10 * var(--u)) calc(26 * var(--u));
  margin-bottom:calc(34 * var(--u));
}
.foot__nav a{
  font-size:calc(13.7 * var(--u) * var(--fs-text));
  letter-spacing:.04em;
  color:rgba(255,255,255,.55);
  text-decoration:none;
  transition:color .25s ease;
}
.foot__nav a:hover{ color:#fff; }
.foot__meta{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:calc(20 * var(--u));
  flex-wrap:wrap;
}
.foot--site p{
  margin:0;
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  line-height:1.8;
  letter-spacing:.02em;
  color:rgba(255,255,255,.45);
}

/* ============ responsive ============ */
@media (max-width:1000px){
  .pnav{
    min-height:60px;
    padding:0 16px;
  }
  .pnav__brand{ font-size:calc(16px * var(--fs-text)); }
  .pnav__brand i{ font-size:calc(12px * var(--fs-text)); }

  .phead{
    padding:calc(72px + env(safe-area-inset-top)) 22px 56px;
  }
  .phead__bg{ object-position:50% 42%; }
  .phead__title{ font-size:clamp(38px, 10vw, 56px); }
  .phead__note{ max-width:none; font-size:calc(15px * var(--fs-text)); }

  .section--page,
  .section--tight{ padding-top:80px; padding-bottom:80px; }

  .cta{
    grid-template-columns:minmax(0,1fr);
    column-gap:0;
    row-gap:40px;
    align-items:start;
    padding:80px 22px 88px;
  }
  .cta__title{ font-size:clamp(30px, 8.2vw, 44px); }
  .cta__note{ max-width:none; }
  .cta__wa, .cta__ghost{ height:52px; font-size:calc(16px * var(--fs-text)); padding:0 24px; }
  .cta__wa svg{ width:18px; height:18px; }

  .dev__row{ grid-template-columns:34px minmax(0,1fr); column-gap:14px; padding:28px 0; }
  .dev__name{ font-size:24px; }

  .art__row{ grid-template-columns:34px minmax(0,1fr); row-gap:8px; column-gap:14px; padding:24px 0; }
  .art__row .art__go{ grid-column:2; }
  .art__title{ font-size:18px; }

  .price__row{ grid-template-columns:minmax(0,1fr); row-gap:6px; padding:22px 0; }
  .price__name{ font-size:calc(18px * var(--fs-text)); }

  .cert__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
  .cert{ border-radius:6px; padding:14px; }
  .cert__name{ font-size:calc(15px * var(--fs-text)); }
  .cert__no{ font-size:calc(9px * var(--fs-text)); }

  .map{ border-radius:6px; }

  .social__row{ grid-template-columns:34px minmax(0,1fr); column-gap:14px; padding:22px 0; }
  .social__name{ font-size:calc(18px * var(--fs-text)); }

  .care__group{ padding:28px 0; }
  .care__head h3{ font-size:19px; }

  .foot--site{ padding:40px 22px calc(30px + env(safe-area-inset-bottom)); }
  .foot__nav{ gap:10px 20px; margin-bottom:26px; }
  .foot__nav a{ font-size:calc(14.5px * var(--fs-text)); }
}

@media (max-width:480px){
  .cert__grid{ grid-template-columns:minmax(0,1fr); }
}

/* ============================================================
   03 COLLAGEN : product directory — filter chips + product rows
   ============================================================ */
.chips{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:calc(8 * var(--u));
  margin:0 0 calc(38 * var(--u));
}
.chip{
  appearance:none;
  background:none;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:calc(9 * var(--u)) calc(17 * var(--u));
  font-family:inherit;
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.14em;
  color:rgba(255,255,255,.62);
  cursor:pointer;
  transition:color .3s ease, border-color .3s ease, background-color .3s ease;
}
.chip:hover{ color:#fff; border-color:rgba(255,255,255,.38); }
.chip.is-on{ color:#0d0f10; background:#fff; border-color:#fff; }
.chip--count{
  cursor:default;
  border-color:transparent;
  padding-left:calc(8 * var(--u));
  color:rgba(255,255,255,.35);
}
.chip--count:hover{ color:rgba(255,255,255,.35); border-color:transparent; }
.chip--count b{ font-weight:500; color:rgba(255,255,255,.78); }

.pg{ margin:0 0 calc(46 * var(--u)); }
.pg.is-hide{ display:none; }
.pg__head{
  display:flex;
  align-items:baseline;
  gap:calc(14 * var(--u));
  margin:0 0 calc(6 * var(--u));
}
.pg__no{
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.42);
}
.pg__head h3{
  margin:0;
  font-size:calc(19 * var(--u));
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.005em;
}
.pg__count{
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.14em;
  color:rgba(255,255,255,.35);
}
.pg__desc{
  margin:0 0 calc(14 * var(--u));
  max-width:calc(460 * var(--u));
  font-size:calc(13.8 * var(--u) * var(--fs-text));
  line-height:1.8;
  letter-spacing:.01em;
  color:var(--ink-dim);
}

.pr__list{ border-top:1px solid rgba(255,255,255,.12); }
.pr{
  display:grid;
  grid-template-columns:calc(38 * var(--u)) minmax(0,1fr) auto;
  gap:calc(6 * var(--u)) calc(18 * var(--u));
  align-items:baseline;
  padding:calc(14 * var(--u)) 0;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.pr.is-hide{ display:none; }
.pr__no{
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.34);
}
.pr__main{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:calc(6 * var(--u)) calc(20 * var(--u));
  min-width:0;
}
.pr__name{
  font-size:calc(17.8 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.03em;
}
.pr__attr{
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.14em;
  color:rgba(255,255,255,.45);
  white-space:nowrap;
}
.pr__attr--dim{ color:rgba(255,255,255,.3); }
.pr__tags{
  display:flex;
  gap:calc(6 * var(--u));
  white-space:nowrap;
}
.pr__tag{
  font-size:calc(10.7 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.16em;
  color:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:calc(4 * var(--u)) calc(10 * var(--u)) calc(3 * var(--u));
}
.pr__legend{
  margin:calc(10 * var(--u)) 0 0;
  max-width:calc(520 * var(--u));
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  line-height:1.9;
  letter-spacing:.01em;
  color:rgba(255,255,255,.4);
}
.pr__legend b{ font-weight:500; color:rgba(255,255,255,.62); }

@media (max-width:1000px){
  .chips{ margin-bottom:28px; }
  .pg{ margin-bottom:36px; }
  .pr{ grid-template-columns:26px minmax(0,1fr); }
  .pr__tags{ grid-column:2; }
  .pr__attr{ white-space:normal; }
}

/* ---------- product list · Chinese name ---------- */
.pr__name i{
  display:block;
  margin-top:calc(3 * var(--u));
  font-style:normal;
  font-weight:400;
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  letter-spacing:.05em;
  color:rgba(255,255,255,.46);
}

/* ---------- CTA · WeChat button ---------- */
.cta__wc{
  display:inline-flex;
  align-items:center;
  gap:calc(10 * var(--u));
  height:calc(56 * var(--u));
  padding:0 calc(28 * var(--u));
  border-radius:999px;
  border:1px solid rgba(255,255,255,.32);
  color:var(--ink);
  font-family:inherit;
  font-size:calc(16.1 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.01em;
  text-decoration:none;
  white-space:nowrap;
  transition:border-color .25s ease, background .25s ease;
}
.cta__wc:hover{
  border-color:rgba(255,255,255,.7);
  background:rgba(255,255,255,.06);
}
.cta__wc svg{
  width:calc(19 * var(--u));
  height:calc(19 * var(--u));
  fill:currentColor;
  flex:0 0 auto;
}

/* ---------- CTA · small qualifier line ---------- */
.cta__micro{
  margin:calc(16 * var(--u)) 0 0;
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  letter-spacing:.06em;
  color:rgba(255,255,255,.5);
}

@media (max-width:1000px){
  .cta__wc{ height:52px; font-size:calc(16px * var(--fs-text)); padding:0 24px; }
  .cta__wc svg{ width:18px; height:18px; }
  .pr__name i{ font-size:calc(13px * var(--fs-text)); margin-top:3px; }
  .cta__micro{ margin-top:14px; font-size:calc(14px * var(--fs-text)); }
}

/* ---------- certificate gallery (image cards) + lightbox ---------- */
.cert--img{
  aspect-ratio:auto;
  margin:0;
  border:1px solid rgba(255,255,255,.12);
  border-radius:calc(8 * var(--u));
  background:rgba(255,255,255,.025);
  overflow:hidden;
  display:block;
  padding:0;
  text-align:left;
  gap:0;
  transition:border-color .3s ease;
}
.cert--img:hover{ border-color:rgba(255,255,255,.3); }
.cert__frame{
  display:block;
  width:100%;
  margin:0;
  padding:0;
  border:0;
  background:#191410;
  cursor:zoom-in;
  aspect-ratio:4/3;
  overflow:hidden;
  position:relative;
}
.cert__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .8s var(--e);
}
.cert__frame:hover .cert__img{ transform:scale(1.02); }
.cert__cap{
  display:block;
  padding:calc(16 * var(--u)) calc(18 * var(--u)) calc(18 * var(--u));
  text-align:left;
}
.cert--img .cert__name{ margin:calc(6 * var(--u)) 0 calc(5 * var(--u)); }
.cert--img .cert__sub{ line-height:1.7; }

.lbx{
  position:fixed;
  inset:0;
  z-index:90;
  display:none;
  place-items:center;
  padding:calc(28px + env(safe-area-inset-top)) 20px calc(28px + env(safe-area-inset-bottom));
  background:rgba(8,9,10,.95);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  cursor:zoom-out;
}
.lbx.is-open{ display:grid; }
.lbx__img{
  max-width:min(1120px, 100%);
  max-height:100%;
  border-radius:calc(6 * var(--u));
  box-shadow:0 40px 110px rgba(0,0,0,.72);
}
.lbx__close{
  position:absolute;
  top:calc(16px + env(safe-area-inset-top));
  right:16px;
  width:46px; height:46px;
  display:grid; place-items:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(0,0,0,.45);
  color:#fff;
  font-size:calc(17px * var(--fs-text));
  line-height:1;
  cursor:pointer;
  font-family:inherit;
}
.lbx__close:hover{ background:rgba(255,255,255,.14); }

@media (max-width:1000px){
  .cert--img{ padding:0; border-radius:8px; }
  .cert__cap{ padding:12px 13px 15px; }
  .cert--img .cert__name{ font-size:calc(15px * var(--fs-text)); margin:5px 0 4px; }
  .cert--img .cert__sub{ font-size:calc(12px * var(--fs-text)); }
}

/* ============================================================
   04 · CARE（侵入性療程注意事項） — added 2026-09-13
   ============================================================ */
.care__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:calc(14 * var(--u)) calc(28 * var(--u));
  margin-top:calc(22 * var(--u));
  padding:calc(30 * var(--u)) calc(34 * var(--u));
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.09);
  border-radius:calc(8 * var(--u));
}
.care__item{
  display:flex;
  align-items:flex-start;
  gap:calc(14 * var(--u));
  font-size:calc(17.3 * var(--u) * var(--fs-text));
  line-height:1.5;
  color:var(--ink);
}
.care__icon{
  flex-shrink:0;
  width:calc(18 * var(--u));
  text-align:center;
  font-size:calc(16.6 * var(--u) * var(--fs-text));
  line-height:1.5;
  filter:saturate(.7);
  opacity:.72;
}
.care__foot{
  margin-top:calc(20 * var(--u));
  font-size:calc(13.7 * var(--u) * var(--fs-text));
  line-height:1.65;
  color:rgba(255,255,255,.5);
  letter-spacing:.02em;
}
@media (max-width:1000px){
  .care__grid{ grid-template-columns:1fr; padding:calc(22 * var(--u)) calc(22 * var(--u)); gap:calc(14 * var(--u)); }
}

/* ============================================================
   05 · INGREDIENTS（PN vs PDRN） — added 2026-09-13
   ============================================================ */
.ing__grid{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:stretch;
  gap:calc(20 * var(--u));
  margin-top:calc(22 * var(--u));
}
.ing__card{
  display:flex;
  flex-direction:column;
  padding:calc(28 * var(--u)) calc(28 * var(--u));
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.09);
  border-radius:calc(8 * var(--u));
}
.ing__card--hl{
  border-color:rgba(210,173,114,.42);
  background:linear-gradient(180deg, rgba(210,173,114,.05), rgba(255,255,255,.015));
}
.ing__head{
  display:flex;
  flex-direction:column;
  gap:calc(8 * var(--u));
  padding-bottom:calc(18 * var(--u));
  border-bottom:1px solid rgba(255,255,255,.08);
  margin-bottom:calc(18 * var(--u));
}
.ing__tag{
  display:inline-block;
  width:fit-content;
  padding:calc(4 * var(--u)) calc(11 * var(--u));
  border-radius:999px;
  background:rgba(255,255,255,.06);
  font-size:calc(12.5 * var(--u) * var(--fs-text));
  letter-spacing:.08em;
  color:rgba(255,255,255,.55);
}
.ing__tag--hl{
  background:rgba(210,173,114,.18);
  color:#d2ad72;
}
.ing__name{
  margin:0;
  font-size:calc(38 * var(--u));
  font-weight:700;
  letter-spacing:-.02em;
  line-height:1;
  color:var(--ink);
}
.ing__name-en{
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  color:rgba(255,255,255,.45);
  letter-spacing:.02em;
  line-height:1.4;
}
.ing__props{
  list-style:none;
  margin:0; padding:0;
  display:flex;
  flex-direction:column;
  gap:calc(14 * var(--u));
  font-size:calc(15.4 * var(--u) * var(--fs-text));
  line-height:1.55;
}
.ing__props li{
  display:flex;
  flex-direction:column;
  gap:calc(3 * var(--u));
}
.ing__props li > span{
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  letter-spacing:.12em;
  color:rgba(255,255,255,.42);
  text-transform:uppercase;
}
.ing__props li > b{
  font-weight:500;
  color:var(--ink);
}
.ing__vs{
  align-self:center;
  font-size:calc(15.4 * var(--u) * var(--fs-text));
  letter-spacing:.2em;
  color:rgba(255,255,255,.3);
  font-weight:600;
}
.ing__hl{
  margin:calc(22 * var(--u)) 0 0;
  padding:calc(12 * var(--u)) calc(16 * var(--u));
  border-radius:calc(6 * var(--u));
  background:rgba(210,173,114,.12);
  color:#d2ad72;
  font-size:calc(15.4 * var(--u) * var(--fs-text));
  font-weight:600;
  text-align:center;
  letter-spacing:.02em;
}
@media (max-width:1000px){
  .ing__grid{ grid-template-columns:1fr; gap:calc(14 * var(--u)); }
  .ing__vs{ padding:calc(2 * var(--u)) 0; font-size:calc(13.1 * var(--u) * var(--fs-text)); }
}

/* ---------- embedded google map (contact) ---------- */
.map-embed{
  position:relative;
  border:1px solid rgba(255,255,255,.12);
  border-radius:calc(6 * var(--u));
  overflow:hidden;
  background:#141110;
}
.map-embed iframe{
  display:block;
  width:100%;
  height:calc(360 * var(--u));
  min-height:300px;
  border:0;
  filter:grayscale(.4) invert(.9) hue-rotate(185deg) contrast(.88) saturate(.6) brightness(.95);
}
.map-embed::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), inset 0 -60px 70px -50px rgba(20,17,16,.6);
}
.map-foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:calc(14 * var(--u)) calc(22 * var(--u));
  margin-top:calc(18 * var(--u));
}
.map__open{
  display:inline-block;
  font-size:calc(13.6 * var(--u) * var(--fs-text));
  letter-spacing:.03em;
  color:#e8c987;
  border:1px solid rgba(232,201,135,.4);
  border-radius:999px;
  padding:calc(8 * var(--u)) calc(20 * var(--u));
  text-decoration:none;
  transition:color .3s ease, border-color .3s ease, background .3s ease;
}
.map__open:hover{
  color:#fff;
  border-color:rgba(232,201,135,.85);
  background:rgba(232,201,135,.1);
}
@media (max-width:480px){
  .map-embed iframe{ height:300px; min-height:0; }
  .map-foot{ gap:12px 16px; }
}
.map-embed__fb{
  position:absolute;
  inset:0;
  display:grid;
  place-content:center;
  justify-items:center;
  gap:calc(10 * var(--u));
  text-align:center;
  padding:calc(24 * var(--u));
  color:rgba(255,255,255,.5);
}
.map-embed__pin{ color:rgba(232,201,135,.75); }
.map-embed__addr{
  font-size:calc(13.1 * var(--u) * var(--fs-text));
  line-height:1.9;
  letter-spacing:.03em;
  color:rgba(255,255,255,.55);
}
.map-embed__hint{
  font-size:calc(10.3 * var(--u));
  letter-spacing:.32em;
  color:rgba(255,255,255,.3);
}
.map-embed iframe{ position:relative; z-index:1; }

/* ============================================================
   TREATMENTS : 六大板塊快速導覽（錨點列）
   ============================================================ */
.tnav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:calc(8 * var(--u));
  margin:calc(-40 * var(--u)) 0 0;
  padding:0 0 calc(20 * var(--u));
}
.tnav__a{
  display:inline-flex;
  align-items:baseline;
  gap:calc(6 * var(--u));
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  padding:calc(9 * var(--u)) calc(18 * var(--u));
  font-size:calc(11.9 * var(--u) * var(--fs-text));
  font-weight:500;
  letter-spacing:.14em;
  color:rgba(255,255,255,.62);
  text-decoration:none;
  transition:color .3s ease, border-color .3s ease, background-color .3s ease;
}
.tnav__a:hover,
.tnav__a:focus-visible{ color:#fff; border-color:rgba(255,255,255,.42); background:rgba(255,255,255,.04); }
.tnav__a i{
  font-style:normal;
  font-size:.82em;
  letter-spacing:.1em;
  color:rgba(232,201,135,.72);
}
@media (max-width:760px){
  .tnav{ gap:calc(10 * var(--u)); margin:calc(-24 * var(--u)) 0 0; padding-bottom:calc(8 * var(--u)); }
  .tnav__a{ padding:calc(11 * var(--u)) calc(20 * var(--u)); }
}

/* ============================================================
   CONTACT : 交通與地圖 · 實地路線影片
   ============================================================ */
.travel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0, calc(310 * var(--u)));
  gap:calc(50 * var(--u));
  align-items:center;
  margin-top:calc(56 * var(--u));
}
.travel__t{
  font-family:var(--font-display);
  font-weight:500;
  font-size:calc(23 * var(--u) * var(--fs-text));
  letter-spacing:.01em;
  color:rgba(255,255,255,.94);
  margin:0 0 calc(16 * var(--u));
}
.travel__d{
  font-size:calc(14.3 * var(--u) * var(--fs-text));
  line-height:1.95;
  letter-spacing:.02em;
  color:rgba(255,255,255,.6);
  margin:0;
  max-width:calc(520 * var(--u));
}
.travel__v{ margin:0; }
.travel__v .vfilm--portrait{ width:min(100%, calc(300 * var(--u))); }
@media (max-width:860px){
  .travel{ grid-template-columns:1fr; gap:calc(30 * var(--u)); margin-top:calc(40 * var(--u)); }
  .travel__v .vfilm--portrait{ width:min(100%, calc(330 * var(--u))); }
}