/* ===== RREA — Roze Rohaya Employment Agency ===== */
:root{
  --navy:#093399;
  --navy-hi:#1247C7;
  --deep:#061C58;
  --deeper:#04123B;
  --orange:#EB5929;
  --orange-hi:#F26A3B;
  --orange-lo:#C9430F;
  --ink:#0B1330;
  --muted:#5A6278;
  --fog:#F5F6FA;
  --mist:#E9ECF5;
  --white:#FFFFFF;
  --line:rgba(9,51,153,.13);
  --line-dark:rgba(255,255,255,.16);
  --r-xl:22px; --r-lg:18px; --r-md:14px; --r-sm:10px;
  --wrap:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --wa:#1FA855;
}
*{box-sizing:border-box}
html{color-scheme:light}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{
  margin:0; background:var(--white); color:var(--ink);
  font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:clip;
}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3,h4,p,ul,ol{margin:0}
ul,ol{padding:0; list-style:none}
h1,h2,h3,h4{font-weight:800; letter-spacing:-.035em; line-height:1; text-wrap:balance; color:var(--ink)}
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(20px,4.5vw,56px)}
.serif{font-family:"Cormorant Garamond",Georgia,serif}
:focus-visible{outline:3px solid var(--orange); outline-offset:3px; border-radius:6px}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}

