.total{--olive:#827857;--pale:#dfe1d3;background:#fdfbf7;color:#3d332f}.total .sub-hero{border:1px solid rgba(229,221,213,.5);background:linear-gradient(132deg,#eff0e8 0 55%,#dfe2d2 55%)}.total .sub-hero-copy{padding:145px 3vw 80px 11vw}.total .sub-hero-copy>p{color:var(--olive);font-size:22px;letter-spacing:.08em}.total .sub-hero h1{font-size:90px;line-height:1.02}.total .sub-hero-copy>span{font-size:25px;line-height:1.75;color:#3d332f}.total .tags i{border:0;background:#8d8464;color:#fff;font-size:19px;font-weight:700;padding:15px 28px}.total .sub-hero-media{align-items:center}
.total-section{max-width:1460px;margin:auto;padding:135px 0;display:grid;grid-template-columns:670px 670px;gap:120px;align-items:center}.total-section.reverse{max-width:none;padding-left:max(22px,calc((100vw - 1460px)/2));padding-right:max(22px,calc((100vw - 1460px)/2));background:#f2f3ed}.total-visual{height:740px;border-radius:42px;overflow:hidden;background:#eee}.total-visual.tall{height:810px}.total-visual img{width:100%;height:100%;object-fit:cover}.total-copy .num{display:block;color:var(--pale);font-size:120px;line-height:1;font-weight:800}.total-copy .kicker{margin:18px 0 14px;color:var(--olive);font-size:22px;letter-spacing:.08em}.total-copy h2{margin:0 0 36px;font-size:58px;line-height:1.15;letter-spacing:-.04em}.body-copy{font-size:23px;line-height:1.56;color:#6b615b}.body-copy p{margin:0 0 25px}.body-copy strong{font-weight:700}
.total-principles{padding:145px max(22px,calc((100vw - 1460px)/2));background:#30352c;color:#fff;text-align:center}.principle-head p{color:#c6bd91;font-size:22px;letter-spacing:.08em}.principle-head h2{margin:20px 0;font-size:66px;line-height:1.15}.principle-head span{display:block;font-size:24px;line-height:1.7;color:#e7dcdf}.anatomy{width:100%;height:487px;margin:0 auto 85px;object-fit:cover;border-radius:28px;background:#f5efe8}.total-principles .principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.total-principles article{min-height:700px;padding:48px;text-align:left;border-radius:34px;background:#f5efe8;color:#49363b}.total-principles article b{font-size:70px;color:#9a9d67}.total-principles article h3{min-height:125px;font-size:28px;line-height:1.36;margin:22px 0}.total-principles article h3 small{font-size:24px}.total-principles article p{font-size:21px;line-height:1.48;color:#685d60;margin:0 0 28px}.principle-conclusion{margin:80px auto 0;font-size:25px;line-height:1.75;color:#f0e6e8}
.total-recommend{min-height:1214px;padding:182px max(22px,calc((100vw - 1460px)/2));background-color:#111;background-image:linear-gradient(90deg,rgba(25,22,23,.96) 0%,rgba(25,22,23,.88) 38%,rgba(25,22,23,.40) 62%,rgba(25,22,23,.18) 100%),url('assets/figma-total/recommend-banner-woman-v3-optimized.jpg');background-position:center,center;background-size:cover,cover;background-repeat:no-repeat;color:#fff}.recommend-inner{width:750px}.total-recommend .kicker{color:#b6b6b6;font-size:22px;letter-spacing:.08em}.total-recommend h2{margin:18px 0 25px;font-size:66px}.total-recommend .lead{font-size:23px;color:#d5d5d5}.total-recommend ul{list-style:none;padding:25px 0 0;margin:0}.total-recommend li{display:flex;align-items:center;min-height:80px;margin:17px 0;padding:22px 27px;border:1px solid #efd8dd;border-radius:16px;background:#f5efe8;color:#3d332f;font-size:22px}.total-recommend li:before{content:'✓';display:grid;place-items:center;flex:0 0 34px;height:34px;margin-right:20px;border-radius:50%;background:#9a9d67;color:#fff;font-weight:700}.total-recommend a{display:block;margin-top:35px;padding:23px;border-radius:999px;background:#412f34;text-align:center;font-size:21px}
@media(max-width:1500px){.total .sub-hero h1{font-size:clamp(62px,5vw,90px)}.total-section{width:calc(100% - 80px);grid-template-columns:repeat(2,minmax(0,1fr));gap:6vw}.total-section.reverse{width:auto}.total-copy h2{font-size:clamp(42px,3.2vw,58px)}.body-copy{font-size:20px}}
@media(max-width:900px){.total .sub-hero-copy{padding:70px 24px 35px}.total .sub-hero-copy>p{font-size:16px}.total .sub-hero h1{font-size:clamp(42px,12vw,60px)}.total .sub-hero-copy>span{font-size:18px}.total .tags i{font-size:14px;padding:12px 18px}.total-section,.total-section.reverse{width:auto;grid-template-columns:1fr;gap:42px;padding:78px 22px}.total-section.reverse .total-visual{order:-1}.total-visual,.total-visual.tall{height:auto;aspect-ratio:1/1}.total-copy .num{font-size:72px}.total-copy .kicker{font-size:16px}.total-copy h2{font-size:clamp(34px,9vw,44px)}.body-copy{font-size:18px;line-height:1.7}.total-principles{padding:82px 22px}.principle-head p{font-size:15px}.principle-head h2{font-size:clamp(34px,9vw,46px)}.principle-head span{font-size:18px}.anatomy{height:auto;margin:45px auto 35px}.total-principles .principle-grid{grid-template-columns:1fr}.total-principles article{min-height:0}.total-recommend{min-height:0;padding:85px 22px;background-image:linear-gradient(90deg,rgba(10,10,10,.92),rgba(10,10,10,.38)),url('assets/figma-total/recommend-banner-woman-v3-optimized.jpg');background-position:center,72% center}.recommend-inner{width:auto}.total-recommend h2{font-size:clamp(36px,10vw,48px)}.total-recommend .lead{font-size:18px;line-height:1.6}.total-recommend li{font-size:16px;line-height:1.5}.total-recommend a{font-size:17px}}

/* Match the transparent recommendation treatment used on skeletal correction. */
.total .total-recommend li{
  background:transparent;
  color:#fff;
}
.total{--global-header-height:96px}.total .global-site-header{height:96px!important}.total .global-header-logo{width:170px!important}.total .sub-hero{margin-top:96px!important}.total .global-header-inner{min-height:96px!important}
@media(max-width:900px){.total{--global-header-height:72px}.total .global-site-header,.total .global-header-inner{height:72px!important;min-height:72px!important}.total .global-header-logo{width:132px!important}.total .sub-hero{margin-top:72px!important}}
@media(max-width:640px){.total{--global-header-height:66px}.total .global-site-header,.total .global-header-inner{height:66px!important;min-height:66px!important}.total .global-header-logo{width:120px!important}.total .sub-hero{margin-top:66px!important}}

/* Figma 1:425 — diagonal leaf frame (TL/BR small, TR/BL large). */
.total .sub-hero-media{
  align-items:center;
  justify-content:center;
  overflow:visible;
  padding:28px 4% 36px;
}
.total .hero-frame{
  position:relative;
  box-sizing:border-box;
  flex:0 1 auto;
  width:min(100%,630px);
  max-width:100%;
  min-width:0;
  height:auto;
  aspect-ratio:630/678;
  padding:0;
  overflow:hidden;
  border-radius:33px 229px 33px 229px;
  background:#fdfbf7;
  box-shadow:0 28px 74px rgba(143,83,98,.18);
}
.total .hero-frame img,
.total .sub-hero-media .hero-frame>img{
  position:absolute;
  inset:0;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  aspect-ratio:auto;
  object-fit:cover!important;
  object-position:center 40%!important;
  border-radius:inherit!important;
  transform:none;
}

@media(max-width:1500px) and (min-width:901px){
  .total .hero-frame{width:min(100%,600px)}
}

@media(max-width:900px){
  .total .sub-hero-media{
    height:auto!important;
    min-height:0;
    padding:18px 22px 28px;
  }
  .total .hero-frame{
    width:min(86vw,520px);
    height:auto;
    max-height:none;
    aspect-ratio:630/678;
    border-radius:24px clamp(90px,24vw,170px) 24px clamp(90px,24vw,170px);
  }
}
