@charset "UTF-8";
:root{font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;font-size:16px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;color:var(--ink);background:var(--paper);line-height:1.6}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
button,a{font:inherit}
figure,p,h1,h2,h3{margin:0}
.skip-link{position:absolute;left:12px;top:-60px;z-index:20;padding:10px 16px;background:#fff;color:#111}
.skip-link:focus{top:12px}
.container{width:min(1240px,calc(100% - 56px));margin-inline:auto}
.show-header{height:84px;width:min(1340px,calc(100% - 56px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--border)}
.show-logo{display:flex;align-items:center;gap:11px;white-space:nowrap}
.show-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;font-size:20px;font-weight:900;background:var(--accent);color:var(--mark-ink)}
.show-logo span:last-child{display:flex;flex-direction:column;line-height:1.1}
.show-logo b{font-size:18px;letter-spacing:.02em}
.show-logo small{font-size:10px;letter-spacing:.15em;margin-top:5px;opacity:.64}
.show-header nav{display:flex;align-items:center;gap:34px;color:var(--sub);font-size:14px}
.show-header nav a:hover,.show-footer nav a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:5px}
.header-action{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border:1px solid var(--ink);border-radius:999px;font-size:14px;font-weight:750;white-space:nowrap}
.header-action:hover{background:var(--ink);color:var(--paper)}
.eyebrow{font-size:13px;font-weight:800;letter-spacing:.12em;color:var(--eyebrow);text-transform:uppercase}
.eyebrow span{margin-left:25px;font-weight:500;letter-spacing:0;opacity:.6}
.lead{font-size:18px;line-height:1.8;color:var(--sub)}
.hero-links{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.hero-links>span{font-size:13px;color:var(--sub)}
.pill-button{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 26px;border-radius:999px;font-weight:800;font-size:15px;transition:transform .2s,filter .2s}
.pill-button:hover{transform:translateY(-2px);filter:brightness(1.05)}
.under-link,.text-button{font-size:15px;font-weight:800;text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}
.section-top{display:flex;justify-content:space-between;align-items:end;gap:48px}
.section-top h2{font-size:clamp(36px,4.2vw,62px);line-height:1.12;letter-spacing:-.06em;margin-top:16px}
.section-top>p{width:min(340px,100%);font-size:16px;line-height:1.8;color:var(--sub)}
.show-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:34px;padding-bottom:34px;border-top:1px solid var(--border);font-size:14px;color:var(--sub)}
.show-footer>div{display:flex;align-items:center;gap:10px;color:var(--ink)}
.show-footer .show-mark{width:30px;height:30px;font-size:16px;border-radius:7px}
.show-footer nav{display:flex;gap:24px;white-space:nowrap}

