/* V15 — UX/UI refinement layer. Loaded last; only overrides, no content changes.
     Palette strictly follows RON INTERNATIONAL® brand tokens. */
  :root{
    --ron-gold:#4F6D0F;
    --ron-soft-gold:#EEECE6;
    --ron-danger:#12130F;
    --ron-serif:"RON VI Serif V24","Noto Serif",Georgia,"Times New Roman",serif;
    --ron-sans:"RON VI Sans V24","Noto Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    --ron-bar-h:72px;
    --ron-subnav-h:52px;
    --ron-sticky:calc(var(--ron-bar-h) + var(--ron-subnav-h) + 2px);
  }
  html{scroll-padding-top:var(--ron-sticky)}
  /* scroll-padding and scroll-margin add up; keep only the padding so anchors land right under the sticky nav */
  body.ron-v14 [data-ron-observe-section]{scroll-margin-top:0}

  /* Header: compact, one visual block with the section nav */
  body.ron-v14 .ron-product-menu-shell{min-height:var(--ron-bar-h);padding-block:8px}
  body.ron-v14 .ron-product-language-bar{box-shadow:none}
  body.ron-v14 .ron-subnav-section{top:var(--ron-bar-h);box-shadow:0 10px 30px rgba(18,19,15,.05)}
  .admin-bar .ron-subnav-section{top:calc(var(--ron-bar-h) + 32px)}
  body.ron-v14 .ron-subnav-shell{gap:4px}
  body.ron-v14 .ron-subnav-link{min-height:var(--ron-subnav-h);padding:0 18px;border-bottom-width:3px}
  body.ron-v14 .ron-subnav-link:hover{border-bottom-color:var(--ron-line)}
  body.ron-v14 .ron-subnav-active{border-bottom-color:var(--ron-lime)}
  .ron-subnav-buy{margin-left:auto;flex:0 0 auto;display:inline-flex;align-items:center;gap:14px;min-height:40px;padding:0 6px 0 16px;color:var(--ron-ink);font-size:13px;font-weight:750;letter-spacing:.06em;text-decoration:none;text-transform:uppercase;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
  .ron-subnav-buy-price{font-family:var(--ron-serif);font-size:19px;font-weight:400;letter-spacing:0;text-transform:none}
  .ron-subnav-buy-cta{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;background:var(--ron-ink);color:var(--ron-white);border:1px solid var(--ron-ink);transition:background .2s ease,color .2s ease}
  .ron-subnav-buy:hover .ron-subnav-buy-cta{background:var(--ron-lime);border-color:var(--ron-lime);color:var(--ron-ink)}
  .ron-subnav-buy:focus-visible{outline:3px solid var(--ron-lime);outline-offset:2px}
  body.ron-v15-past-buy .ron-subnav-buy{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease}

  /* Cart drawer: hide its shadow while closed (it leaked on the right edge) */
  .ron-cart-drawer:not([aria-hidden="false"]){visibility:hidden;box-shadow:none;transition:transform .24s ease,visibility 0s linear .24s}

  /* Typography — brand scale */
  body.ron-v14 .ron-eyebrow,
  body.ron-v14 .ron-section-kicker,
  body.ron-v14 .ron-dark-kicker{font-size:12px;font-weight:750;letter-spacing:.14em}
  body.ron-v14 .ron-section-title,
  body.ron-v14 .ron-dark-title,
  body.ron-v14 .ron-skin-title,
  body.ron-v14 .ron-texture-title,
  body.ron-v14 .ron-closing-title{font-size:clamp(34px,3.8vw,56px);line-height:1.22;letter-spacing:-.03em}
  body.ron-v14 [data-ron-observe-section]>.ron-section-shell>.ron-section-header{padding-top:0;border-top:0}
  body.ron-v14 [data-ron-observe-section]>.ron-section-shell>.ron-section-header::before{content:"";width:40px;height:3px;margin:0 auto 22px;background:var(--ron-lime)}
  body.ron-v14 .ron-section-intro{font-size:17px;line-height:1.8}

  /* Hero */
  body.ron-v14 .ron-hero-shell{align-items:start}
  @media (min-width:901px){
    body.ron-v14 .ron-gallery,
    body.ron-v14 .ron-product-panel{top:calc(var(--ron-sticky) + 20px)}
  }
  body.ron-v14 .ron-thumb-button:hover{border-color:var(--ron-green)}
  body.ron-v14 .ron-product-title{font-size:clamp(48px,5.3vw,84px);line-height:.98;letter-spacing:-.048em}
  body.ron-v14 .ron-product-name{margin-top:14px;font-size:clamp(18px,1.5vw,24px);font-weight:400;letter-spacing:.1em}
  body.ron-v14 .ron-product-subtitle{margin-top:18px;color:var(--ron-muted);font-size:17px;font-weight:400;line-height:1.7}
  body.ron-v14 .ron-price-row{margin-top:24px;padding:20px 0}
  body.ron-v14 .ron-benefit-list{gap:10px}
  body.ron-v14 .ron-benefit-item{font-size:15px}
  body.ron-v14 .ron-benefit-item::before{top:8px;width:8px;height:8px}
  body.ron-v14 .ron-quantity-box{grid-template-columns:48px minmax(0,1fr) 48px}
  body.ron-v14 .ron-quantity-input{width:100%}
  body.ron-v14 .ron-add-button,
  body.ron-v14 .ron-buy-now-link{min-height:54px}
  body.ron-v14 .ron-add-button{background:var(--ron-ink);border-color:var(--ron-ink)}
  body.ron-v14 .ron-policy-details{position:relative}
  body.ron-v14 .ron-policy-link:hover,
  body.ron-v14 .ron-policy-summary:hover{border-color:var(--ron-green)}

  /* Story */
  body.ron-v14 .ron-story-lead{font-size:clamp(24px,2.1vw,31px);line-height:1.5;letter-spacing:-.015em}
  body.ron-v14 .ron-pillar-card{min-height:0;padding:32px 28px 36px}
  body.ron-v14 .ron-pillar-title{font-size:clamp(22px,1.8vw,26px)}

  /* Skin fit */
  body.ron-v14 .ron-skin-intro{top:calc(var(--ron-sticky) + 32px)}
  body.ron-v14 .ron-skin-list{gap:10px}
  body.ron-v14 .ron-skin-item{padding:20px 24px 20px 54px}
  body.ron-v14 .ron-skin-item::before{top:29px;width:9px;height:9px}
  body.ron-v14 .ron-oily-note{background:var(--ron-white);color:var(--ron-ink);border:1px solid var(--ron-line);border-left:4px solid var(--ron-green)}
  body.ron-v14 .ron-oily-note strong{color:var(--ron-green)}

  /* Science (dark): restore legibility — brand rule: light text on deep green */
  body.ron-v14 .ron-science-section .ron-section-kicker,
  body.ron-v14 .ron-science-section .ron-science-label{color:var(--ron-lime)}
  body.ron-v14 .ron-science-section .ron-section-title{color:var(--ron-white)}
  body.ron-v14 .ron-science-section .ron-science-card{padding:34px 30px;border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.03)}
  body.ron-v14 .ron-science-section .ron-science-title{color:var(--ron-white);font-size:clamp(24px,2vw,29px)}
  body.ron-v14 .ron-science-section .ron-science-copy{color:rgba(255,255,255,.76)}
  body.ron-v14 .ron-peptide-list{padding:18px 0;list-style:none;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;border-color:rgba(255,255,255,.14)}
  body.ron-v14 .ron-peptide-item{padding:7px 10px;border:1px solid rgba(189,220,36,.35);color:rgba(255,255,255,.9);font-size:12.5px;line-height:1.4}

  /* Texture, routine, details */
  body.ron-v14 .ron-texture-statement{font-size:clamp(17px,1.4vw,20px);font-weight:650}
  body.ron-v14 .ron-routine-line{font-size:14px;font-weight:650;line-height:2}
  body.ron-v14 .ron-step-card{min-height:0;padding:28px 24px 34px}
  body.ron-v14 .ron-step-number{margin-bottom:18px}
  body.ron-v14 .ron-details-summary:hover{color:var(--ron-green)}

  @media (max-width:1180px){
    body.ron-v14 .ron-product-title{font-size:clamp(46px,6vw,70px)}
    .ron-subnav-buy-price{display:none}
  }

  /* Mobile: one-row header + section nav (≈106px instead of 186px) */
  @media (max-width:760px){
    :root{--ron-sticky:106px}
    body.ron-v14 .ron-v14-topline{display:block;overflow:hidden;font-size:8.5px;letter-spacing:.05em;white-space:nowrap;text-overflow:ellipsis}
    body.ron-v14 .ron-product-menu-shell{flex-wrap:wrap;align-items:center;padding:8px 12px 0;min-height:0}
    body.ron-v14 .ron-v14-brand{max-width:none;margin:0 auto 8px 0;white-space:nowrap}
    body.ron-v14 .ron-v14-brand strong{font-size:15px;letter-spacing:.02em}
    body.ron-v14 .ron-v14-brand small{margin-top:5px;font-size:8px;letter-spacing:.12em}
    body.ron-v14 .ron-v14-tools{gap:6px;margin:0 0 8px auto}
    body.ron-v14 .ron-product-language-picker{position:static;width:auto;flex:0 0 auto;margin:0}
    body.ron-v14 .ron-product-language-picker summary{height:44px;min-height:44px;gap:6px;padding:0 10px;font-size:14px}
    body.ron-v14 .ron-product-current-country .ronLocaleCode{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
    body.ron-v14 .ron-product-language-options{position:fixed;top:60px;left:12px;right:12px;width:auto;max-height:70vh}
    body.ron-v14 .ron-commerce-icon{width:44px;height:44px}
    body.ron-v14 .ron-product-menu-panel a{min-height:44px;padding:0 14px}
    body.ron-v14 .ron-product-hero{padding-top:0}
    body.ron-v14 .ron-main-figure{border-top:0}
    body.ron-v14 .ron-product-panel{margin:20px 16px 0;padding:26px 20px}
    body.ron-v14 .ron-product-title{font-size:clamp(44px,13vw,60px)}
    body.ron-v14 .ron-product-name{font-size:18px}
    body.ron-v14 .ron-product-subtitle{font-size:16px}
    body.ron-v14 .ron-buy-form{grid-template-columns:132px minmax(0,1fr);gap:10px}
    body.ron-v14 .ron-quantity-box{width:auto;grid-template-columns:40px minmax(0,1fr) 40px}
    body.ron-v14 .ron-quantity-button{min-width:40px}
    body.ron-v14 .ron-add-button{padding-inline:10px;font-size:13px}
    body.ron-v14 .ron-policy-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
    body.ron-v14 .ron-policy-link,
    body.ron-v14 .ron-policy-summary{font-size:12px;padding-inline:6px}
    body.ron-v14 .ron-policy-summary{padding-right:24px}
    body.ron-v14 .ron-policy-summary::after{right:8px}
    body.ron-v14 [data-ron-observe-section]>.ron-section-shell>.ron-section-header::before{margin-left:0}
    body.ron-v14 .ron-section-title,
    body.ron-v14 .ron-dark-title,
    body.ron-v14 .ron-skin-title,
    body.ron-v14 .ron-texture-title,
    body.ron-v14 .ron-closing-title{font-size:clamp(30px,8.6vw,38px);line-height:1.25}
    body.ron-v14 .ron-story-lead{font-size:23px;line-height:1.5}
    body.ron-v14 .ron-routine-line{font-size:13px;line-height:1.9}
    body.ron-v14 .ron-step-card{padding:22px 20px}
    body.ron-v14 .ron-mobile-buy-section{box-shadow:0 -10px 30px rgba(18,19,15,.08)}
  }
  @media (max-width:380px){
    body.ron-v14 .ron-v14-brand strong{font-size:14px}
    body.ron-v14 .ron-product-language-picker summary{padding:0 8px}
    body.ron-v14 .ron-buy-form{grid-template-columns:120px minmax(0,1fr)}
  }
  @media (prefers-reduced-motion:reduce){
    .ron-subnav-buy,body.ron-v15-past-buy .ron-subnav-buy{transition:none}
  }

/* The live WordPress page uses the shared RON product header, not the
   standalone mockup's menu. These overrides affect Night Cream only. */
@media (min-width:761px){
  body.ron-v14 .ron-ph[data-sticky="true"]{z-index:950}
  body.ron-v14 .ron-ph__announcement{display:none}
  body.ron-v14 .ron-ph__main-inner{min-height:72px}
  body.ron-v14 .ron-ph__tab{min-height:52px}
  body.ron-v14 .ron-ph__tab-track .ron-subnav-buy{white-space:nowrap}
}
@media (max-width:760px){
  body.ron-v14 .ron-ph__tab-track .ron-subnav-buy{display:none!important}
}
