/*
Theme Name: Rejuvea HA
Theme URI: https://rejuveaha.com
Author: WebVue
Author URI: https://webvue.com.lb
Description: Photography-first dermocosmetic theme for Rejuvea HA. Pixel-faithful port of the Rejuvea design system with editable content (ACF) and site-wide settings (Customizer). Auto-creates all pages on activation.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rejuvea
*/

/* ===================== DESIGN TOKENS ===================== */
:root{
 --brand:#0056b7; --brand-bright:#1a6fe0; --brand-deep:#003a7a; --brand-ink:#062a55;
 --ink:#0c1626; --ink-soft:#3a4456; --muted:#6b7488;
 --canvas:#ffffff; --parchment:#f4f6fb; --mist:#e9eff8; --line:#e4e8f0;
 --dark:#08152b; --dark-2:#0c1d3a;
 --serif:"Newsreader",Georgia,serif; --sans:"Hanken Grotesk",system-ui,-apple-system,sans-serif;
}

/* ===================== RESET / BASE ===================== */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--canvas);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
::selection{background:#0056b7;color:#fff;}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}
button{font-family:var(--sans);}

/* scroll-reveal */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1);}
[data-reveal].is-in{opacity:1;transform:none;}

::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:#eef2f8}
::-webkit-scrollbar-thumb{background:#c2cee2;border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:#a9b9d4}

/* ===================== KEYFRAMES ===================== */
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
@keyframes floatY2{0%,100%{transform:translateY(0)}50%{transform:translateY(15px)}}
@keyframes spinSlow{to{transform:rotate(360deg)}}
@keyframes spinRev{to{transform:rotate(-360deg)}}
@keyframes drift{0%{transform:translate(0,0)}50%{transform:translate(34px,-28px)}100%{transform:translate(0,0)}}
@keyframes drift2{0%{transform:translate(0,0)}50%{transform:translate(-30px,26px)}100%{transform:translate(0,0)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes descend{0%{transform:translateY(-10px);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(420px);opacity:0}}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 rgba(26,111,224,.5)}50%{box-shadow:0 0 0 14px rgba(26,111,224,0)}}
@keyframes rjPreMark{0%{opacity:0;transform:translateY(16px) scale(.9);filter:blur(5px)}100%{opacity:1;transform:none;filter:none}}
@keyframes rjPreBar{0%{transform:translateX(-100%)}100%{transform:translateX(0)}}
@keyframes rjPreGlow{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}
@keyframes rjPreFade{0%{opacity:0;transform:translateY(6px)}100%{opacity:1;transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes floatMol{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}
@keyframes helix{0%{transform:rotateY(0deg)}100%{transform:rotateY(360deg)}}
@keyframes popIn{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}

/* ===================== COMPONENT HOVER STATES ===================== */
.rj-prod:hover .rj-prodimg{transform:scale(1.05);}
.rj-prod:hover{transform:translateY(-8px);box-shadow:0 30px 70px -36px rgba(8,21,43,.45);border-color:#d4ddec;}
.rj-concern:hover{transform:translateY(-6px);border-color:var(--brand);}
.rj-concern:hover .rj-cnum{color:var(--brand);}
.rj-cred:hover .rj-credring{transform:translateY(-4px);border-color:rgba(0,86,183,.4);color:var(--brand);}
.rj-pill{transition:background .25s,color .25s,border-color .25s,transform .25s;}
.rj-pill:hover{transform:translateY(-2px);}
.rj-opt{transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s,background .3s;}
.rj-opt:hover{transform:translateY(-5px);border-color:var(--brand);box-shadow:0 16px 38px -24px rgba(0,86,183,.4);}
.rj-step:hover .rj-stepimg{transform:scale(1.06) translateY(-4px);}
.rj-step:hover{border-color:#d4ddec;box-shadow:0 30px 64px -38px rgba(8,21,43,.4);transform:translateY(-6px);}
.rj-fcol a{transition:color .25s,padding-left .25s;}
.rj-fcol a:hover{color:#fff!important;padding-left:5px;}

/* contact form fields */
.rj-field{width:100%;font-family:var(--sans);font-size:15px;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:15px 17px;outline:none;transition:border-color .25s,box-shadow .25s;}
.rj-field:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(0,86,183,.1);}
.rj-field::placeholder{color:#9aa3b4;}

/* ===================== RESPONSIVE ===================== */
@media(max-width:1040px){.rj-optrow{grid-template-columns:repeat(2,1fr)!important;}.rj-steprow{grid-template-columns:1fr!important;}}
@media(max-width:980px){
  .rj-herogrid{grid-template-columns:1fr!important;gap:48px!important;}
  .rj-herovis{display:none!important;}
  .rj-split{grid-template-columns:1fr!important;gap:40px!important;}
  .rj-prodgrid{grid-template-columns:1fr 1fr!important;}
  .rj-concerns{grid-template-columns:1fr 1fr!important;}
  .rj-tabs{grid-template-columns:1fr!important;}
  .rj-panel{grid-template-columns:1fr!important;gap:40px!important;}
  .rj-vis{display:none!important;}
  .rj-spec{grid-template-columns:1fr!important;}
  .rj-tier{grid-template-columns:1fr!important;}
  .rj-trends{grid-template-columns:1fr!important;}
  .rj-penmodel{grid-template-columns:1fr!important;gap:40px!important;}
  .rj-steps{grid-template-columns:1fr 1fr!important;}
  .rj-benefits{grid-template-columns:1fr!important;}
  .rj-types{grid-template-columns:1fr!important;}
  .rj-routines{grid-template-columns:1fr!important;gap:32px!important;}
  .rj-facts{grid-template-columns:1fr!important;}
  .rj-csplit{grid-template-columns:1fr!important;}
  .rj-frow{grid-template-columns:1fr!important;}
  .rj-bizbar{flex-direction:column!important;align-items:flex-start!important;}
}
@media(max-width:880px){.rj-desk{display:none!important;}.rj-burger{display:flex!important;}.rj-fgrid{grid-template-columns:1fr 1fr!important;}.rj-ftop{flex-direction:column!important;align-items:flex-start!important;gap:32px!important;}}
@media(max-width:860px){.rj-credgrid{grid-template-columns:1fr 1fr!important;gap:48px 0;}.rj-cred:nth-child(3){border-left:none!important;}}
@media(max-width:768px){.rj-hero-desktop{display:none!important;}.rj-hero-mobile{display:block!important;}}
@media(max-width:760px){
  main>section{padding-top:80px!important;padding-bottom:80px!important;padding-left:20px!important;padding-right:20px!important;}
  main>section:first-child{padding-top:108px!important;}
  #rj-results{padding-top:0!important;padding-bottom:0!important;}
  .rj-stats{grid-template-columns:1fr 1fr!important;gap:36px 0;}
  .rj-stat:nth-child(3){border-left:none!important;}
  .rj-labhero-inner{padding-left:0!important;padding-right:0!important;padding-bottom:56px!important;}
}
@media(max-width:620px){.rj-tabrow{flex-direction:column!important;align-items:flex-start!important;}.rj-tierhead{flex-direction:column!important;align-items:flex-start!important;gap:14px!important;}.rj-benefithead{flex-direction:column!important;align-items:flex-start!important;gap:14px!important;}}
@media(max-width:620px){.rj-prodgrid,.rj-concerns{grid-template-columns:1fr!important;}}
@media(max-width:600px){.rj-navbar{padding-left:20px!important;padding-right:20px!important;}#rj-mobile{padding-left:20px!important;padding-right:20px!important;}.rj-fgrid{grid-template-columns:1fr!important;gap:36px!important;}.rj-fpad{padding-left:22px!important;padding-right:22px!important;padding-top:60px!important;}.rj-csplit>div{padding-left:24px!important;padding-right:24px!important;}.rj-steps{grid-template-columns:1fr!important;}}
@media(max-width:560px){.rj-optrow{grid-template-columns:1fr!important;}}