/* type */
.eyebrow{font-size:13px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--orange); margin-bottom:22px; display:flex; align-items:center; gap:12px}
.eyebrow::before{content:""; width:28px; height:2px; background:currentColor}
.on-dark .eyebrow,.eyebrow.light{color:#FF9C77}
.display{font-size:clamp(42px,6.4vw,88px); font-weight:800; letter-spacing:-.04em; line-height:.98}
.h2{font-size:clamp(30px,4vw,54px); letter-spacing:-.035em; line-height:1.05}
.h3{font-size:clamp(22px,2.2vw,30px); letter-spacing:-.025em; line-height:1.15}
.lead{font-size:clamp(18px,1.7vw,22px); line-height:1.5; color:var(--muted); max-width:34em}
.on-dark .lead,.on-dark p{color:rgba(255,255,255,.78)}
.on-dark h1,.on-dark h2,.on-dark h3,.on-dark h4{color:#fff}
.accent{color:var(--orange)}
.navy{color:var(--navy)}

/* buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; font:700 16px/1 "Plus Jakarta Sans",sans-serif; letter-spacing:-.01em;
  padding:17px 28px; border-radius:12px; text-decoration:none; border:1.5px solid transparent; cursor:pointer; white-space:nowrap;
  transition:transform .35s var(--ease), background .25s, color .25s, border-color .25s, box-shadow .35s var(--ease)}
.btn svg{width:20px; height:20px; flex:none}
.btn-primary{background:var(--orange); color:#fff; box-shadow:0 14px 34px -14px rgba(235,89,41,.7)}
.btn-primary:hover{background:var(--orange-hi); transform:translateY(-2px); box-shadow:0 22px 40px -16px rgba(235,89,41,.8)}
.btn-navy{background:var(--navy); color:#fff}
.btn-navy:hover{background:var(--navy-hi); transform:translateY(-2px)}
.btn-ghost{background:transparent; color:var(--navy); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--navy); transform:translateY(-2px)}
.on-dark .btn-ghost{color:#fff; border-color:var(--line-dark)}
.on-dark .btn-ghost:hover{border-color:#fff}
.link-arrow{display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--navy); text-decoration:none}
.link-arrow svg{width:18px; height:18px; transition:transform .3s var(--ease)}
.link-arrow:hover svg{transform:translateX(5px)}
.on-dark .link-arrow{color:#fff}

/* ===== nav ===== */
.site-head{position:sticky; top:0; z-index:100; background:rgba(255,255,255,.78); backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px); border-bottom:1px solid transparent; transition:border-color .3s, background .3s}
.site-head.scrolled{border-color:var(--line); background:rgba(255,255,255,.9)}
.nav{display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:78px}
.brand img{height:50px; width:auto}
.nav-links{display:flex; align-items:center; gap:6px}
.nav-links a{font-size:15px; font-weight:600; color:var(--muted); text-decoration:none; padding:10px 14px; border-radius:10px; transition:color .2s, background .2s; white-space:nowrap}
.nav-links a:hover{color:var(--navy); background:var(--fog)}
.nav-links a.tab-care{
  font-family:"Cormorant Garamond",Georgia,serif; font-style:italic; font-weight:700; font-size:22px; letter-spacing:.005em; color:var(--navy);
  background:linear-gradient(135deg,rgba(9,51,153,.09),rgba(9,51,153,.04)); padding:6px 20px 8px; margin-left:8px; border:1px solid rgba(9,51,153,.16)}
.nav-links a.tab-care:hover{background:rgba(9,51,153,.14)}
.nav-links a.tab-care[aria-current]{background:var(--navy); color:#fff; border-color:var(--navy)}
.nav-links .tab-cta{background:var(--orange); color:#fff; padding:12px 22px; margin-left:6px; display:inline-flex; align-items:center; gap:9px; border:none; border-radius:10px; font-family:inherit; font-size:15px; font-weight:600; cursor:pointer; white-space:nowrap}
.nav-links .tab-cta:hover{background:var(--orange-hi)}
.nav-links .tab-cta svg{width:18px; height:18px}
.menu-btn{display:none; width:46px; height:46px; border-radius:50%; border:1px solid var(--line); background:#fff; cursor:pointer; align-items:center; justify-content:center}
.menu-btn svg{width:22px; height:22px}
.drawer{position:fixed; inset:0; z-index:200; background:var(--deeper); color:#fff; display:flex; flex-direction:column; padding:22px clamp(20px,6vw,48px) 36px; transform:translateY(-102%); transition:transform .55s var(--ease); overflow-y:auto}
.drawer.open{transform:none}
.drawer-top{display:flex; justify-content:space-between; align-items:center}
.drawer-top .plate{background:#fff; padding:8px 14px; border-radius:12px}
.drawer-top img{height:40px}
.drawer nav{display:flex; flex-direction:column; margin-top:36px}
.drawer nav a{font-size:clamp(30px,8vw,46px); font-weight:800; letter-spacing:-.035em; text-decoration:none; color:#fff; padding:14px 0; border-bottom:1px solid var(--line-dark)}
.drawer nav a.tab-care{font-family:"Cormorant Garamond",serif; font-style:italic; color:#FFB69C}
.drawer .btn{margin-top:28px}
.drawer .close{width:46px; height:46px; border-radius:50%; border:1px solid var(--line-dark); background:none; color:#fff; cursor:pointer; display:grid; place-items:center}

/* ===== reveal ===== */
.rv{transition:opacity .9s var(--ease), transform .9s var(--ease)}
.rv.pre{opacity:0; transform:translateY(38px)}
.rv.pre.d1{transition-delay:.08s}.rv.pre.d2{transition-delay:.16s}.rv.pre.d3{transition-delay:.24s}.rv.pre.d4{transition-delay:.32s}
.rv.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){.rv,.rv.pre{opacity:1!important; transform:none!important; transition:none!important} *{animation:none!important}}

section{position:relative}
.sec{padding-block:clamp(72px,8vw,120px)}
.sec-fog{background:var(--fog)}
.sec-deep{background:var(--deep); color:#fff}
.sec-deeper{background:var(--deeper); color:#fff}

/* ===== hero ===== */
.hero{padding-top:clamp(36px,5vw,72px); padding-bottom:clamp(64px,8vw,110px)}
.hero-top{display:grid; grid-template-columns:1fr; gap:34px}
.hero .display{max-width:15ch}
.hero-row{display:flex; align-items:flex-end; justify-content:space-between; gap:40px; flex-wrap:wrap; margin-top:34px}
.hero-row .lead{font-size:clamp(19px,2vw,26px); color:var(--ink); max-width:22em; letter-spacing:-.015em; font-weight:500}
.hero-row .lead b{color:var(--navy); font-weight:700}
.cta-row{display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.hero-note{font-size:14px; color:var(--muted); margin-top:16px; display:flex; align-items:center; gap:8px}
.hero-note i{width:9px; height:9px; border-radius:50%; background:var(--wa); box-shadow:0 0 0 0 rgba(31,168,85,.6); animation:ping 2.2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 12px rgba(31,168,85,0)}100%{box-shadow:0 0 0 0 rgba(31,168,85,0)}}
.film{position:relative; margin-top:clamp(40px,5vw,64px); border-radius:var(--r-xl); overflow:hidden; aspect-ratio:21/9; background:var(--deep); isolation:isolate}
.film img,.film video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.film img{animation:kb 14s ease-in-out infinite alternate}
.film video{object-fit:contain; background:var(--deep)}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.09) translate(-1.2%,-1%)}}
.film::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,rgba(4,18,59,.55)); z-index:1; pointer-events:none}
.film-tag{position:absolute; left:26px; bottom:24px; z-index:2; color:#fff; display:flex; align-items:center; gap:12px; font-weight:600; font-size:15px}
.film-tag .play{width:54px; height:54px; border-radius:50%; background:rgba(255,255,255,.2); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); display:grid; place-items:center; border:1px solid rgba(255,255,255,.4)}
.film-tag .play svg{width:16px; height:16px; fill:#fff; margin-left:2px}
.film-badge{position:absolute; right:22px; top:22px; z-index:2; background:#fff; color:var(--navy); font-weight:700; font-size:13px; padding:9px 16px; border-radius:999px; letter-spacing:.02em}
.film.has-video .film-tag .play,.film.has-video img{display:none}
.stats{display:grid; grid-template-columns:repeat(4,1fr); margin-top:clamp(36px,5vw,60px); border-top:1px solid var(--line)}
.stat{padding:30px 24px 0 0}
.stat + .stat{padding-left:28px; border-left:1px solid var(--line)}
.stat b{display:block; font-size:clamp(34px,4vw,52px); letter-spacing:-.04em; font-weight:800; line-height:1; color:var(--navy)}
.stat b em{font-style:normal; color:var(--orange)}
.stat span{display:block; margin-top:10px; font-size:15px; color:var(--muted); max-width:14em}

/* trust band */
.band{background:var(--deep); color:#fff; padding-block:22px}
.band-in{display:flex; gap:14px 44px; flex-wrap:wrap; justify-content:space-between; align-items:center}
.band-item{display:flex; align-items:center; gap:12px; font-size:15px; font-weight:600; color:rgba(255,255,255,.88)}
.band-item svg{width:20px; height:20px; color:var(--orange-hi); flex:none}

/* ===== doors / services ===== */
.doors-head{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,6vw,90px); align-items:center}
.doors-img{position:relative; border-radius:var(--r-xl); overflow:hidden; box-shadow:0 40px 80px -40px rgba(9,51,153,.5)}
.doors-img img{width:100%; aspect-ratio:1/1; object-fit:cover}
.doors-img::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(4,18,59,.78) 0%,rgba(4,18,59,.35) 32%,transparent 58%); pointer-events:none}
.door-cap{position:absolute; bottom:26px; z-index:2; color:#fff; font-weight:800; font-size:clamp(15px,1.7vw,19px); letter-spacing:-.01em; line-height:1.25; width:42%; text-shadow:0 2px 10px rgba(0,0,0,.35)}
.door-cap.left{left:7%}
.door-cap.right{right:7%; text-align:right}
.cards2{display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-top:clamp(50px,6vw,90px)}
.two-ways{display:flex; justify-content:center; align-items:center; gap:0; margin-top:clamp(36px,4.5vw,56px); list-style:none; flex-wrap:wrap}
.two-ways li{font-weight:600; font-size:clamp(18px,2vw,24px); letter-spacing:.01em; padding:0 clamp(20px,3vw,40px); position:relative}
.two-ways li.navy{color:var(--navy)}
.two-ways li.orange{color:var(--orange)}
.two-ways li:first-child::after{content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:60%; background:var(--line)}
@media (max-width:600px){ .two-ways{flex-direction:column; gap:14px} .two-ways li:first-child::after{display:none} .two-ways li{padding:0; text-align:center} }
.svc{position:relative; border-radius:var(--r-xl); overflow:hidden; background:var(--deep); color:#fff; min-height:640px; display:flex; flex-direction:column; justify-content:flex-end; isolation:isolate; text-decoration:none}
.svc > img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform 1.4s var(--ease)}
.svc:hover > img{transform:scale(1.05)}
.svc::before{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(4,18,59,0) 20%,rgba(4,18,59,.55) 55%,rgba(4,18,59,.94))}
.svc-body{padding:clamp(28px,3.2vw,46px)}
.svc-tag{display:inline-block; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; background:var(--orange); padding:8px 14px; border-radius:999px; margin-bottom:22px}
.svc-tag.blue{background:var(--navy-hi)}
.svc h3{font-size:clamp(34px,3.8vw,54px); color:#fff; letter-spacing:-.04em}
.svc .line{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:clamp(24px,2.3vw,32px); color:#FFC7B2; margin-top:10px; line-height:1.1}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 26px}
.chips li{font-size:14px; font-weight:600; padding:8px 14px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px)}
.svc .link-arrow{color:#fff}

/* ===== source / clear / employ ===== */
.trio{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:clamp(40px,5vw,64px)}
.tcard{position:relative; background:rgba(255,255,255,.06); border:1px solid var(--line-dark); border-radius:var(--r-lg); padding:clamp(26px,2.6vw,38px)}
.tcard .num{font-size:13px; font-weight:800; letter-spacing:.14em; color:#FF9C77}
.tcard h3{font-size:clamp(32px,3.4vw,46px); margin:16px 0 12px; color:#fff; letter-spacing:-.04em}
.tcard h3::after{content:"."; color:var(--orange)}
.tcard p{color:rgba(255,255,255,.78); font-size:16px}
.tcard .viz{margin-top:24px; display:flex; flex-wrap:wrap; gap:8px}
.pill{display:inline-flex; align-items:center; gap:9px; padding:9px 14px; border-radius:10px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.16); font-weight:600; font-size:14px; color:#fff}
.pill .dot{width:8px; height:8px; border-radius:50%; background:var(--orange)}
.pill .tick{width:18px; height:18px; border-radius:50%; background:var(--orange); display:grid; place-items:center}
.pill .tick svg{width:11px; height:11px; color:#fff}
.tcard::after{content:""; position:absolute; right:-17px; top:50%; width:14px; height:14px; border-top:2px solid var(--orange); border-right:2px solid var(--orange); transform:translateY(-50%) rotate(45deg)}
.tcard:last-child::after{display:none}
.lifecycle{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(30px,6vw,90px); align-items:center}
.lifecycle img{border-radius:var(--r-xl); width:100%; aspect-ratio:1/1; object-fit:cover; box-shadow:0 40px 80px -40px rgba(9,51,153,.45)}
.lc-list{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:34px}
.lc-list li{display:flex; align-items:center; gap:12px; font-weight:700; padding:16px 18px; background:var(--fog); border-radius:var(--r-md)}
.lc-list li span{width:34px; height:34px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-size:14px; flex:none}

/* ===== service lines ===== */
.svc-mini-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:clamp(40px,5vw,64px)}
.svc-mini{background:var(--fog); border-radius:var(--r-lg); padding:clamp(26px,3vw,32px); transition:transform .4s var(--ease), box-shadow .4s}
a.svc-mini{text-decoration:none; color:inherit; display:block}
a.svc-mini:hover{transform:translateY(-4px); box-shadow:0 24px 50px -30px rgba(9,51,153,.3)}
.svc-mini .ic{width:50px; height:50px; border-radius:50%; background:rgba(235,89,41,.12); color:var(--orange); display:grid; place-items:center; margin-bottom:18px}
.svc-mini .ic svg{width:23px; height:23px}
.svc-mini h4{font-size:18.5px; letter-spacing:-.02em; margin-bottom:8px}
.svc-mini p{color:var(--muted); font-size:15.5px; line-height:1.55}
.svc-mini .more{display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-weight:700; font-size:14px; color:var(--navy)}
.svc-mini .more svg{width:15px; height:15px}
.svc-mini .tags{display:flex; flex-direction:column; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid var(--line)}
.svc-mini .tags li{font-size:13.5px; font-weight:600; color:var(--navy); display:flex; align-items:center; gap:9px}
.svc-mini .tags li svg{width:16px; height:16px; flex:none; color:var(--orange)}

/* ---- hooks: editorial pull-quotes ---- */
.hooks{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; margin-top:32px; list-style:none}
.hooks.hooks-single{grid-template-columns:none; justify-content:center}
.hooks.hooks-single li{max-width:520px; width:100%}
.hooks li{position:relative; background:#fff; border:1px solid var(--line); border-radius:12px; padding:24px 26px 20px; text-align:center; font-weight:700; font-size:15.5px; letter-spacing:-.005em; line-height:1.4; color:var(--ink); box-shadow:0 14px 30px -20px rgba(9,51,153,.3)}
.hooks li::before{content:""; position:absolute; top:0; left:16px; right:16px; height:4px; border-radius:0 0 4px 4px; background:var(--orange)}
.hooks li:nth-child(2)::before{background:var(--navy)}
.hooks li:nth-child(3)::before{background:var(--orange)}
.hooks-end{margin-top:clamp(44px,5vw,64px)}
.hooks-plaque{grid-template-columns:1fr}
.hooks-plaque li{position:relative; max-width:none; width:100%; background:linear-gradient(160deg,#0B1F57,#061636); border:none; border-radius:10px; padding:30px clamp(40px,6vw,90px); box-shadow:0 30px 60px -25px rgba(6,22,54,.55); overflow:hidden}
.hooks-plaque li::before{content:none}
.hooks-plaque li::after{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--orange),#FFB69C,var(--orange))}
.hooks-plaque li{font-family:"Plus Jakarta Sans",sans-serif; font-style:normal; font-weight:500; color:#fff; letter-spacing:.015em; font-size:clamp(17px,1.7vw,21px); line-height:1.55; text-align:center}
.hooks-plaque li b{font-weight:700; color:var(--orange-hi)}
.hooks-plaque li > *{position:relative}
.hooks-plaque .bolt{position:absolute; width:9px; height:9px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#dfe6f5,#8d98b8 60%,#5c6684); box-shadow:0 1px 2px rgba(0,0,0,.5); z-index:2}
.hooks-plaque .bolt.tl{top:12px; left:14px}
.hooks-plaque .bolt.tr{top:12px; right:14px}
.hooks-plaque .bolt.bl{bottom:12px; left:14px}
.hooks-plaque .bolt.br{bottom:12px; right:14px}
@media (max-width:600px){ .hooks-plaque li{padding:28px 30px}}
@media (max-width:980px){ .hooks{grid-template-columns:1fr 1fr} .hooks li:nth-child(3){grid-column:span 2; max-width:360px; margin:0 auto}}
@media (max-width:600px){ .hooks{grid-template-columns:1fr} .hooks li:nth-child(3){grid-column:auto; margin:0} }
@media (max-width:980px){ .svc-mini-grid{grid-template-columns:1fr 1fr} }
@media (max-width:600px){ .svc-mini-grid{grid-template-columns:1fr} }

/* ===== six -> one ===== */
.lift{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,6vw,96px); align-items:center}
.lift-photo{border-radius:var(--r-xl); overflow:hidden; box-shadow:0 40px 80px -40px rgba(9,51,153,.45); position:relative}
.lift-photo img{width:100%; aspect-ratio:4/5; object-fit:cover}
.toggle-row{display:flex; align-items:center; gap:14px 18px; flex-wrap:wrap; margin:30px 0 26px}
.toggle{display:inline-flex; padding:5px; background:var(--fog); border:1px solid var(--line); border-radius:999px; margin:0}
.toggle button{font:700 15px/1 "Plus Jakarta Sans",sans-serif; padding:14px 26px; border-radius:999px; border:0; background:transparent; color:var(--muted); cursor:pointer; transition:background .3s var(--ease), color .3s}
.toggle button[aria-pressed="true"]{background:var(--navy); color:#fff}
.toggle button.rr[aria-pressed="true"]{background:var(--orange)}
.chaos{position:relative; height:440px; background:var(--fog); border-radius:var(--r-xl); overflow:hidden; border:1px solid var(--line)}
.chaos svg{position:absolute; inset:0; width:100%; height:100%}
.chaos .l-chaos,.chaos .l-order{transition:opacity .7s var(--ease)}
.chaos .l-order{opacity:0}
.chaos.with .l-chaos{opacity:0}
.chaos.with .l-order{opacity:1}
.chip{position:absolute; width:36%; left:var(--x); top:var(--y); transform:rotate(var(--r)); padding:9px 12px; background:#fff; border:1px solid var(--line); border-radius:12px; font-size:12.5px; font-weight:700; color:var(--ink); box-shadow:0 10px 24px -14px rgba(9,51,153,.5); transition:left .9s var(--ease), top .9s var(--ease), transform .9s var(--ease), background .5s; white-space:nowrap}
.chip small{display:block; font-size:11px; font-weight:600; color:var(--orange); letter-spacing:.04em}
.chaos.with .chip{left:var(--hx); top:var(--hy); transform:none; background:var(--white)}
.you{position:absolute; right:4%; top:50%; transform:translateY(-50%); width:17%; min-width:100px; padding:16px 10px 14px; background:var(--ink); color:#fff; border-radius:20px; z-index:2; display:flex; flex-direction:column; align-items:center; gap:2px; text-align:center; box-shadow:0 18px 34px -16px rgba(11,19,48,.6); transition:box-shadow .6s var(--ease)}
.you svg{position:static; inset:auto; width:34px; height:34px; margin-bottom:2px}
.you b{font-size:27px; font-weight:800; letter-spacing:.01em; line-height:1}
.you small{font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.65); margin-top:5px}
.chaos.with .you{box-shadow:0 0 0 7px rgba(235,89,41,.20), 0 18px 34px -16px rgba(11,19,48,.6)}
.hub{position:absolute; left:54%; top:50%; transform:translate(-50%,-50%) scale(.6); opacity:0; transition:opacity .7s var(--ease) .15s, transform .8s var(--ease) .15s; background:#fff; padding:14px 20px; border-radius:20px; box-shadow:0 24px 50px -20px rgba(9,51,153,.55); border:1px solid var(--line); z-index:2}
.hub img{height:44px; width:auto}
.chaos.with .hub{opacity:1; transform:translate(-50%,-50%) scale(1)}
.compare{margin-top:26px; display:grid; gap:0}
.compare li{display:grid; grid-template-columns:32px 1fr; gap:14px; align-items:center; padding:15px 0; border-top:1px solid var(--line); font-weight:600; font-size:18px; letter-spacing:-.01em}
.compare li:last-child{border-bottom:1px solid var(--line)}
.compare .mk{width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:rgba(235,89,41,.13); color:var(--orange)}
.compare .mk svg{width:14px; height:14px}
.compare .a,.compare .b{grid-column:2; transition:opacity .4s, transform .4s var(--ease)}
.compare li{position:relative; min-height:62px}
.compare .a{color:var(--muted)}
.compare .b{position:absolute; left:46px; right:0; opacity:0; transform:translateY(10px); color:var(--navy)}
.compare.with .a{opacity:0; transform:translateY(-10px)}
.compare.with .b{opacity:1; transform:none}
.compare.with .mk{background:rgba(9,51,153,.12); color:var(--navy)}

/* ===== why R R E A ===== */
.why{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(30px,6vw,100px); align-items:start}
.why-photo{position:sticky; top:110px; border-radius:var(--r-xl); overflow:hidden; box-shadow:0 40px 80px -40px rgba(9,51,153,.45)}
.why-photo img{width:100%; aspect-ratio:3/4; object-fit:cover}
.rrea{margin-top:clamp(30px,4vw,56px)}
.rrea li{display:grid; grid-template-columns:clamp(70px,8vw,120px) 1fr; gap:clamp(16px,3vw,40px); align-items:center; padding:clamp(22px,3vw,38px) 0; border-top:1px solid var(--line); cursor:default; transition:padding .5s var(--ease)}
.rrea li:last-child{border-bottom:1px solid var(--line)}
.rrea .big{font-size:clamp(64px,8vw,112px); font-weight:800; letter-spacing:-.06em; line-height:.8; color:var(--orange); transition:color .4s, transform .5s var(--ease)}
.rrea li:nth-child(even) .big{color:var(--navy)}
.rrea li:hover .big{transform:translateX(8px) scale(1.03)}
.rrea h3{font-size:clamp(26px,3vw,40px); letter-spacing:-.035em; margin-bottom:10px}
.rrea p{color:var(--muted); font-size:17px; max-width:30em}

/* ===== roles bento ===== */
.bento{display:grid; grid-template-columns:repeat(12,1fr); grid-auto-rows:clamp(150px,17vw,250px); gap:16px; margin-top:clamp(40px,5vw,70px)}
.tile{position:relative; border-radius:var(--r-lg); overflow:hidden; background:var(--deep); isolation:isolate; color:#fff}
.tile img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform 1.2s var(--ease)}
.tile:hover img{transform:scale(1.06)}
.tile::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,transparent 45%,rgba(4,18,59,.85))}
.tile span{position:absolute; left:20px; bottom:18px; right:20px; font-weight:800; font-size:clamp(18px,1.7vw,24px); letter-spacing:-.03em; line-height:1.05}
.tile span small{display:block; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#FFB69C; margin-bottom:6px}
.t1{grid-column:span 4; grid-row:span 2}.t2{grid-column:span 4}.t3{grid-column:span 4; grid-row:span 2}
.t4{grid-column:span 4}.t5{grid-column:span 3}.t6{grid-column:span 3}.t7{grid-column:span 3}.t8{grid-column:span 3}
.more{margin-top:26px; display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.more .lab{font-weight:700; margin-right:8px}
.more li{padding:10px 18px; border-radius:999px; background:var(--fog); border:1px solid var(--line); font-weight:600; font-size:15px}
.more li.ask{background:var(--navy); color:#fff; border-color:var(--navy)}
.more li.ask a{text-decoration:none}

/* ===== routes ===== */
.routes{position:relative; margin-top:clamp(40px,5vw,70px); border-radius:var(--r-xl); background:var(--deeper); overflow:hidden; border:1px solid var(--line-dark)}
.routes svg{width:100%; height:auto; display:block}
.arc{fill:none; stroke:url(#arcg); stroke-width:2.2; stroke-dasharray:1200; stroke-dashoffset:1200; transition:stroke-dashoffset 2.4s var(--ease)}
.routes.in .arc{stroke-dashoffset:0}
.routes.in .arc:nth-of-type(2){transition-delay:.15s}.routes.in .arc:nth-of-type(3){transition-delay:.3s}.routes.in .arc:nth-of-type(4){transition-delay:.45s}.routes.in .arc:nth-of-type(5){transition-delay:.6s}
.rt-label{font:700 21px "Plus Jakarta Sans",sans-serif; fill:#fff; letter-spacing:-.02em}
.rt-sub{font:600 13px "Plus Jakarta Sans",sans-serif; fill:rgba(255,255,255,.55); letter-spacing:.1em; text-transform:uppercase}
.pulse{transform-box:fill-box; transform-origin:center; animation:pulse 2.6s ease-out infinite}
@keyframes pulse{0%{transform:scale(1); opacity:.6}100%{transform:scale(3.2); opacity:0}}
.routes-cap{position:absolute; left:clamp(20px,3vw,40px); bottom:clamp(18px,2.6vw,34px); color:#fff; max-width:22em}
.routes-cap h3{color:#fff; font-size:clamp(24px,3vw,40px)}
.routes-cap p{color:rgba(255,255,255,.7); margin-top:10px; font-size:16px}

/* ===== switch ===== */
.switch{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,6vw,100px); align-items:center}
.switch-photo{border-radius:var(--r-xl); overflow:hidden; position:relative}
.switch-photo img{width:100%; aspect-ratio:4/5; object-fit:cover}
.steps4{display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:44px; counter-reset:s}
.steps4 li{position:relative; padding-right:18px}
.steps4 li::before{counter-increment:s; content:counter(s); width:38px; height:38px; border-radius:50%; background:var(--orange); color:#fff; display:grid; place-items:center; font-weight:800; margin-bottom:34px; position:relative; z-index:1}
.steps4 li::after{content:""; position:absolute; top:19px; left:38px; right:0; height:2px; background:linear-gradient(90deg,var(--orange),rgba(255,255,255,.2))}
.steps4 li:last-child::after{display:none}
.steps4 h4{font-size:20px; letter-spacing:-.03em; margin-bottom:8px}
.steps4 p{font-size:15px; line-height:1.45}
.keeps{display:grid; gap:12px; margin-top:38px}
.keeps li{display:flex; gap:14px; align-items:flex-start; font-weight:600; font-size:17px; letter-spacing:-.01em; color:#fff}
.keeps li svg{width:24px; height:24px; color:var(--orange-hi); flex:none; margin-top:1px}
.switch .cta-row{margin-top:40px}

/* ===== careplan teaser ===== */
.cp-tease{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(30px,6vw,100px); align-items:center}
.cp-tease .photo{border-radius:var(--r-xl); overflow:hidden}
.cp-tease .photo img{width:100%; aspect-ratio:4/5; object-fit:cover}
.price{display:flex; align-items:flex-end; gap:16px; flex-wrap:wrap; margin:28px 0}
.price b{font-size:clamp(72px,9vw,120px); font-weight:800; letter-spacing:-.06em; line-height:.8; color:#fff}
.price b sup{font-size:.4em; vertical-align:top; position:relative; top:.15em; margin-right:4px; color:var(--orange-hi)}
.price span{font-size:18px; color:rgba(255,255,255,.8); padding-bottom:6px; line-height:1.3}
.price em{font-style:normal; display:block; font-weight:700; color:#FFB69C}

/* ===== proof ===== */
.quotes{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:clamp(40px,5vw,64px)}
.quote{background:var(--fog); border-radius:var(--r-lg); padding:34px; position:relative; display:flex; flex-direction:column; gap:26px}
.quote .tag{position:absolute; top:18px; right:18px; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); border:1px dashed var(--line); border-radius:999px; padding:5px 10px}
.quote q{font-size:clamp(19px,1.7vw,23px); font-weight:600; letter-spacing:-.02em; line-height:1.35; quotes:none}
.quote .who{display:flex; gap:14px; align-items:center}
.quote .av{width:44px; height:44px; border-radius:50%; background:var(--mist)}
.quote .who b{display:block; font-size:15px}
.quote .who span{font-size:13px; color:var(--muted)}

/* ===== contact ===== */
.contact{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,100px); align-items:start}
.details{display:grid; gap:22px; margin-top:34px}
.detail{display:flex; gap:16px; align-items:flex-start; text-decoration:none}
.detail .ic{width:46px; height:46px; border-radius:50%; background:var(--fog); color:var(--navy); display:grid; place-items:center; flex:none; border:1px solid var(--line)}
.detail .ic svg{width:20px; height:20px}
.detail small{display:block; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:4px}
.detail p,.detail a{font-size:18px; font-weight:600; letter-spacing:-.015em; color:var(--ink); text-decoration:none}
.mapbox{position:relative; margin-top:34px; border-radius:var(--r-lg); overflow:hidden; height:300px; background:var(--mist); border:1px solid var(--line)}
.mapbox iframe{position:absolute; inset:0; width:100%; height:100%; border:0; z-index:1}
.mapbox .fallback{position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:20px; background:
  linear-gradient(var(--line) 1px,transparent 1px) 0 0/34px 34px, linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/34px 34px, var(--mist)}
.mapbox .fallback b{display:block; font-size:18px; margin:8px 0 12px}
.form{background:var(--deep); color:#fff; border-radius:var(--r-xl); padding:clamp(28px,3.6vw,52px); position:sticky; top:104px}
.form h3{color:#fff; font-size:clamp(28px,3vw,40px); margin-bottom:8px}
.form > p{color:rgba(255,255,255,.75); font-size:16px; margin-bottom:26px}
.field{margin-bottom:16px}
.field label{display:block; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-bottom:8px}
.field input,.field select,.field textarea{width:100%; padding:16px 18px; border-radius:var(--r-sm); border:1px solid var(--line-dark); background:rgba(255,255,255,.07); color:#fff; font:500 16px "Plus Jakarta Sans",sans-serif}
.field select option{color:#0B1330}
.field input::placeholder,.field textarea::placeholder{color:rgba(255,255,255,.4)}
.field textarea{min-height:96px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--orange); outline-offset:1px}
.form .btn{width:100%; margin-top:8px; background:var(--wa); box-shadow:0 14px 34px -14px rgba(31,168,85,.7)}
.form .btn:hover{background:#25BD63}
.form small{display:block; text-align:center; margin-top:14px; color:rgba(255,255,255,.6); font-size:13px}

/* ===== footer ===== */
footer{background:var(--deeper); color:#fff; padding-block:clamp(60px,7vw,96px) 30px}
.foot{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:46px; border-bottom:1px solid var(--line-dark)}
.foot .plate{background:#fff; display:inline-block; padding:12px 18px; border-radius:14px}
.foot .plate img{height:46px}
.foot p{color:rgba(255,255,255,.62); font-size:15px; margin-top:18px; max-width:30em}
.foot h5{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#FFB69C; margin:0 0 16px}
.foot li{margin-bottom:11px}
.foot a{color:rgba(255,255,255,.82); text-decoration:none; font-size:15px}
.foot a:hover{color:#fff}
.legal{padding-top:26px; font-size:12.5px; line-height:1.65; color:rgba(255,255,255,.42); max-width:1000px}
.legal b{color:rgba(255,255,255,.7); font-weight:600}

/* ===== floating whatsapp ===== */
.wa-fab{position:fixed; right:clamp(16px,2.4vw,32px); bottom:clamp(16px,2.4vw,30px); z-index:90; display:flex; align-items:center; gap:12px; background:var(--wa); color:#fff; text-decoration:none; padding:15px 24px 15px 18px; border-radius:999px; font-weight:800; font-size:15px; letter-spacing:-.01em; box-shadow:0 20px 44px -12px rgba(31,168,85,.7); transition:transform .35s var(--ease)}
.wa-fab:hover{transform:translateY(-3px) scale(1.02)}
.wa-fab svg{width:26px; height:26px}
.wa-fab::before{content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:0 0 0 0 rgba(31,168,85,.55); animation:ping 2.6s infinite}

/* ===== careplan page ===== */
.cp-hero{padding-top:clamp(40px,6vw,90px); padding-bottom:clamp(60px,8vw,120px); background:var(--deep); color:#fff; overflow:hidden}
.cp-hero-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,6vw,90px); align-items:center}
.cp-mark{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:700; font-size:clamp(28px,3vw,40px); color:#FFB69C; margin-bottom:14px; display:block}
.cp-hero h1{font-size:clamp(44px,6.4vw,88px); letter-spacing:-.04em; line-height:.98; color:#fff}
.cp-hero .photo{border-radius:var(--r-xl); overflow:hidden; box-shadow:0 50px 90px -40px rgba(0,0,0,.6); position:relative}
.cp-hero .photo img{width:100%; aspect-ratio:4/5; object-fit:cover}
.due{position:relative; margin-top:clamp(40px,5vw,70px); padding:clamp(28px,3vw,48px); background:var(--fog); border-radius:var(--r-xl); overflow:hidden}
.due-line{position:relative; display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:44px}
.due-line::before{content:""; position:absolute; left:0; right:0; top:22px; height:3px; background:var(--mist); border-radius:3px}
.due-line::after{content:""; position:absolute; left:0; top:22px; height:3px; width:0; background:var(--orange); border-radius:3px; transition:width 2.6s var(--ease)}
.due.in .due-line::after{width:100%}
.due-item{position:relative; text-align:center; padding-top:0}
.due-item i{display:grid; place-items:center; width:46px; height:46px; margin:0 auto 18px; border-radius:50%; background:#fff; border:3px solid var(--mist); color:var(--muted); position:relative; z-index:1; transition:border-color .4s, color .4s, transform .5s var(--ease)}
.due.in .due-item i{border-color:var(--orange); color:var(--orange); transform:scale(1.05)}
.due.in .due-item:nth-child(1) i{transition-delay:.2s}.due.in .due-item:nth-child(2) i{transition-delay:.6s}.due.in .due-item:nth-child(3) i{transition-delay:1s}.due.in .due-item:nth-child(4) i{transition-delay:1.4s}.due.in .due-item:nth-child(5) i{transition-delay:1.8s}.due.in .due-item:nth-child(6) i{transition-delay:2.2s}
.due-item svg{width:20px; height:20px}
.due-item b{display:block; font-size:16px; letter-spacing:-.02em; line-height:1.15}
.due-item span{display:block; font-size:13px; color:var(--muted); margin-top:6px}
.how3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:clamp(40px,5vw,64px)}
.how{background:var(--fog); border-radius:var(--r-xl); padding:clamp(28px,3vw,44px); min-height:300px; display:flex; flex-direction:column; justify-content:space-between}
.how .n{font-size:14px; font-weight:800; letter-spacing:.14em; color:var(--orange)}
.how h3{font-size:clamp(28px,3vw,40px); margin:20px 0 12px}
.how p{color:var(--muted); font-size:16px}
.channels{display:flex; flex-wrap:wrap; gap:10px; margin-top:22px}
.channels li{display:flex; align-items:center; gap:9px; padding:10px 16px; border-radius:999px; background:#fff; border:1px solid var(--line); font-weight:700; font-size:14px}
.channels svg{width:17px; height:17px; color:var(--navy)}
.calc{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,6vw,90px); align-items:center}
.calc-card{background:var(--deep); color:#fff; border-radius:var(--r-xl); padding:clamp(30px,3.6vw,56px)}
.calc-card label{font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.7)}
.calc-num{display:flex; align-items:baseline; gap:14px; margin:12px 0 4px}
.calc-num b{font-size:clamp(64px,8vw,96px); font-weight:800; letter-spacing:-.06em; line-height:.9}
.calc-num span{font-size:18px; color:rgba(255,255,255,.75)}
.calc-card input[type=range]{width:100%; margin:22px 0 30px; accent-color:var(--orange); height:6px}
.calc-out{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.calc-out div{background:rgba(255,255,255,.08); border:1px solid var(--line-dark); border-radius:var(--r-md); padding:18px 20px}
.calc-out small{display:block; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:6px}
.calc-out b{font-size:clamp(28px,3vw,40px); letter-spacing:-.04em}
.fine3{display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:clamp(40px,5vw,64px); border-top:1px solid var(--line)}
.fine3 > div{padding:30px 34px 0 0}
.fine3 > div + div{padding-left:34px; border-left:1px solid var(--line)}
.fine3 h4{font-size:22px; letter-spacing:-.03em; margin-bottom:12px}
.fine3 p{font-size:15.5px; color:var(--muted)}
.fine3 li{font-size:15.5px; color:var(--muted); padding:8px 0 8px 22px; position:relative}
.fine3 li::before{content:""; position:absolute; left:0; top:17px; width:8px; height:8px; border-radius:50%; background:var(--orange)}

/* ===== responsive ===== */
@media (max-width:1100px){
  .nav-links{display:none} .menu-btn{display:flex}
}
@media (max-width:980px){
  .stats{grid-template-columns:1fr 1fr} .stat:nth-child(3){padding-left:0; border-left:0} .stat:nth-child(n+3){margin-top:26px}
  .doors-head,.cards2,.lifecycle,.lift,.why,.switch,.cp-tease,.contact,.cp-hero-grid,.calc,.how3,.quotes,.fine3{grid-template-columns:1fr}
  .why-photo{position:relative; top:0}
  .why-photo img{aspect-ratio:3/4}
  .form{position:relative; top:0}
  .svc{min-height:560px}
  .trio{grid-template-columns:1fr} .tcard::after{display:none}
  .steps4{grid-template-columns:1fr 1fr; gap:34px 20px}
  .steps4 li::after{display:none}
  .bento{grid-template-columns:repeat(6,1fr); grid-auto-rows:170px}
  .t1,.t3{grid-column:span 3; grid-row:span 2}.t2,.t4{grid-column:span 3}.t5,.t6,.t7,.t8{grid-column:span 3}
  .foot{grid-template-columns:1fr 1fr}
  .fine3 > div,.fine3 > div + div{padding:26px 0 0; border-left:0}
  .due-line{grid-template-columns:1fr 1fr 1fr; row-gap:34px} .due-line::before,.due-line::after{display:none}
  .film{aspect-ratio:16/10}
  .film-badge{display:none}
}
@media (max-width:600px){
  .stats{grid-template-columns:1fr 1fr}
  .band-in{justify-content:flex-start}
  .foot{grid-template-columns:1fr}
  .steps4{grid-template-columns:1fr}
  .lc-list{grid-template-columns:1fr}
  .chaos{height:520px}
  .calc-out{grid-template-columns:1fr}
  .wa-fab span{display:none} .wa-fab{padding:16px}
  .bento{grid-auto-rows:150px}
  .hero-row .cta-row .btn{width:100%}
}

.price.light b{color:var(--navy)} .price.light b sup{color:var(--orange)}
.price.light span{color:var(--muted)} .price.light em{color:var(--orange)}
@keyframes priceBlink{0%,100%{opacity:1}50%{opacity:.25}}
.price b.blink{animation:priceBlink 1.6s ease-in-out infinite}
.svc,.svc:hover{color:#fff}
.hero-row .cta-row{flex-wrap:wrap}
.sec-deep .lead,.sec-deep p{color:rgba(255,255,255,.78)}
.sec-deep .tcard p{color:rgba(255,255,255,.78)}
.sec-deep .keeps li{color:#fff}
.routes-cap p{color:rgba(255,255,255,.7)}
@media (max-width:600px){
  .hub{left:auto; right:3%; top:30%; transform:none; padding:8px 10px} .hub img{height:34px} .chaos.with .hub{transform:none} .you{top:76%; right:3%; width:96px; padding:12px 8px 11px} .you svg{width:26px;height:26px} .you b{font-size:22px} .you small{font-size:9.5px}
  .chaos > svg{display:none}
  .chip{font-size:12px; padding:8px 11px}
  .chaos:not(.with) .chip{left:calc(var(--x)*.6); }
  .routes-cap{position:relative; left:auto; top:auto; padding:22px 22px 0}
}

@media (max-width:600px){.chip{white-space:normal; width:58%}}

.compare .mk .ck{display:none}.compare.with .mk .x{display:none}.compare.with .mk .ck{display:grid}
.compare .mk span{display:grid;place-items:center}

.wa-fab{transition:transform .35s var(--ease), opacity .3s} .wa-fab.hide{opacity:0; pointer-events:none; transform:translateY(12px)}

.film video{opacity:0; transition:opacity .6s}
.film.has-video video{opacity:1}
.film.has-video .film-tag,.film.has-video .film-badge,.film.has-video::after{display:none}


.toggle button{position:relative; overflow:hidden}
.toggle.auto button[aria-pressed="true"]::after{content:""; position:absolute; left:0; bottom:0; height:3px; width:100%; background:rgba(255,255,255,.75); transform-origin:left; animation:loopfill var(--loop,4.3s) linear forwards}
@keyframes loopfill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* sales hook that answers the animation */
.hook{position:relative; flex:1 1 230px; min-height:28px; margin:0; font-size:18px; font-weight:600; letter-spacing:-.015em; line-height:1.3}
.hook span{display:block; transition:opacity .5s var(--ease), transform .5s var(--ease)}
.hook .a{color:var(--muted)} .hook .a b{color:var(--orange-lo); font-weight:800}
.hook .b{position:absolute; left:0; top:0; opacity:0; transform:translateY(8px); color:var(--ink)} .hook .b b{color:var(--navy); font-weight:800}
.hook.with .a{opacity:0; transform:translateY(-8px)} .hook.with .b{opacity:1; transform:none}


@media (max-width:600px){.you{width:96px; min-width:0} .you svg{width:26px;height:26px}}