.total{--olive:#827857;--pale:#dfe1d3;background:#fdfbf7;color:#402f34}.total .sub-hero{border:1px solid rgba(64,47,52,.3);background:linear-gradient(132deg,#eff0e8 0 55%,#dfe2d2 55%)}.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:#402f34}.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}.hero-frame{width:639px;height:688px;overflow:hidden;border-radius:32px 226px 32px 226px;background:#fdfbf7;box-shadow:0 28px 73px rgba(143,83,98,.18)}.hero-frame img{width:100%;height:100%;object-fit:cover}
.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:#655c5e}.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:#fff}.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:#fff;color:#49363b}.total-principles article b{font-size:70px;color:#d18797}.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-v2.png');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:#fff;color:#402f34;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:#d58b9a;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)}.hero-frame{width:min(92%,639px);height:min(52vw,688px)}.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>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}.hero-frame{width:86vw;height:92vw;max-height:570px}.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-v2.png');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}}
.total .hero-frame{width:min(100%,720px);height:auto;aspect-ratio:4/3;background:#f4f3ef}.total .hero-frame img{width:100%;height:100%;object-fit:cover;object-position:center;transform:none}
@media(max-width:1500px){.total .hero-frame{width:min(92%,680px);height:auto}}
@media(max-width:900px){.total .hero-frame{width:92vw;height:auto;max-height:none;aspect-ratio:4/3}.total .hero-frame img{object-fit:cover;object-position:center;transform:none}}
.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 45:447 — restore the framed hero artwork instead of cropping it edge-to-edge. */
.total .hero-frame{
  position:relative;
  box-sizing:border-box;
  width:min(90%,812px);
  height:auto;
  aspect-ratio:812/650;
  padding:0;
  overflow:hidden;
  border-radius:230px 40px 230px 40px;
  background:transparent;
  box-shadow:0 28px 73px rgba(93,86,61,.13);
}
.total .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 44%!important;
  border-radius:inherit!important;
  transform:scale(1.13)!important;
  transform-origin:center 44%;
}

@media(max-width:900px){
  .total .hero-frame{
    width:min(92vw,680px);
    height:auto;
    max-height:none;
    aspect-ratio:812/650;
    padding:0;
    border-radius:clamp(100px,27vw,190px) 28px clamp(100px,27vw,190px) 28px;
  }
  .total .hero-frame img{
    border-radius:inherit;
  }
}