@charset "UTF-8";
/* Crystal Pink / editorial renewal. Native WordPress + CSS.
   Design variance 6, motion intensity 3, visual density 3.
   Layers: content 0, sticky header 20, mobile CTA 30, skip link 50; dialog uses the top layer. */
.cp-page {
  --cp-paper:#fffafa; --cp-surface:#f8eeee; --cp-pink:#edcdd2; --cp-rose:#93485a;
  --cp-ink:#382c31; --cp-muted:#75626b; --cp-line:#e1cdd3;
  --cp-font:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  margin:0; padding:0; width:100%; background:var(--cp-paper); color:var(--cp-ink); font:400 14px/1.95 var(--cp-font);
  letter-spacing:.035em; -webkit-font-smoothing:antialiased; color-scheme:light; overflow-x:clip;
}
.cp-page *, .cp-page *::before, .cp-page *::after { box-sizing:border-box; }
.cp-page :where(h1,h2,h3,p,figure,ul,ol) { margin:0; padding:0; }
.cp-page :where(h1,h2,h3) { border:0; background:none; box-shadow:none; font-family:var(--cp-font); color:inherit; font-weight:400; }
.cp-page :where(h1,h2,h3)::before,.cp-page :where(h1,h2,h3)::after { content:none; }
.cp-page h2 { font-size:clamp(27px,2.65vw,42px); line-height:1.65; letter-spacing:.085em; }
.cp-page h3 { font-size:21px; line-height:1.8; }
.cp-page p { line-height:2.15; }
.cp-page img { display:block; max-width:100%; height:auto; }
.cp-page a { color:inherit; text-decoration:none; }
.cp-page a:hover { color:var(--cp-rose); }
.cp-page button,.cp-page input,.cp-page select { font:inherit; color:inherit; }
.cp-page button { cursor:pointer; }
.cp-page :where(a,button,input,select,summary):focus-visible { outline:2px solid var(--cp-rose); outline-offset:6px; }
.cp-page [hidden] { display:none !important; }
.cp-page :where(section,main) { scroll-margin-top:94px; }
.cp-page .cp-section { padding:110px max(5vw,24px); }
.cp-page .cp-display { font-family:"Helvetica Neue",Arial,sans-serif; font-size:clamp(48px,5.8vw,86px); font-weight:300; line-height:1.06; letter-spacing:-.045em; }
.cp-eyebrow { font:500 11px/1.5 var(--cp-font); letter-spacing:.16em; }
.cp-note { font-size:11px; color:var(--cp-muted); max-width:800px; }
.cp-announcement { min-height:33px; padding:6px 20px; background:var(--cp-pink); text-align:center; color:#503440; font-size:10px; letter-spacing:.07em; }
.cp-announcement a { margin-left:22px; border-bottom:1px solid currentColor; }
.cp-header { display:flex; align-items:center; justify-content:space-between; gap:26px; padding:5px 4vw; height:auto; position:sticky; top:0; z-index:20; background:var(--cp-paper); border-top:0; border-bottom:1px solid var(--cp-line); }
.admin-bar.cp-page .cp-header { top:32px; }
.cp-logo { display:block; flex-shrink:0; width:210px; }
.cp-logo img { width:100%; height:auto; object-fit:contain; }
.cp-nav { display:flex; align-items:center; gap:clamp(16px,2.1vw,34px); margin-left:auto; }
.cp-nav a { font-size:12px; white-space:nowrap; }
.cp-header-cta { border-bottom:1px solid var(--cp-ink); padding:7px 0; font-size:12px; white-space:nowrap; }
.cp-header-cta span { margin-left:20px; }
.cp-menu-toggle { display:none; width:44px; height:44px; border:0; background:none; padding:10px; }
.cp-menu-toggle span { display:block; height:1px; background:currentColor; margin:7px 0; }
.cp-skip { position:fixed; left:16px; top:-100px; z-index:50; padding:12px 24px; background:var(--cp-paper); }
.cp-skip:focus { top:10px; }
.cp-menu { border:0; padding:24px; background:var(--cp-paper); color:var(--cp-ink); width:min(520px,100%); height:100dvh; max-height:100dvh; margin:0 0 0 auto; }
.cp-menu::backdrop { background:rgb(42 23 32 / 35%); }
.cp-menu-top { display:flex; justify-content:space-between; align-items:center; padding-bottom:28px; }
.cp-menu-close { background:none; border:0; padding:10px 0 10px 20px; }
.cp-menu-close span { margin-left:10px; font-size:23px; }
.cp-menu nav { display:grid; }
.cp-menu nav a { padding:15px 0; border-bottom:1px solid var(--cp-line); }
.cp-page.cp-menu-open { overflow:hidden; }
.cp-main { width:100%; }
.cp-page :where(section) { padding:0; }
.cp-hero { position:relative; min-height:570px; height:calc(100svh - 113px); max-height:880px; overflow:hidden; background:#e2bcc6; }
.cp-page .cp-hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 46%; }
.cp-hero-copy { position:relative; width:52%; padding:clamp(52px,8vh,90px) 0 50px 7vw; color:#442c37; }
.cp-page .cp-hero h1 { margin:27px 0 24px; font-size:clamp(34px,3.9vw,62px); font-weight:400; line-height:1.65; letter-spacing:.13em; }
.cp-hero-description { font-size:14px; }
.cp-page .cp-link { display:flex; justify-content:space-between; align-items:center; gap:30px; width:fit-content; min-width:225px; max-width:100%; border-bottom:1px solid currentColor; padding:16px 0; margin-top:30px; font-size:12px; font-weight:500; }
.cp-link span,.cp-button span { font-family:Arial,sans-serif; font-size:20px; transition:transform .25s; }
.cp-link:hover span,.cp-button:hover span { transform:translate(3px,-3px); }
.cp-page .cp-button { display:inline-flex; align-items:center; justify-content:space-between; gap:30px; min-height:55px; padding:14px 25px; border:1px solid var(--cp-rose); background:var(--cp-rose); color:#fffafa; font-size:12px; white-space:nowrap; }
.cp-page .cp-button:hover { background:#793848; border-color:#793848; color:#fffafa; }
.cp-button:active,.cp-header-cta:active { transform:translateY(1px); }
.cp-about-intro { display:grid; grid-template-columns:1.15fr 1fr; gap:8vw; max-width:1360px; margin:0 auto; }
.cp-about-story { padding:25px 0 0 7%; }
.cp-about-story h3 { font-size:24px; letter-spacing:.09em; margin-bottom:26px; }
.cp-about-story p + p { margin-top:22px; }
.cp-editorial { display:grid; grid-template-columns:1.65fr 1fr; gap:8vw; align-items:start; margin:70px auto 0; max-width:1360px; }
.cp-editorial-main { margin-top:80px; }
.cp-page .cp-editorial-main img { width:100%; aspect-ratio:1.42; object-fit:cover; }
.cp-editorial-main figcaption { font-size:10px; color:var(--cp-muted); padding-top:8px; }
.cp-page .cp-editorial-aside img { width:100%; aspect-ratio:1; object-fit:cover; object-position:100% 40%; }
.cp-editorial-aside p { margin-top:28px; font-size:13px; }
.cp-effect { background:var(--cp-surface); }
.cp-effect-heading { max-width:1360px; margin:0 auto; }
.cp-effect-heading p { margin-top:20px; }
.cp-effect-grid { display:grid; grid-template-columns:1.15fr 1fr; gap:10vw; max-width:1360px; margin:55px auto 40px; }
.cp-effect-word { font-family:"Helvetica Neue",Arial,sans-serif; font-size:clamp(64px,8vw,120px); font-weight:300; line-height:1.02; letter-spacing:-.06em; color:var(--cp-rose); }
.cp-benefits article { padding:20px 0 25px; border-bottom:1px solid var(--cp-line); }
.cp-benefits article:first-child { padding-top:0; }
.cp-benefits h3 { margin-bottom:8px; font-size:20px; }
.cp-benefits p { color:var(--cp-muted); font-size:13px; }
.cp-feature-section { display:grid; grid-template-columns:1.15fr 1fr; gap:10vw; align-items:center; }
.cp-page .cp-feature-photo img { width:100%; aspect-ratio:1; object-fit:cover; object-position:75%; }
.cp-feature-copy { max-width:450px; }
.cp-feature-copy h2 { margin:25px 0; }
.cp-feature-copy p + p { margin-top:22px; }
.cp-feature-copy > p:not(.cp-eyebrow) { font-size:13px; }
.cp-howto { border-top:1px solid var(--cp-line); }
.cp-howto-intro { margin-top:35px; }
.cp-howto-intro h3 { margin-bottom:18px; }
.cp-howto-intro p { font-size:13px; }
.cp-ritual { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:0; margin:50px 0 28px !important; list-style:none; }
.cp-ritual li { padding:30px; border-top:1px solid var(--cp-line); }
.cp-ritual li:first-child { padding-left:0; }
.cp-ritual-number { font-size:13px; color:var(--cp-muted); }
.cp-ritual h3 { margin:28px 0 10px; font-size:22px; }
.cp-ritual p { font-size:12px; margin-bottom:15px; }
.cp-ritual li > span:last-child { font-size:12px; line-height:1.9; display:block; max-width:260px; }
.cp-ritual .is-current { padding:30px 38px; background:var(--cp-pink); color:#503440; border-color:var(--cp-pink); }
.cp-ingredients { display:grid; grid-template-columns:1.15fr 1fr; gap:10vw; background:var(--cp-surface); }
.cp-ingredients > div { max-width:470px; }
.cp-ingredients p { font-size:13px; }
.cp-ingredients-intro > p { margin-top:24px; }
.cp-ingredient-list { margin:0 0 24px; display:grid; grid-template-columns:1fr 1fr; gap:30px 24px; }
.cp-ingredient-list div { border-top:1px solid var(--cp-line); padding-top:18px; }
.cp-ingredient-list dt { font-size:14px; margin-bottom:10px; font-weight:500; }
.cp-ingredient-list dd { margin:0; font-size:12px; color:var(--cp-muted); }
.cp-ingredients .cp-note { font-size:10px; }
.cp-source-link { display:inline-block; margin-top:15px; font-size:10px; text-decoration:underline !important; text-underline-offset:4px; }
.cp-salon { display:grid; grid-template-columns:1.2fr 1fr; background:var(--cp-pink); color:#503440; }
.cp-page .cp-salon > img { width:100%; height:100%; min-height:490px; object-fit:cover; object-position:70%; }
.cp-salon-copy { padding:80px 5vw; align-self:center; }
.cp-salon-copy h2 { margin:25px 0; }
.cp-salon-copy p { font-size:13px; }
.cp-salon-copy .cp-button { margin-top:30px; }
.cp-faq { display:grid; grid-template-columns:1fr 1.5fr; gap:8vw; }
.cp-faq-heading h2 { font-size:29px; }
.cp-faq-heading p { margin-top:15px; font-size:12px; color:var(--cp-muted); }
.cp-faq-list details { overflow:hidden; border-bottom:1px solid var(--cp-line); }
.cp-faq-list details:first-child { border-top:1px solid var(--cp-line); }
.cp-faq-list summary { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:25px 0; cursor:pointer; font-size:14px; list-style:none; }
.cp-faq-list summary::-webkit-details-marker { display:none; }
.cp-faq-sign { position:relative; flex:none; width:16px; height:16px; }
.cp-faq-sign::before,.cp-faq-sign::after { content:""; position:absolute; background:currentColor; top:7px; left:0; width:16px; height:1px; }
.cp-faq-sign::after { transform:rotate(90deg); transition:transform .36s cubic-bezier(0.22,1,0.36,1); }
.cp-faq-list details[open]:not(.is-collapsing) .cp-faq-sign::after { transform:rotate(0); }
.cp-faq-answer { font-size:13px; padding:0 35px 26px 0; color:var(--cp-muted); line-height:2.05; }
.cp-footer { margin-top:0; border-top:1px solid var(--cp-line); padding:60px 5vw 25px; background:var(--cp-surface); }
.cp-footer-top { display:grid; grid-template-columns:1.3fr 1fr .7fr; gap:7vw; padding-bottom:55px; }
.cp-footer-top p { font-size:11px; margin-top:24px; }
.cp-footer-top nav { display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; align-content:start; font-size:12px; }
.cp-footer-social { display:grid; align-content:start; gap:13px; font-size:12px; }
.cp-footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:22px; align-items:center; border-top:1px solid var(--cp-line); padding-top:24px; font-size:10px; }
.cp-footer-bottom nav { display:flex; flex-wrap:wrap; gap:20px; }
.cp-footer-bottom small { flex-basis:100%; color:var(--cp-muted); font-size:10px; }
.cp-sticky { display:none; }
@media (prefers-reduced-motion:no-preference) {
  .cp-will-reveal { opacity:0; transform:translateY(18px); transition:opacity .7s,transform .7s; }
  .cp-will-reveal.is-revealed { opacity:1; transform:none; }
}
@media (min-width:1800px) { .cp-page .cp-section { padding-left:max(5vw,calc((100vw - 1500px)/2)); padding-right:max(5vw,calc((100vw - 1500px)/2)); } }
@media (max-width:1100px) {
  .cp-nav { display:none; } .cp-menu-toggle { display:block; } .cp-header-cta { margin-left:auto; }
  .cp-page .cp-section { padding:85px 5vw; }
  .cp-feature-section,.cp-ingredients { gap:6vw; }
  .cp-hero { min-height:540px; max-height:720px; }
  .cp-hero-copy { width:59%; }
}
@media (max-width:767px) {
  .cp-announcement { min-height:28px; font-size:9px; padding:5px 10px; }
  .cp-announcement a { margin-left:8px; }
  .cp-header { padding:8px 20px; gap:12px; }
  .cp-logo { width:167px; } 
  .cp-header-cta { display:none; }
  .admin-bar.cp-page .cp-header { top:46px; }
  .cp-page :where(section,main) { scroll-margin-top:82px; }
  .cp-page .cp-section { padding:65px 24px; }
  .cp-page h2 { font-size:27px; letter-spacing:.06em; }
  .cp-page .cp-display { font-size:51px; }
  .cp-hero { height:auto; min-height:calc(100svh - 150px); max-height:none; display:flex; align-items:flex-end; }
  .cp-page .cp-hero-image { object-position:66% 30%; height:72%; }
  .cp-hero::after { content:""; position:absolute; inset:25% 0 0; background:linear-gradient(0deg,#e9cbd2 46%,rgb(233 203 210 / 0) 100%); }
  .cp-hero-copy { width:100%; padding:220px 24px 38px; z-index:1; }
  .cp-hero-copy .cp-eyebrow { font-size:10px; }
  .cp-page .cp-hero h1 { font-size:34px; line-height:1.55; margin:20px 0 17px; letter-spacing:.1em; }
  .cp-hero-description { font-size:12px; }
  .cp-hero-copy .cp-link { margin-top:15px; }
  .cp-about-intro { grid-template-columns:1fr; gap:30px; }
  .cp-about-story { padding:0; }
  .cp-about-story h3 { font-size:21px; }
  .cp-about-story p { font-size:13px; }
  .cp-editorial { grid-template-columns:1fr; gap:30px; margin-top:40px; }
  .cp-editorial-main { margin:0; }
  .cp-editorial-aside { padding-left:20%; }
  .cp-editorial-aside p { font-size:12px; }
  .cp-effect-grid { grid-template-columns:1fr; gap:38px; margin:35px 0; }
  .cp-effect-word { font-size:70px; }
  .cp-effect-heading p { font-size:12px; }
  .cp-feature-section { grid-template-columns:1fr; gap:35px; }
  .cp-feature-copy { max-width:none; }
  .cp-page .cp-feature-photo img { aspect-ratio:1.2; }
  .cp-howto .cp-display { font-size:46px; }
  .cp-howto-intro h3 { font-size:19px; }
  .cp-ritual { grid-template-columns:1fr; margin-top:30px !important; }
  .cp-ritual li,.cp-ritual li:first-child { padding:24px 0; }
  .cp-ritual h3 { margin:12px 0 4px; }
  .cp-ritual .is-current { padding:25px; margin-top:8px; }
  .cp-ritual li > span:last-child { max-width:none; }
  .cp-ingredients { grid-template-columns:1fr; gap:24px; }
  .cp-salon { grid-template-columns:1fr; }
  .cp-page .cp-salon > img { min-height:0; aspect-ratio:1.25; }
  .cp-salon-copy { padding:45px 24px 55px; }
  .cp-faq { grid-template-columns:1fr; gap:30px; }
  .cp-faq-list summary { font-size:13px; }
  .cp-footer { padding:45px 24px 95px; }
  .cp-footer-top { grid-template-columns:1fr; gap:35px; padding-bottom:35px; }
  .cp-footer-social { display:flex; gap:25px; }
  .cp-footer-bottom { gap:20px; }
  .cp-footer-bottom nav { gap:12px 20px; }
  .cp-sticky { display:grid; grid-template-columns:1fr 1fr; position:fixed; bottom:0; left:0; right:0; z-index:30; padding-bottom:env(safe-area-inset-bottom); background:var(--cp-paper); border-top:1px solid var(--cp-line); }
  .cp-sticky a { padding:16px 12px; text-align:center; font-size:12px; }
  .cp-page .cp-sticky a:last-child { background:var(--cp-rose); color:#fffafa; }
}
@media (max-width:380px) { .cp-announcement { font-size:8px; } .cp-page .cp-hero h1 { font-size:31px; } .cp-page .cp-display { font-size:43px; } }
.cp-page .cp-button:hover { color:#fffafa; }
/* Optional appearance: follows the device until the user toggles this page. */
.cp-theme-toggle { border:0; background:transparent; padding:8px 0; font-size:10px !important; text-decoration:underline; text-underline-offset:4px; }
@media (prefers-color-scheme:dark) {
  .cp-page:not([data-cp-theme="light"]) { --cp-paper:#231c21; --cp-surface:#2f242c; --cp-pink:#e5bbc6; --cp-rose:#e2a6b6; --cp-ink:#f9ecf0; --cp-muted:#c5adb7; --cp-line:#57434e; color-scheme:dark; }
  .cp-page:not([data-cp-theme="light"]) .cp-button,
  .cp-page:not([data-cp-theme="light"]) .cp-sticky a:last-child { color:#382c31; }
}
.cp-page[data-cp-theme="dark"] { --cp-paper:#231c21; --cp-surface:#2f242c; --cp-pink:#e5bbc6; --cp-rose:#e2a6b6; --cp-ink:#f9ecf0; --cp-muted:#c5adb7; --cp-line:#57434e; color-scheme:dark; }
.cp-page[data-cp-theme="dark"] .cp-button,.cp-page[data-cp-theme="dark"] .cp-sticky a:last-child { color:#382c31; }
.cp-page .cp-button:hover { color:#fffafa; }
@media (prefers-reduced-motion:reduce) { .cp-page *, .cp-page *::before,.cp-page *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }

/* Before / After: original supplied images, presented as illustrations. */
.cp-comparison { margin-top:72px; padding-top:48px; border-top:1px solid var(--cp-line); }
.cp-comparison-heading { margin-bottom:28px; }
.cp-comparison-heading h3 { margin-top:12px; }
.cp-comparison-grid { display:grid; grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr); align-items:center; gap:20px; max-width:1040px; margin:0 auto 20px; }
.cp-comparison-grid figure { position:relative; overflow:hidden; background:var(--cp-pink); }
.cp-comparison-grid img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.cp-comparison-grid figcaption { position:absolute; top:16px; left:16px; padding:6px 14px; background:var(--cp-paper); font-size:11px; letter-spacing:.18em; }
.cp-comparison-arrow { text-align:center; font-size:30px; color:var(--cp-rose); }
.cp-comparison > .cp-note { max-width:none; text-align:center; }
@media (max-width:600px) {
  .cp-comparison { margin-top:48px; padding-top:32px; }
  .cp-comparison-grid { gap:8px; grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr); }
  .cp-comparison-grid figcaption { top:8px; left:8px; padding:3px 6px; font-size:9px; }
  .cp-comparison-arrow { font-size:20px; }
}

@keyframes cp-backdrop-in { from { opacity:0; } to { opacity:1; } }
@keyframes cp-backdrop-out { from { opacity:1; } to { opacity:0; } }
.cp-menu[open]::backdrop { animation:cp-backdrop-in .42s cubic-bezier(0.22,1,0.36,1) both; }
.cp-menu.is-closing::backdrop { animation:cp-backdrop-out .28s cubic-bezier(0.22,1,0.36,1) both; }
