/* Nail Guide 4.5.1 — restrained glass design system */
:root{
  --ng-glass-bg:rgba(255,255,255,.76);
  --ng-glass-bg-strong:rgba(255,255,255,.9);
  --ng-glass-border:rgba(174,151,145,.18);
  --ng-glass-shadow:0 10px 30px rgba(58,45,40,.055),inset 0 1px 0 rgba(255,255,255,.72);
  --ng-glass-shadow-hover:0 16px 42px rgba(58,45,40,.09),inset 0 1px 0 rgba(255,255,255,.82);
  --ng-glass-blur:10px;
  --ng-glass-radius:22px;
}
body.ng-branded-site{
  background:linear-gradient(180deg,#fffdfa 0%,#f8f2ed 48%,#fffdfa 100%);
  background-attachment:scroll;
}
body.ng-branded-site::before{display:none!important}

/* Glass is used only on clear UI surfaces, not every content block. */
body.ng-branded-site :is(
 .ng-site-header,.site-header,.ng-job-detail__anchor,.ng-single-nav,.ng-topic-nav,
 .ng-search,.ng-search-suggestions,.ng-job-search,.ng-career-panel,
 .ng-salon-card,.ng-journal-card,.ng-job-card,.ng-job-salon-card,
 .ng-salon-problem__item,.ng-salon-reason,.ng-salon-flow__item,
 .ng-menu-card,.ng-staff-card,.ng-faq-item,.ng-access__map,
 .ng-job-detail__condition-cards>div,.ng-job-detail__benefit-cards>li,
 .ng-job-detail__story-grid>article,.ng-job-location-grid>a,
 .ng-brand-detail__salons a,.ng-brand-detail__jobs a,.ng-related-card
){
  background:var(--ng-glass-bg);
  border:1px solid var(--ng-glass-border);
  -webkit-backdrop-filter:blur(var(--ng-glass-blur)) saturate(108%);
  backdrop-filter:blur(var(--ng-glass-blur)) saturate(108%);
  box-shadow:var(--ng-glass-shadow);
}
body.ng-branded-site :is(.ng-salon-card,.ng-journal-card,.ng-job-card,.ng-job-salon-card){
  overflow:hidden;border-radius:var(--ng-glass-radius);
}
body.ng-branded-site :is(.ng-salon-card>a,.ng-journal-card>a){background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
@media(hover:hover){body.ng-branded-site :is(.ng-salon-card,.ng-journal-card,.ng-job-card,.ng-job-salon-card,.ng-menu-card,.ng-staff-card):hover{transform:translateY(-3px);background:var(--ng-glass-bg-strong);box-shadow:var(--ng-glass-shadow-hover)}}

/* Keep editorial sections clean; avoid the heavy outlined-box look. */
body.single-ng_job .ng-job-detail__section,
body.ng-salon-page .ng-salon-section{background:transparent}
body.single-ng_job .ng-job-detail__work,
body.single-ng_job .ng-job-detail__benefit-section{
  padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
body.single-ng_job .ng-job-detail__editor{
  max-width:none;margin:0;padding:clamp(24px,4vw,38px);
  border:1px solid var(--ng-glass-border);border-radius:22px;background:var(--ng-glass-bg);
  -webkit-backdrop-filter:blur(var(--ng-glass-blur));backdrop-filter:blur(var(--ng-glass-blur));box-shadow:var(--ng-glass-shadow);
}

/* Job anchor menu: always visually centered. */
body.single-ng_job .ng-job-detail__anchor{justify-content:center!important}
body.single-ng_job .ng-job-detail__anchor a{flex:0 0 auto;text-align:center}

/* Salon archive titles: elegant but not oversized. */
body.post-type-archive-salon .ng-salon-card h3,
body.ng-template-archive-salon .ng-salon-card h3,
body.ng-branded-site .ng-salon-card h3{font-size:clamp(1.35rem,2.1vw,1.75rem)!important;line-height:1.35!important}

/* Journal: one “all articles” link per breakpoint. */
@media(max-width:767px){
 body.nailguide-home .ng-desktop-link{display:none!important}
 body.nailguide-home .ng-mobile-link{display:inline-flex!important}
 body.single-ng_job .ng-job-detail__anchor{justify-content:center!important;overflow-x:auto}
 body.single-ng_job .ng-job-detail__anchor a{padding-inline:11px!important}
}
@media(min-width:768px){
 body.nailguide-home .ng-desktop-link{display:inline-flex!important}
 body.nailguide-home .ng-mobile-link{display:none!important}
}

/* Dark CTAs retain depth without a harsh glowing outline. */
body.ng-branded-site :is(.ng-final-cta__inner,.ng-salon-final__inner,.ng-job-detail__brand-section){
 border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 46px rgba(20,16,14,.13),inset 0 1px 0 rgba(255,255,255,.06)
}
body.ng-branded-site :is(.ng-button,.ng-job-detail__hero-cta,.ng-job-detail__apply-card>a){box-shadow:0 9px 24px rgba(163,111,123,.14),inset 0 1px 0 rgba(255,255,255,.28)}

@media(max-width:700px){
 :root{--ng-glass-blur:7px;--ng-glass-radius:18px}
 body.ng-branded-site :is(.ng-salon-card,.ng-journal-card,.ng-job-card,.ng-menu-card,.ng-staff-card,.ng-faq-item){box-shadow:0 8px 24px rgba(57,45,38,.05),inset 0 1px 0 rgba(255,255,255,.65)}
}
@supports not ((-webkit-backdrop-filter:blur(2px)) or (backdrop-filter:blur(2px))){body.ng-branded-site :is(.ng-search,.ng-salon-card,.ng-journal-card,.ng-job-card,.ng-menu-card,.ng-staff-card,.ng-faq-item){background:#fffaf7}}

/* Nail Guide 4.6.0 — unified editorial glass design system */
:root{
  --ng-space-section:clamp(76px,9vw,124px);
  --ng-space-card:clamp(22px,3.2vw,36px);
  --ng-radius-card:24px;
  --ng-radius-small:16px;
  --ng-line:rgba(91,72,65,.10);
  --ng-ink:#302b28;
  --ng-muted:#756c66;
  --ng-glass-bg:rgba(255,255,255,.68);
  --ng-glass-bg-strong:rgba(255,255,255,.82);
  --ng-glass-border:rgba(255,255,255,.72);
  --ng-glass-shadow:0 16px 48px rgba(61,45,39,.065),inset 0 1px 0 rgba(255,255,255,.9);
  --ng-glass-shadow-hover:0 24px 62px rgba(61,45,39,.105),inset 0 1px 0 rgba(255,255,255,.95);
  --ng-glass-blur:14px;
}
body.ng-branded-site{
  color:var(--ng-ink);
  background:
    radial-gradient(circle at 12% 12%,rgba(236,211,215,.22),transparent 31%),
    radial-gradient(circle at 88% 38%,rgba(246,222,202,.18),transparent 30%),
    linear-gradient(180deg,#fffdfb 0%,#f8f2ed 52%,#fffdfb 100%);
}
body.ng-branded-site :is(h1,h2,h3){text-wrap:balance}
body.ng-branded-site :is(p,li,dd){text-wrap:pretty}

/* Shared card language: quiet transparency, fine edge and generous inner space. */
body.ng-branded-site :is(
 .ng-salon-card,.ng-journal-card,.ng-job-card,.ng-job-salon-card,
 .ng-menu-card,.ng-staff-card,.ng-faq-item,.ng-related-card,
 .ng-salon-problem__item,.ng-salon-reason,.ng-salon-flow__item,
 .ng-job-detail__condition-cards>div,.ng-job-detail__benefit-cards>li,
 .ng-job-detail__story-grid>article,.ng-job-location-grid>a
){
  border:1px solid var(--ng-glass-border)!important;
  border-radius:var(--ng-radius-card)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(255,255,255,.56))!important;
  -webkit-backdrop-filter:blur(var(--ng-glass-blur)) saturate(112%);
  backdrop-filter:blur(var(--ng-glass-blur)) saturate(112%);
  box-shadow:var(--ng-glass-shadow)!important;
}
@media(hover:hover){
 body.ng-branded-site :is(.ng-salon-card,.ng-journal-card,.ng-job-card,.ng-job-salon-card,.ng-menu-card,.ng-staff-card,.ng-job-location-grid>a):hover{
   transform:translateY(-4px);
   box-shadow:var(--ng-glass-shadow-hover)!important;
 }
}

/* Global rhythm. */
body.ng-salon-page .ng-salon-section,
body.single-ng_job .ng-job-detail__section{margin-block:0 var(--ng-space-section)!important}
body.ng-salon-page .ng-salon-section:last-child,
body.single-ng_job .ng-job-detail__section:last-child{margin-bottom:0!important}
body.ng-salon-page :is(.ng-section-heading,.ng-salon-section__heading),
body.single-ng_job .ng-job-detail__section-heading{margin-bottom:clamp(28px,4vw,46px)!important}

/* Job detail: editorial work copy, not a small floating chip. */
body.single-ng_job .ng-job-detail__work .ng-job-detail__editor{
  position:relative;
  padding:clamp(28px,4.5vw,48px) clamp(8px,2vw,20px)!important;
  border:0!important;
  border-top:1px solid var(--ng-line)!important;
  border-bottom:1px solid var(--ng-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
body.single-ng_job .ng-job-detail__work .ng-job-detail__editor::before{
  content:"";
  position:absolute;left:0;top:clamp(28px,4.5vw,48px);width:34px;height:2px;
  background:var(--ng-brand);border-radius:999px;
}
body.single-ng_job .ng-job-detail__work .ng-job-detail__editor p{
  max-width:780px;margin:0 0 0 clamp(48px,7vw,86px)!important;
  color:#554d48!important;font-size:clamp(15px,1.55vw,18px)!important;line-height:2.15!important;
}

/* Benefits are one consistent check-card system. */
body.single-ng_job .ng-job-detail__benefit-cards{gap:10px!important}
body.single-ng_job .ng-job-detail__benefit-cards li{
  min-height:62px!important;padding:14px 16px!important;border-radius:16px!important;color:#514944!important;
}
body.single-ng_job .ng-job-detail__benefit-cards li span{
  width:25px!important;height:25px!important;flex-basis:25px!important;
  border:1px solid rgba(190,140,149,.28);background:rgba(244,224,228,.74)!important;
}

/* Job anchor: equal outlined glass pills; only active section gets a soft tint. */
body.single-ng_job .ng-job-detail__anchor{
  justify-content:center!important;gap:7px!important;
  width:min(calc(100% - 28px),830px);margin:-26px auto 0!important;
  padding:8px!important;border:1px solid rgba(255,255,255,.8)!important;border-radius:999px!important;
  background:rgba(255,252,249,.76)!important;box-shadow:0 16px 42px rgba(55,42,36,.09)!important;
}
body.single-ng_job .ng-job-detail__anchor a{
  flex:0 1 auto!important;min-width:0;padding:9px 18px!important;
  border:1px solid rgba(190,140,149,.25)!important;border-radius:999px!important;
  background:transparent!important;color:#665e58!important;
}
body.single-ng_job .ng-job-detail__anchor a.is-active{
  background:rgba(241,219,223,.72)!important;border-color:rgba(190,140,149,.38)!important;color:#9e6570!important;
}

/* Brand presentation: logo, identity and link stay visible as one complete block. */
body.single-ng_job .ng-job-detail__brand-section{
  grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr)!important;
  overflow:hidden;position:relative;
  background:linear-gradient(135deg,#24211f 0%,#342e2b 100%)!important;
}
body.single-ng_job .ng-job-detail__brand-section::after{
  content:"";position:absolute;width:280px;height:280px;right:-100px;top:-120px;border-radius:50%;
  background:rgba(190,140,149,.13);filter:blur(4px);pointer-events:none;
}
body.single-ng_job .ng-job-detail__brand-heading,
body.single-ng_job .ng-job-detail__brand-copy{position:relative;z-index:1}
body.single-ng_job .ng-job-detail__brand-logo{
  width:min(100%,320px)!important;min-height:168px!important;padding:24px!important;
  display:grid!important;place-items:center!important;border:1px solid rgba(255,255,255,.58)!important;
  background:rgba(255,255,255,.94)!important;box-shadow:0 16px 40px rgba(0,0,0,.13)!important;
}
body.single-ng_job .ng-job-detail__brand-logo img{height:118px!important;max-width:100%!important}
body.single-ng_job .ng-job-detail__brand-copy a{padding:13px 18px!important;background:rgba(255,255,255,.07)!important}

/* Location cards: image first, then readable station/store hierarchy. */
body.single-ng_job .ng-job-location-grid__copy{padding:22px 22px 24px!important}
body.single-ng_job .ng-job-location-grid__copy strong{font-size:clamp(18px,2vw,22px)!important;line-height:1.45!important}
body.single-ng_job .ng-job-location-grid__copy small{font-size:12px!important}

/* Final conversion areas are unmistakable, but still refined. */
body.ng-salon-page .ng-salon-final__inner,
body.single-ng_job .ng-job-detail__apply-card{
  border:1px solid rgba(255,255,255,.82)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,255,255,.65))!important;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  box-shadow:0 22px 64px rgba(75,51,55,.11)!important;
}
body.ng-salon-page :is(.ng-button,.ng-mobile-reserve a),
body.single-ng_job :is(.ng-job-detail__hero-cta,.ng-job-detail__apply-card>a){
  min-height:56px;border-radius:999px!important;box-shadow:0 12px 30px rgba(169,105,118,.18)!important;
}

/* Salon / archive / journal typography and spacing. */
body.ng-branded-site .ng-salon-card h3{font-size:clamp(1.22rem,1.8vw,1.62rem)!important;line-height:1.38!important}
body.ng-branded-site :is(.ng-salon-card,.ng-journal-card) :is(.ng-card-content,.ng-salon-card__body,.ng-journal-card__body){padding:clamp(20px,3vw,30px)!important}
body.nailguide-home .ng-journal-card{overflow:hidden}
body.nailguide-home .ng-journal-card img{transition:transform .65s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover){body.nailguide-home .ng-journal-card:hover img{transform:scale(1.025)}}

@media(max-width:850px){
 :root{--ng-space-section:72px;--ng-glass-blur:9px;--ng-radius-card:19px}
 body.single-ng_job .ng-job-detail__anchor{
   justify-content:flex-start!important;width:calc(100% - 16px);margin:-22px 8px 0!important;
   overflow-x:auto!important;scrollbar-width:none;
 }
 body.single-ng_job .ng-job-detail__anchor::-webkit-scrollbar{display:none}
 body.single-ng_job .ng-job-detail__anchor a{flex:0 0 auto!important;padding:8px 12px!important}
 body.single-ng_job .ng-job-detail__work .ng-job-detail__editor{padding:28px 2px!important}
 body.single-ng_job .ng-job-detail__work .ng-job-detail__editor::before{top:28px}
 body.single-ng_job .ng-job-detail__work .ng-job-detail__editor p{margin-left:44px!important;font-size:15px!important}
 body.single-ng_job .ng-job-detail__brand-section{grid-template-columns:1fr!important}
 body.single-ng_job .ng-job-detail__brand-logo{width:min(100%,260px)!important;min-height:138px!important;margin-bottom:18px!important}
 body.single-ng_job .ng-job-detail__brand-logo img{height:92px!important}
}
