/* Nail Insider Club V7 — strictly additive to the approved V5-based V6 */
:root{--save-green:#d6efcb;--save-green-text:#27572d}
html,body{max-width:100%;overflow-x:clip}
/* Menu and actual locale links */
@media(min-width:901px){.header .nav-container{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px}.nav-desktop{justify-self:center;margin-left:-42px;gap:21px}.nav-right{justify-self:end}.header .nav-right .languages{font-size:14px;gap:7px}}
.languages a{color:#d3d0cd;text-decoration:none;font-weight:650;transition:color .15s;cursor:pointer}.languages a.active{color:#fff}.languages a:hover,.languages a:focus-visible{color:#f5a46a}.languages i{display:inline-block;opacity:.37;font-style:normal}.nav-desktop a:hover{color:#fff}
/* Hero: shift ONLY hero content into dark zone without disturbing the rest of the layout */
@media(min-width:901px){.hero .hero-inner{width:calc(100% - 92px);max-width:1550px;margin-inline:auto}.hero .hero-copy{width:min(45%,595px);padding-right:0;transform:none}.hero .hero-copy h1{font-size:clamp(42px,3.75vw,61px)}.hero .hero-copy>p{max-width:475px}.hero-copy .eyebrow{max-width:485px;line-height:1.7}}
.hero .eyebrow{font-size:11px;letter-spacing:.115em}
.vertical-idea,.vertical-idea:hover{background:none!important;border:0!important;box-shadow:none!important;outline:0;padding:0!important;right:36px;bottom:110px;color:rgba(255,255,255,.68);font-size:10px;max-width:145px;text-transform:uppercase;line-height:1.8}
.vertical-idea i{display:none!important}
/* Skills — two large images on desktop, one plus peek on mobile, swipe in either context */
.skills .center-head{margin-bottom:30px}
.skills .center-head h2{font-size:clamp(35px,3.65vw,59px)}
.skills .skill-grid{display:flex!important;gap:25px!important;overflow-x:auto!important;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:none!important;overscroll-behavior-x:contain;padding:6px 2px 16px;touch-action:pan-x pan-y;cursor:grab;align-items:stretch}
.skills .skill-grid::-webkit-scrollbar{display:none}
.skills .skill-card{flex:0 0 calc((100% - 25px)/2)!important;min-width:0;display:flex;flex-direction:column;padding-bottom:14px;box-sizing:border-box;border-bottom:1px solid #ddd9d3}
.skills .skill-img{width:100%;height:auto!important;aspect-ratio:1.53!important;border-radius:10px;flex-shrink:0}
.skills .skill-img img{object-fit:cover;width:100%;height:100%;display:block}
.skills .skill-label{margin-top:16px;align-items:baseline;display:flex;gap:15px;padding:0 3px!important}
.skills .skill-label h3{font-size:clamp(14px,1.1vw,16px);line-height:1.55;font-weight:600}
.skills .skill-label span{color:#c2672b;flex-shrink:0;font-size:18px}
.skills .carousel-head{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px}
.skills .rail-hint{font-size:12px;color:#777}
.skills-outro{margin-top:23px;text-align:center;font-size:14px}
/* course cards accordion: layout never stretches the opposite card */
.courses .course-grid{align-items:start!important}
.courses .course-card{height:auto!important;align-self:start!important;display:flex!important}
.courses .course-info{flex:1!important;min-height:285px}
.courses .course-info>p{margin-top:18px!important;min-height:0!important}
.courses .course-details{margin-top:auto}
.courses .course-details[open]{margin-top:19px}
.courses .course-details[open] summary{color:#cf702f}
.courses .course-details .details-content{padding-bottom:8px}
.course-hide{display:block;margin-top:22px;background:transparent;border:1px solid #a49c93;color:#574e48;font:600 12px/1 var(--sans);padding:10px 17px;border-radius:20px;cursor:pointer;touch-action:manipulation}
.course-hide:hover{background:#f0eee9}
/* Free lesson section typography */
.free-bottom-copy{color:#dad3cf;line-height:1.65;font-size:13px}
.free-no-pay{font-size:11px;color:#e7b18b;letter-spacing:.03em;margin-top:9px}
/* Portrait without vignetting — preserve the actual original */
.educator-photo,.educator-photo img{mask-image:none!important;-webkit-mask-image:none!important;filter:none!important}
.educator-photo:before,.educator-photo:after{display:none!important}
.educator-text .social-links svg{width:17px;height:17px}
/* Press detail adjacent to label, not remote right corner */
.press-top .muted-press{margin-left:0!important}
/* VIP is before pricing; preserve V6 successful 2-photo rail */
.vip-section .vip-rail .vip-photo{scroll-snap-align:none;touch-action:pan-x pan-y}
/* Pricing: dynamic choices and savings only on 12-month plans */
.pricing-title{margin-inline:auto;text-align:center}.pricing-title h2{max-width:1200px;margin-inline:auto}.pricing-title p{max-width:920px;margin-inline:auto}
.term-options{display:grid;gap:9px}.term-choice{min-height:50px}.term-saving.v7-saving{font-weight:700;color:var(--save-green-text);background:var(--save-green);padding:4px 8px;border-radius:14px;line-height:1.15;font-size:11px;white-space:nowrap}
.plan-v5-sub{min-height:38px}.plan-money{margin-bottom:17px}
.price-plan-v5{height:100%;min-height:660px}.pricing-cards-v5{align-items:stretch}.plan-action{min-height:47px}
.pricing-notes{margin-top:25px}
/* FAQ desktop in true 2-column layout */
.faq-heading-v7{text-align:center;font-family:var(--serif);font-size:clamp(30px,2.7vw,42px);font-weight:400;margin:6px auto 27px}
.faq-layout.faq-narrow{max-width:1190px!important}
.faq-layout.faq-narrow .faq-list{width:100%!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 42px;align-items:start}
.faq-item{min-width:0;align-self:start;break-inside:avoid}
.faq-item summary{touch-action:manipulation}
/* Footer header row and lower trust/legal bar */
.footer-brand{display:flex;justify-content:space-between;align-items:center;gap:30px}
.footer-brand p{white-space:nowrap;font-size:13px;text-align:right}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px}
.footer-legal{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.footer-legal a,.footer-support{font-size:11px;white-space:nowrap}
.footer-copyright{white-space:nowrap}
.footer-support{text-align:right}
/* On fullscreen overlay, arrows cannot shift with image aspect ratio */
#viewer .lightbox-inner{width:100vw;max-width:100vw;height:100dvh;position:relative}
#viewer .lightbox-image-area{position:absolute;inset:65px 75px 55px;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}
#viewer .lightbox-image-area img{max-width:100%;max-height:100%;object-fit:contain;transform-origin:center;will-change:transform}
#viewer .lightbox-arrow{position:fixed;top:50%;bottom:auto;transform:translateY(-50%);width:48px;height:52px;z-index:5}
#viewer .lightbox-prev{left:14px}
#viewer .lightbox-next{right:14px}
/* Responsive breakpoints */
@media(max-width:1000px) and (min-width:701px){.footer-brand p{white-space:normal;text-align:right}.footer-legal{gap:10px}.footer-bottom{flex-wrap:wrap}.price-plan-v5{min-height:630px}.courses .course-info{min-height:270px}}
@media(max-width:900px){.skills .skill-card{flex-basis:calc((100% - 16px)/2)!important}.skills .skill-grid{gap:16px!important}.price-plan-v5{min-height:0}}
@media(max-width:700px){
 .header .nav-container{gap:6px}.header .brand{font-size:clamp(10px,2.8vw,12px)}
 .header .nav-right .languages{gap:3px!important;font-size:clamp(10px,2.8vw,13px)!important;margin:auto!important}.languages a{font-weight:750}
 .hero .hero-copy{padding-top:40px}.hero .eyebrow{font-size:9px;letter-spacing:.10em;line-height:1.7}
 .hero-copy h1{font-size:clamp(27px,7vw,37px);white-space:normal}
 .hero-copy h1 .hero-line-one,.hero-copy h1 .hero-line-two{white-space:normal}
 .skills .skill-card{flex:0 0 min(83vw,360px)!important;border:0;box-shadow:0 7px 25px rgba(0,0,0,.05);background:white;border-radius:10px;overflow:hidden}
 .skills .skill-img{aspect-ratio:1.25!important;border-radius:10px 10px 0 0}
 .skills .skill-label{padding:14px!important;margin:0;gap:10px;min-height:105px}
 .skills .skill-label h3{font-size:13px;line-height:1.5}
 .skills-outro{font-size:12px;text-align:left}
 .courses .course-grid{grid-template-columns:minmax(0,1fr)!important}
 .courses .course-info{min-height:0!important}
 .free .free-copy{display:contents}.free-copy .free-bottom-copy{order:6;align-self:stretch;font-size:12px;margin-top:7px}.free-copy .free-no-pay{order:7;align-self:stretch}.free-copy .free-buttons{order:8;align-self:stretch;margin-top:17px}
 .educator-grid{gap:0!important;display:flex!important;flex-direction:column!important}
 .educator-text{display:contents!important}
 .educator-text>.eyebrow{order:1}.educator-text h2{order:2;margin-top:9px;margin-bottom:17px}
 .educator-photo{order:3;margin:0 calc(50% - 50vw) 18px;width:100vw!important;max-width:none!important;min-height:0!important}
 .educator-photo img{width:100%!important;height:auto!important;object-fit:contain;display:block}
 .educator-text>p{order:4;margin-top:9px;margin-bottom:14px}
 .educator-highlights{order:5;margin:9px 0 18px;gap:0 14px}
 .social-links{order:6;margin:7px 0 15px}
 .vip-section .vip-rail .vip-photo{flex:0 0 86%!important;height:330px}
 .pricing-title h2{font-size:clamp(35px,7.1vw,46px);line-height:1.12}
 .pricing-title p{font-size:13px}
 .price-plan-v5{min-height:0}
 .faq-heading-v7{text-align:left;font-size:31px;margin:10px 0 16px}
 .faq-layout.faq-narrow .faq-list{display:block!important}
 .faq{padding:26px 0 57px}
 .help-summary h2{font-size:clamp(27px,6.6vw,35px)}
 .footer-brand{display:block}.footer-brand p{white-space:normal;text-align:left;line-height:1.55;margin-top:14px!important;max-width:350px}
 .footer-bottom{display:grid;grid-template-columns:1fr auto;gap:17px 12px}.footer-copyright{white-space:normal}.footer-support{white-space:normal;text-align:right}.footer-legal{grid-column:1/-1;justify-content:flex-start;gap:10px 19px}.footer-legal a{font-size:11px}
 #viewer .lightbox-image-area{inset:58px 14px 89px}
 #viewer .lightbox-image-area img{max-height:100%}
 #viewer .lightbox-prev,#viewer .lightbox-next{top:auto;bottom:max(20px,env(safe-area-inset-bottom));transform:none}
}
@media(max-width:370px){.footer-bottom{grid-template-columns:1fr;gap:12px}.footer-support{text-align:left}.footer-legal{grid-column:1}}

/* Enable ordinary vertical document swiping even when a finger starts on a gallery card */
.smooth-rail,.smooth-rail .rail-slide,.works-grid .work-tile,.vip-rail .vip-photo{touch-action:pan-x pan-y!important}