/* 母品牌：排版像品牌宣言，两种场景在一屏相遇。 */
.brand-site{--paper:#f2f1ed;--ink:#132139;--sub:#59677a;--accent:#335df4;--mark-ink:#fff;--eyebrow:#3155cc;--border:#cfd4dc}
.brand-hero{display:grid;grid-template-columns:1.02fr .98fr;gap:40px;min-height:710px;padding-top:70px;padding-bottom:90px;align-items:center}
.brand-hero-copy h1{font-size:clamp(58px,6.5vw,94px);line-height:1.08;letter-spacing:-.085em;margin:24px 0 30px}
.brand-hero-copy h1 em{font-style:normal;color:var(--accent)}
.brand-hero-copy .lead{max-width:520px}
.brand-hero-copy .hero-links{margin-top:35px}
.brand-primary{background:var(--accent);color:#fff}
.brand-hero-gallery{height:530px;position:relative}
.brand-hero-gallery figure{position:absolute;overflow:hidden;box-shadow:0 18px 50px rgba(22,37,65,.15)}
.brand-image-photo{width:76%;height:74%;top:0;left:0;border-radius:5px 70px 5px 5px}
.brand-image-nail{width:61%;height:55%;right:0;bottom:0;border:9px solid var(--paper);border-radius:4px 4px 4px 64px}
.brand-image-photo img{object-position:70% center}
.brand-image-nail img{object-position:72% center}
.brand-hero-gallery figcaption{position:absolute;left:16px;right:16px;bottom:16px;display:flex;flex-direction:column;gap:2px;background:rgba(255,255,255,.94);padding:11px 14px;border-radius:4px;color:#17243a;font-size:12px}
.brand-hero-gallery figcaption b{font-size:14px}
.brand-principle{background:#14213a;color:#fff;padding:105px 0}
.principle-grid{display:grid;grid-template-columns:180px 1fr 280px;align-items:end;gap:42px}
.principle-grid .eyebrow{color:#9bb0ff;align-self:start;margin-top:10px}
.principle-grid h2{font-size:clamp(42px,5.2vw,70px);letter-spacing:-.065em;line-height:1.2}
.principle-grid h2 span{color:#9eb2ff}
.principle-grid>p:last-child{color:#b6c2d6;font-size:16px;line-height:1.9}
.brand-products{padding-top:110px;padding-bottom:110px}
.brand-product-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:45px}
.brand-product-card{border:1px solid var(--border);background:#fff;overflow:hidden}
.product-card-top{display:flex;justify-content:space-between;padding:19px 22px;font-size:13px;color:#59677a;border-bottom:1px solid var(--border)}
.product-card-top b{font-weight:750}
.card-visual{height:290px;overflow:hidden}
.card-visual img{transition:transform .5s}
.brand-product-card:hover .card-visual img{transform:scale(1.04)}
.photo-product .card-visual img{object-position:65% center}
.nail-product .card-visual img{object-position:75% center}
.product-card-bottom{padding:28px 27px 30px;min-height:220px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}
.product-card-bottom h3{font-size:30px;letter-spacing:-.05em}
.product-card-bottom p{color:var(--sub);font-size:15px;margin-top:10px;max-width:440px}
.product-card-bottom .text-button{margin-top:24px}
.image-disclosure{font-size:13px;color:#788597;margin-top:15px}
.brand-deployment{background:#e1e6f1;padding:100px 0}
.deployment-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px}
.deployment-grid h2{font-size:clamp(36px,4.1vw,58px);line-height:1.18;letter-spacing:-.06em;margin-top:16px}
.deployment-options>div{border-top:1px solid #9faeca;padding:20px 0 25px}
.deployment-options span{color:var(--accent);font-size:13px;font-weight:800}
.deployment-options h3{font-size:23px;margin:10px 0}
.deployment-options p{font-size:15px;color:#4e5c72;line-height:1.8}

/* 美图：更像摄影师现场使用的产品，画面和步骤清晰。 */
.meitu-site{--paper:#f6f7f2;--ink:#0c1724;--sub:#5b6a76;--accent:#dcf754;--mark-ink:#0c1724;--eyebrow:#6f8410;--border:#d8dfdf}
.meitu-hero{display:grid;grid-template-columns:1fr .96fr;align-items:center;gap:55px;min-height:650px;padding-top:56px;padding-bottom:75px}
.meitu-copy h1{font-size:clamp(54px,6.1vw,84px);line-height:1.12;letter-spacing:-.077em;margin:25px 0 28px}
.meitu-copy h1 em{font-style:normal;color:#7c9194}
.meitu-copy .lead{max-width:530px}
.meitu-copy .hero-links{margin-top:34px}
.meitu-primary{background:var(--ink);color:#fff}
.hero-micro{display:flex;gap:10px;flex-wrap:wrap;margin-top:50px}
.hero-micro span{font-size:13px;border:1px solid #bac7c4;padding:7px 12px;border-radius:999px;color:#597071}
.meitu-hero-photo{height:520px;position:relative;overflow:hidden;border-radius:5px 55px 5px 5px;box-shadow:0 25px 65px rgba(19,45,51,.18)}
.meitu-hero-photo img{object-position:67% center}
.meitu-hero-photo:after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,rgba(7,23,37,.62))}
.meitu-hero-photo figcaption{position:absolute;z-index:1;bottom:24px;left:26px;right:26px;color:#fff;display:flex;justify-content:space-between;gap:20px;font-size:13px}
.meitu-hero-photo figcaption b{font-size:15px}
.meitu-strip{background:var(--ink);color:#fff}
.strip-grid{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:16px;font-weight:750}
.strip-grid i{width:7px;height:7px;flex:none;background:var(--accent);transform:rotate(45deg)}
.meitu-intro,.meitu-delivery{padding-top:115px;padding-bottom:115px}
.meitu-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:53px}
.meitu-steps article{padding:20px 18px 25px;border-top:2px solid var(--ink);min-height:260px}
.meitu-steps span{color:#7f901c;font-size:14px;font-weight:800}
.meitu-steps h3{font-size:23px;line-height:1.3;letter-spacing:-.04em;margin:64px 0 12px}
.meitu-steps p{color:var(--sub);font-size:15px;line-height:1.8}
.meitu-selection{background:#deeadb;padding:106px 0}
.selection-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:center}
.selection-layout h2{font-size:clamp(40px,4.9vw,67px);line-height:1.16;letter-spacing:-.07em;margin:17px 0 22px}
.selection-layout h2 em{font-style:normal;color:#6d8a6f}
.selection-layout p:not(.eyebrow){font-size:17px;color:#536b5c;line-height:1.85;margin-bottom:28px}
.selection-demo{background:#fff;border:1px solid #c6d2c5;border-radius:18px;padding:23px;box-shadow:0 24px 55px rgba(32,80,60,.1)}
.demo-top,.demo-bottom{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#63776c}
.demo-top b,.demo-bottom strong{color:#203b30}
.demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}
.demo-grid span{aspect-ratio:1.12;border-radius:8px;display:grid;place-items:end start;padding:10px;background:linear-gradient(145deg,#c9d8c9 5%,#91aab7 48%,#ebcaa1);color:#fff;font-size:14px;font-weight:900;text-shadow:0 2px 6px #344}
.demo-grid span:nth-child(2n){background:linear-gradient(140deg,#e1bba7,#739396 54%,#223a43)}
.demo-grid .chosen{outline:4px solid #cfe94a;outline-offset:-4px}
.demo-bottom{border-top:1px solid #e4e9e4;padding-top:16px;flex-wrap:wrap}
.delivery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:52px}
.delivery-grid article{background:#fff;border:1px solid var(--border);padding:31px;min-height:225px}
.delivery-grid b{color:#81961d;font-size:13px}
.delivery-grid h3{font-size:24px;letter-spacing:-.04em;margin:34px 0 10px}
.delivery-grid p{font-size:15px;color:var(--sub);line-height:1.8}
.meitu-scenes{padding:100px 0;background:#e7edec}
.scene-tags{display:flex;gap:13px;flex-wrap:wrap;margin-top:48px}
.scene-tags span{padding:13px 18px;border:1px solid #9cabac;border-radius:999px;font-size:15px;font-weight:700}
.meitu-cta{margin-top:95px;margin-bottom:95px;padding:55px 60px;background:var(--ink);color:#fff;display:grid;grid-template-columns:1fr .67fr;gap:50px;align-items:end}
.meitu-cta .eyebrow{color:#cbe755}
.meitu-cta h2{font-size:clamp(36px,4.5vw,62px);line-height:1.15;letter-spacing:-.06em;margin-top:16px}
.meitu-cta p:not(.eyebrow){font-size:16px;color:#b5c3cb;margin-bottom:25px}
.meitu-cta .meitu-primary{background:var(--accent);color:var(--ink)}

/* 美甲：门店审美、材质和手部真实感。 */
.nail-site{--paper:#fbf7f5;--ink:#371b25;--sub:#806874;--accent:#7f213d;--mark-ink:#fff;--eyebrow:#8d415a;--border:#e6d7dc}
.nail-hero{padding-top:55px;padding-bottom:105px;display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center;min-height:640px}
.nail-copy h1{font-size:clamp(45px,4.4vw,64px);line-height:1.18;letter-spacing:-.075em;margin:22px 0 28px}
.nail-copy h1 em{font-style:normal;color:#ac7185}
.nail-copy .lead{max-width:470px}
.nail-copy .hero-links{margin-top:34px}
.nail-primary{background:var(--accent);color:#fff}
.nail-hero-photo{height:550px;position:relative;overflow:hidden;border-radius:115px 4px 4px 4px}
.nail-hero-photo img{object-position:67% center}
.nail-hero-photo figcaption{position:absolute;bottom:0;left:0;right:0;background:rgba(47,22,30,.72);color:#fff;padding:12px 20px;font-size:12px}
.nail-statement{background:#3c1d2a;color:#fff;padding:90px 0}
.nail-statement p{font-size:15px;color:#e7b9c8;letter-spacing:.1em;margin-bottom:18px}
.nail-statement h2{font-size:clamp(44px,5.7vw,78px);line-height:1.17;letter-spacing:-.075em}
.nail-statement h2 em{font-style:normal;color:#d693a8}
.nail-process{padding-top:112px;padding-bottom:112px}
.nail-step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:54px}
.nail-step-grid article{border-top:1px solid #ae8695;padding:22px 12px 10px 0;min-height:235px}
.nail-step-grid span{color:#ad647d;font-size:14px;font-weight:800}
.nail-step-grid h3{font-size:25px;letter-spacing:-.045em;margin:51px 0 13px}
.nail-step-grid p{font-size:15px;color:var(--sub);line-height:1.8}
.nail-promise{background:#eee1e4;padding:108px 0}
.promise-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}
.promise-grid h2{font-size:clamp(42px,4.6vw,66px);letter-spacing:-.07em;line-height:1.17;margin:16px 0 24px}
.promise-grid h2 em{font-style:normal;color:#a55e76}
.promise-grid>div>p:last-child{color:var(--sub);max-width:430px;font-size:17px}
.promise-list>div{border-top:1px solid #c9aeb7;padding:18px 0 21px}
.promise-list b{font-size:20px}
.promise-list p{font-size:15px;color:var(--sub);margin-top:7px}
.nail-status{padding-top:110px;padding-bottom:110px;display:flex;align-items:end;justify-content:space-between;gap:40px}
.nail-status>div{max-width:660px}
.nail-status h2{font-size:clamp(38px,4.5vw,60px);letter-spacing:-.06em;margin:16px 0}
.nail-status p:not(.eyebrow){font-size:16px;color:var(--sub);line-height:1.85}
.nail-status .text-button{white-space:nowrap}

@media(max-width:1000px){
  .show-header nav{gap:16px}
  .brand-hero,.meitu-hero,.nail-hero{gap:25px}
  .brand-hero-gallery{height:440px}
  .principle-grid{grid-template-columns:1fr 2fr}
  .principle-grid>p:last-child{grid-column:2}
  .selection-layout{gap:34px}
  .promise-grid{gap:45px}
}
@media(max-width:720px){
  .container,.show-header{width:min(100% - 36px,1240px)}
  .show-header{height:auto;min-height:72px;flex-wrap:wrap;padding:12px 0}
  .show-header nav{order:3;width:100%;overflow-x:auto;gap:22px;padding:4px 0 3px;white-space:nowrap}
  .header-action{min-height:38px;padding:0 13px}
  .brand-hero,.meitu-hero,.nail-hero{display:flex;flex-direction:column;align-items:stretch;padding-top:48px;padding-bottom:68px;min-height:0}
  .brand-hero-copy h1,.meitu-copy h1,.nail-copy h1{font-size:clamp(44px,9vw,68px)}
  .brand-hero-gallery{height:370px;margin-top:15px}
  .meitu-hero-photo,.nail-hero-photo{height:390px;margin-top:12px}
  .lead{font-size:16px}
  .principle-grid,.deployment-grid,.selection-layout,.promise-grid,.meitu-cta{grid-template-columns:1fr}
  .principle-grid>p:last-child{grid-column:auto}
  .brand-principle,.brand-products,.brand-deployment,.meitu-intro,.meitu-delivery,.meitu-scenes,.meitu-selection,.nail-process,.nail-promise,.nail-status{padding-top:76px;padding-bottom:76px}
  .section-top{display:block}
  .section-top>p{margin-top:23px}
  .brand-product-grid,.delivery-grid{grid-template-columns:1fr}
  .meitu-steps{grid-template-columns:repeat(2,1fr)}
  .meitu-steps article{min-height:220px}
  .meitu-steps h3{margin-top:38px}
  .nail-step-grid{grid-template-columns:1fr;gap:0}
  .nail-step-grid article{min-height:0;padding:23px 0}
  .nail-step-grid h3{margin-top:18px}
  .nail-status{display:block}
  .nail-status .text-button{display:inline-block;margin-top:25px}
  .meitu-cta{padding:38px 29px;margin-top:70px;margin-bottom:70px}
  .strip-grid{overflow-x:auto;justify-content:flex-start;white-space:nowrap}
  .show-footer{flex-wrap:wrap}
}
@media(max-width:480px){
  .brand-hero-gallery{height:320px}
  .brand-image-photo{height:72%}
  .brand-image-nail{height:55%}
  .brand-hero-gallery figcaption{left:8px;right:8px;bottom:8px;padding:6px 9px;font-size:10px}
  .brand-hero-gallery figcaption b{font-size:11px}
  .meitu-steps{grid-template-columns:1fr}
  .meitu-steps article{min-height:0}
  .meitu-steps h3{margin-top:25px}
  .meitu-hero-photo,.nail-hero-photo{height:335px}
  .demo-top,.demo-bottom{font-size:12px}
  .product-card-bottom{min-height:0}
  .show-footer{display:grid}
  .show-footer nav{gap:17px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.pill-button,.card-visual img{transition:none}}