.tutorial-page{color:#171717;background:#fcfaf8;padding-bottom:80px}.tutorial-container{width:calc(100% - 64px);max-width:1180px;margin-inline:auto}.tutorial-page p,.tutorial-page li{color:#706a67;font-size:17px;line-height:1.65}.tutorial-page p{margin:0 0 18px}.tutorial-page p strong{font-weight:600}.tutorial-page p a{text-underline-offset:4px;text-decoration:underline}.tutorial-page ul,.tutorial-page ol{margin:16px 0 22px;padding-left:22px}.tutorial-page li{margin-bottom:6px}.tutorial-page h1{letter-spacing:-2.8px;margin:18px 0 26px;font-size:64px;line-height:1.08}.tutorial-page h2{letter-spacing:-1.4px;margin:0 0 24px;font-size:40px;line-height:1.16}.tutorial-page h3{letter-spacing:-.5px;margin:28px 0 14px;font-size:24px;line-height:1.3}.tutorial-hero{grid-template-columns:52% 48%;align-items:center;padding-block:72px 90px;display:grid}.tutorial-hero>div:first-child{padding-right:30px}.tutorial-home-link{text-underline-offset:4px;margin-top:20px;font-size:14px;text-decoration:underline;display:block}.tutorial-hero-stages{height:540px;position:relative}.tutorial-illustration{background:#fff;border:1px solid #e8e1dd;border-radius:20px;min-width:0;margin:0;overflow:hidden}.tutorial-illustration figcaption{justify-content:space-between;gap:12px;padding:16px;font-size:13px;font-weight:600;display:flex}.tutorial-illustration small{color:#706a67;font-size:10px;font-weight:400}.tutorial-image{background:#e3d6c6;height:300px;position:relative;overflow:hidden}.tutorial-image .portrait{background-position:50%;background-repeat:no-repeat;background-size:contain;width:100%;height:100%}.tutorial-page .tutorial-image .portrait-photo,.tutorial-page .tutorial-photo-examples .portrait-photo{object-fit:contain;object-position:center;background:#f3ece6}.tutorial-page .tutorial-image .editorial-portrait,.tutorial-page .tutorial-photo-examples .editorial-portrait{background-position:50%;background-size:contain}.tutorial-mock-controls{justify-content:center;align-items:center;gap:9px;min-height:58px;padding:18px 12px;font-size:12px;display:flex}.tutorial-swatches{gap:8px;display:flex}.tutorial-swatches i{border-radius:50%;width:22px;height:22px}.tutorial-hero-stages .tutorial-illustration{border-radius:24px;width:65%;position:absolute;box-shadow:0 14px 40px #22181412}.tutorial-hero-stages .tutorial-illustration:first-child{top:0;left:0;transform:rotate(-7deg)}.tutorial-hero-stages .tutorial-illustration:nth-child(2){width:57%;top:88px;right:0;transform:rotate(6deg)}.tutorial-hero-stages .tutorial-illustration:nth-child(3){bottom:0;left:12%;transform:rotate(-2deg)}.tutorial-hero-stages .tutorial-image{height:205px}.tutorial-layout{grid-template-columns:220px minmax(0,1fr);gap:42px;display:grid}.tutorial-layout aside{position:relative}.tutorial-navigation{padding-top:12px;position:sticky;top:110px}.tutorial-navigation ol{margin:0;padding:0;list-style:none}.tutorial-navigation li{margin:0}.tutorial-navigation a{color:#918a86;padding:11px 0 11px 16px;font-size:14px;display:block;position:relative}.tutorial-navigation a[aria-current]{color:#171717;font-weight:600}.tutorial-navigation a[aria-current]:before{content:"";background:#c67a8d;border-radius:50%;width:6px;height:6px;position:absolute;top:19px;left:0}.tutorial-navigation progress,.tutorial-progress-label{display:none}.tutorial-content{min-width:0}.tutorial-content section{scroll-margin-top:110px}.tutorial-preparation{background:#f7f2ef;border-radius:28px;padding:32px}.tutorial-preparation-grid{grid-template-columns:minmax(0,1fr) 280px;gap:28px;display:grid}.tutorial-photo-examples{padding-top:28px}.tutorial-photo-examples figure{background:#fff;border-radius:16px;margin:0 0 24px;overflow:hidden}.tutorial-photo-examples .editorial-portrait{aspect-ratio:2/3;width:100%;height:auto}.tutorial-photo-examples figcaption{align-items:center;gap:8px;padding:12px;font-size:13px;display:flex}.tutorial-photo-examples figure:first-child svg{color:#718777}.tutorial-photo-examples figure:last-child svg{color:#b27777}.tutorial-photo-examples .tutorial-poor-photo{filter:brightness(.42);background-position:50%;background-size:contain}.tutorial-step,.tutorial-section{padding-top:76px}.tutorial-step header{align-items:center;gap:22px;margin-bottom:26px;display:flex}.tutorial-step header>span{color:#d6ccc6;font-size:72px;font-weight:600;line-height:1}.tutorial-step header h2{margin:0}.tutorial-step-body{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:start;gap:28px;display:grid}.tutorial-step-body>.tutorial-illustration{position:sticky;top:115px}.tutorial-step-reverse .tutorial-step-body>div{order:2}.tutorial-step-reverse .tutorial-step-body>figure{order:1}.tutorial-step-body .tutorial-image{aspect-ratio:1;height:auto}.tutorial-step-body .tutorial-visual-6 .tutorial-image,.tutorial-step-body .tutorial-visual-7 .tutorial-image{aspect-ratio:2/3}@media (min-width:1024px){#step-7 .tutorial-illustration{contain:size;grid-template-rows:auto minmax(0,1fr) auto;align-self:stretch;display:grid;position:static}#step-7 .tutorial-image{aspect-ratio:auto;height:100%;min-height:0}}.tutorial-annotation{background:#ffffffeb;border-bottom:1px solid #706a67;padding:8px;font-size:11px;position:absolute;top:28%;left:16px}.tutorial-visual-5 .comparison{aspect-ratio:1;border-radius:0;width:100%;height:auto;min-height:0}.tutorial-page .tutorial-visual-5 .comparison .portrait-photo,.tutorial-page .tutorial-visual-5 .comparison img{object-fit:contain;object-position:center;background:#f3ece6}.tutorial-advice{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:start;gap:30px;display:grid}.tutorial-advice article{border-bottom:1px solid #e8e1dd;padding-bottom:12px}.tutorial-advice article:first-child h3{margin-top:0}.tutorial-advice>figure{position:sticky;top:115px}.tutorial-advice .tutorial-image{aspect-ratio:1;height:auto}.tutorial-diagnostics{background:#fff;border:1px solid #e8e1dd;border-radius:20px;overflow:hidden}.tutorial-diagnostics details{border-bottom:1px solid #e8e1dd;padding:22px}.tutorial-diagnostics details:last-child{border-bottom:0}.tutorial-diagnostics summary{cursor:pointer;font-size:18px;font-weight:600;line-height:1.4}.tutorial-diagnostics details>div{padding-top:18px}.tutorial-diagnostics p:last-child{margin-bottom:0}.tutorial-page .tutorial-quick{grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;margin:30px 0;padding:0;list-style:none;display:grid}.tutorial-quick li{border-top:1px solid #d6ccc6;padding-top:12px;font-size:13px;line-height:1.5}.tutorial-quick span{color:#b5a29b;margin-bottom:12px;font-size:24px;display:block}.tutorial-faq{max-width:840px;margin-inline:auto}.tutorial-faq .faq-item{background:0 0;border-bottom:1px solid #e8e1dd}.tutorial-faq .faq button{font-size:18px;font-weight:600}.tutorial-faq .faq p{font-size:16px;line-height:1.65}.tutorial-final{background:#f7e8eb;border-radius:28px;grid-template-columns:1.4fr 1fr;align-items:center;gap:44px;margin-top:80px;padding:42px;display:grid}.tutorial-upload-link{text-align:center;background:#fff;border:1px dashed #cdbcb6;border-radius:20px;flex-direction:column;align-items:center;gap:18px;padding:28px;display:flex}.tutorial-upload-link .button{white-space:normal;width:100%;min-width:0;font-size:14px}.tutorial-page .button{max-width:100%}@media (max-width:1023px){.tutorial-layout{grid-template-columns:170px minmax(0,1fr);gap:24px}.tutorial-hero{grid-template-columns:1fr 1fr}.tutorial-page h1{font-size:48px}.tutorial-page h2{font-size:32px}.tutorial-preparation-grid,.tutorial-step-body,.tutorial-advice{grid-template-columns:1fr}.tutorial-photo-examples{grid-template-columns:1fr 1fr;gap:16px;display:grid}.tutorial-step-body>.tutorial-illustration,.tutorial-advice>figure{position:static}.tutorial-step-reverse .tutorial-step-body>div,.tutorial-step-reverse .tutorial-step-body>figure{order:initial}.tutorial-hero-stages .tutorial-illustration{width:86%}.tutorial-hero-stages{height:570px}.tutorial-final{gap:24px}}@media (max-width:767px){.tutorial-container{width:calc(100% - 36px)}.tutorial-hero{grid-template-columns:1fr;padding-block:40px 48px}.tutorial-hero>div:first-child{padding:0}.tutorial-page h1{letter-spacing:-1.8px;font-size:42px}.tutorial-hero-stages{height:490px;margin:40px 12px 0}.tutorial-hero-stages .tutorial-illustration{width:72%}.tutorial-hero-stages .tutorial-image{height:170px}.tutorial-hero-stages .tutorial-illustration figcaption{gap:4px;padding:12px}.tutorial-hero-stages .tutorial-illustration small{font-size:9px}.tutorial-hero-stages .tutorial-mock-controls{padding:12px 8px;font-size:10px}.tutorial-layout{display:block}.tutorial-navigation{padding:0 0 26px;position:static}.tutorial-navigation ol{display:none}.tutorial-progress-label{margin-bottom:10px;font-size:13px;display:block}.tutorial-navigation progress{accent-color:#c67a8d;width:100%;height:4px;display:block}.tutorial-preparation{padding:24px 20px}.tutorial-page h2{font-size:32px}.tutorial-page h3{font-size:22px}.tutorial-step,.tutorial-section{padding-top:52px}.tutorial-step header{gap:14px}.tutorial-step header>span{font-size:64px}.tutorial-step header h2{font-size:29px}.tutorial-page .tutorial-quick{grid-template-columns:1fr;gap:0}.tutorial-quick li{border-top:0;border-left:1px solid #d6ccc6;align-items:center;gap:20px;margin:0;padding:8px 16px;display:flex}.tutorial-quick span{min-width:32px;margin:0}.tutorial-final{grid-template-columns:1fr;margin-top:50px;padding:28px 22px}.tutorial-photo-examples{grid-template-columns:1fr}.tutorial-content section{scroll-margin-top:95px}}.tutorial-color-families{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;padding:24px;display:grid}.tutorial-color-families h3{color:var(--text-secondary);margin:0 0 18px;font-size:14px}.tutorial-color-families ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px;margin:0;padding:0;list-style:none;display:grid}.tutorial-color-families li{text-align:center;flex-direction:column;align-items:center;gap:8px;font-size:11px;line-height:1.4;display:flex}.tutorial-color-families li>span:first-child{border:1px solid #0000000d;border-radius:50%;flex-shrink:0;width:38px;height:38px}.tutorial-color-photo{aspect-ratio:1;background:#e3d6c6;width:100%;position:relative}.tutorial-color-photo img{object-fit:contain}.tutorial-color-options{justify-content:center;gap:8px;padding:14px 12px 0;display:flex}.tutorial-color-options button{cursor:pointer;background:0 0;border:2px solid #0000;border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;padding:0;display:grid}.tutorial-color-options button span{border-radius:50%;width:32px;height:32px}.tutorial-color-options button[aria-pressed=true]{border-color:#32211b}.tutorial-color-options button:focus-visible{outline-offset:3px;outline:2px solid #80503d}.tutorial-color-options button:hover{background:#f3ece6}.tutorial-page .tutorial-color-name{text-align:center;margin:6px 12px 16px;font-size:13px}