/* =========================================================================
   YUVAU — GROWTH STRATEGY PAGE ONLY
   ========================================================================= */

.yv-solution-content{
  width:100%;
  padding:0;
}

.yv-solution-content > .yv-gs{
  width:min(1240px, calc(100% - 48px));
  max-width:1240px;
  margin:0 auto;
  padding:0;
  /* Local theme tokens — every colour below resolves through one of these so the
     dark block at the end of this file can re-point them. */
  --gs-ink:#081A35;
  --gs-muted:#60728D;
  --gs-accent:#1457D9;
  --gs-line:rgba(21,87,232,.12);
  --gs-line-soft:rgba(21,87,232,.10);
  --gs-panel:rgba(255,255,255,.52);
  --gs-panel-soft:rgba(255,255,255,.44);
  --gs-panel-faint:rgba(255,255,255,.32);
  --gs-glass-border:rgba(255,255,255,.82);
  --gs-glass-bg:linear-gradient(135deg,rgba(255,255,255,.80),rgba(237,246,255,.46) 56%,rgba(251,237,255,.32));
  --gs-glass-shadow:0 24px 65px rgba(28,83,157,.10), inset 0 1px rgba(255,255,255,.96);
  --gs-rail:rgba(21,87,232,.13);
  --gs-rail-2:rgba(232,60,240,.10);
  --gs-node:#1557E8;
  color:var(--gs-ink);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.yv-gs,
.yv-gs *{box-sizing:border-box}

.yv-gs h1,
.yv-gs h2,
.yv-gs h3,
.yv-gs p{margin-top:0}

.yv-gs__glass{
  border:1px solid var(--gs-glass-border);
  border-radius:26px;
  background:var(--gs-glass-bg);
  box-shadow:var(--gs-glass-shadow);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  backdrop-filter:blur(22px) saturate(150%);
}

.yv-gs__hero{
  padding:38px 0 72px;
}

.yv-gs__hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:24px;
  align-items:stretch;
}

.yv-gs__hero-copy{
  min-height:620px;
  padding:52px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.yv-gs__eyebrow,
.yv-gs__kicker{
  color:var(--gs-accent);
  font-size:10px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:2.2px;
  font-weight:900;
}

.yv-gs__hero-title{
  margin:14px 0 22px;
  max-width:700px;
  font-size:clamp(60px, 6.2vw, 92px) !important;
  line-height:.90 !important;
  letter-spacing:-.062em !important;
  font-weight:900 !important;
}

.yv-gs__gradient{
  display:inline !important;
  background-image:linear-gradient(96deg,#1557E8 0%,#4F91FF 48%,#E83CF0 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}

.yv-gs__hero-lead{
  max-width:610px;
  color:var(--gs-muted);
  font-size:17px;
  line-height:1.72;
}

.yv-gs__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:28px;
}

.yv-gs__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:13px 17px;
  border-radius:12px;
  border:1px solid var(--gs-line);
  font-size:12px;
  font-weight:900;
}

.yv-gs__btn--primary{
  color:#fff !important;
  background:linear-gradient(105deg,#1557E8,#4F91FF 60%,#E83CF0);
  box-shadow:0 14px 30px rgba(21,87,232,.18);
}

.yv-gs__btn--secondary{
  color:var(--gs-ink) !important;
  background:var(--gs-panel);
}

.yv-gs__hero-visual{
  min-height:620px;
  padding:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.yv-gs__orbit{
  width:min(560px,100%);
  aspect-ratio:1;
  position:relative;
  display:block;
}

.yv-gs__orbit svg{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  overflow:visible;
}

.yv-gs__orbit-ring{
  animation:yvGsRing 5s ease-in-out infinite;
  transform-origin:50% 50%;
}

.yv-gs__orbit-ring--outer{
  stroke:var(--gs-rail);
  stroke-width:1;
}

.yv-gs__orbit-ring--inner{
  stroke:var(--gs-rail-2);
  stroke-width:1;
}

.yv-gs__route-soft{
  fill:none;
  stroke:var(--gs-line-soft);
  stroke-width:18;
  filter:url(#yvGsBlurClean);
}

.yv-gs__route{
  fill:none;
  stroke:url(#yvGsRouteClean);
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:9 11;
  animation:yvGsDash 7s linear infinite;
}

.yv-gs__node{
  transform-box:fill-box;
  transform-origin:center;
  animation:yvGsNode 3.6s ease-in-out infinite;
  animation-delay:var(--node-delay,0s);
}

.yv-gs__core{
  transform-origin:center;
  animation:yvGsCore 5s ease-in-out infinite;
}

.yv-gs__label{
  fill:var(--gs-ink);
  font-size:15px;
  font-weight:900;
  font-family:Inter, ui-sans-serif, system-ui, sans-serif;
}

.yv-gs__small{
  fill:var(--gs-muted);
  font-size:9px;
  font-weight:800;
  font-family:Inter, ui-sans-serif, system-ui, sans-serif;
  letter-spacing:.10em;
}

.yv-gs__arrow{
  opacity:1;
}

.yv-gs__section{
  padding:88px 0;
  border-top:1px solid var(--gs-line);
}

.yv-gs__section-title{
  max-width:1000px;
  margin:12px 0 20px;
  font-size:clamp(50px,5.2vw,78px) !important;
  line-height:.98 !important;
  letter-spacing:-.055em !important;
  font-weight:880 !important;
}

.yv-gs__section-lead{
  max-width:790px;
  color:var(--gs-muted);
  font-size:16px;
  line-height:1.75;
}

.yv-gs__two{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:30px;
}

.yv-gs__card{
  padding:30px;
}

.yv-gs__card h3{
  margin:0 0 10px;
  font-size:25px;
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:850;
}

.yv-gs__card p{
  margin:0;
  color:var(--gs-muted);
  font-size:14px;
  line-height:1.72;
}

.yv-gs__tagrow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.yv-gs__tag{
  padding:7px 11px;
  border-radius:999px;
  border:1px solid var(--gs-line-soft);
  background:var(--gs-panel);
  color:var(--gs-muted);
  font-size:10px;
  font-weight:850;
}

.yv-gs__framework{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:18px;
  margin-top:30px;
}

.yv-gs__framework-main{
  padding:34px;
}

.yv-gs__framework-main h3{
  margin:12px 0 14px;
  font-size:38px;
  line-height:1.04;
  letter-spacing:-.045em;
  font-weight:880;
}

.yv-gs__framework-main p{
  margin:0;
  color:var(--gs-muted);
  font-size:15px;
  line-height:1.72;
}

.yv-gs__framework-side{
  display:grid;
  gap:14px;
}

.yv-gs__mini{
  padding:24px;
}

.yv-gs__mini strong{
  display:block;
  margin-bottom:7px;
  font-size:19px;
  font-weight:850;
}

.yv-gs__mini p{
  margin:0;
  color:var(--gs-muted);
  font-size:13px;
  line-height:1.62;
}

.yv-gs__journey{
  position:relative;
  margin-top:36px;
  padding:32px 26px 34px;
}

.yv-gs__journey-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  position:relative;
  z-index:2;
}

.yv-gs__step{
  min-height:230px;
  padding:25px;
  border-radius:20px;
  border:1px solid var(--gs-line);
  background:var(--gs-panel-soft);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}

.yv-gs__step-num{
  color:#E83CF0;
  font-size:13px;
  font-weight:900;
}

.yv-gs__step h3{
  margin:34px 0 10px;
  font-size:25px;
  letter-spacing:-.04em;
}

.yv-gs__step p{
  margin:0;
  color:var(--gs-muted);
  font-size:13px;
  line-height:1.65;
}

.yv-gs__journey-line{
  position:absolute;
  left:12%;
  right:12%;
  top:50%;
  height:2px;
  background:linear-gradient(90deg,#1557E8,#E83CF0);
  opacity:.28;
}

.yv-gs__journey-line:after{
  content:"";
  position:absolute;
  top:50%;
  left:0;
  width:12px;
  height:12px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:var(--gs-node);
  box-shadow:0 0 0 6px rgba(21,87,232,.08);
  animation:yvGsJourney 4.6s linear infinite;
}

.yv-gs__method{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:30px;
  border-top:1px solid var(--gs-line);
  border-left:1px solid var(--gs-line);
}

.yv-gs__method-item{
  min-height:250px;
  padding:25px;
  border-right:1px solid var(--gs-line);
  border-bottom:1px solid var(--gs-line);
  background:var(--gs-panel-faint);
}

.yv-gs__method-item:nth-child(2){transform:translateY(-8px)}
.yv-gs__method-item:nth-child(4){transform:translateY(8px)}

.yv-gs__method-num{
  font-size:46px;
  line-height:1;
  letter-spacing:-.06em;
  font-weight:900;
  background:linear-gradient(90deg,#1557E8,#E83CF0);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}

.yv-gs__method-item h3{
  margin:38px 0 10px;
  font-size:21px;
  font-weight:850;
}

.yv-gs__method-item p{
  margin:0;
  color:var(--gs-muted);
  font-size:13px;
  line-height:1.62;
}

.yv-gs__cta{
  padding:36px;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:22px;
  align-items:end;
}

.yv-gs__cta h2{
  margin:0;
  max-width:720px;
  font-size:clamp(44px,5vw,66px);
  line-height:.98;
  letter-spacing:-.052em;
  font-weight:880;
}

.yv-gs__cta p{
  margin:0;
  color:var(--gs-muted);
  font-size:14px;
  line-height:1.7;
}

@keyframes yvGsDash{to{stroke-dashoffset:-160}}
@keyframes yvGsRing{0%,100%{transform:scale(.985);opacity:.68}50%{transform:scale(1.015);opacity:1}}
@keyframes yvGsNode{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes yvGsCore{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
@keyframes yvGsJourney{0%{left:0}100%{left:100%}}

@media(max-width:900px){
  .yv-solution-content > .yv-gs{width:min(100%,calc(100% - 32px))}
  .yv-gs__hero-grid,
  .yv-gs__framework,
  .yv-gs__cta{grid-template-columns:1fr}
  .yv-gs__hero-copy,
  .yv-gs__hero-visual{min-height:auto}
  .yv-gs__hero-copy{padding:34px}
  .yv-gs__hero-visual{min-height:520px;padding:16px}
  .yv-gs__journey-grid{grid-template-columns:1fr}
  .yv-gs__journey-line{
    left:24px;right:auto;top:10%;bottom:10%;
    width:2px;height:auto;
  }
  .yv-gs__journey-line:after{
    animation:yvGsJourneyVertical 4.6s linear infinite;
  }
  .yv-gs__method{grid-template-columns:1fr 1fr}
  .yv-gs__method-item:nth-child(2),
  .yv-gs__method-item:nth-child(4){transform:none}
  @keyframes yvGsJourneyVertical{0%{top:0}100%{top:100%}}
}

@media(max-width:600px){
  .yv-solution-content > .yv-gs{width:calc(100% - 20px)}
  .yv-gs__hero{padding:18px 0 54px}
  .yv-gs__hero-copy{padding:24px}
  .yv-gs__hero-title{font-size:clamp(45px,13vw,62px) !important}
  .yv-gs__hero-lead{font-size:15px}
  .yv-gs__hero-visual{min-height:360px;padding:8px}
  .yv-gs__orbit{width:min(400px,100%)}
  .yv-gs__section{padding:62px 0}
  .yv-gs__section-title{font-size:clamp(40px,12vw,56px) !important}
  .yv-gs__two,
  .yv-gs__method{grid-template-columns:1fr}
  .yv-gs__card,
  .yv-gs__mini,
  .yv-gs__method-item,
  .yv-gs__cta{padding:22px}
  .yv-gs__journey{padding:24px 18px}
  .yv-gs__cta h2{font-size:clamp(42px,11vw,56px)}
}

@media(prefers-reduced-motion:reduce){
  .yv-gs__orbit-ring,
  .yv-gs__route,
  .yv-gs__node,
  .yv-gs__core,
  .yv-gs__journey-line:after{animation:none !important}
}


/* Fix A: on mobile the hero grid stacks and loses its centred min-height, so the
   heading must clear the fixed floating header. */
@media (max-width: 900px) {
  .yv-gs__hero { padding-top: 104px; }
}


/* =========================================================================
   DARK THEME — Growth Strategy
   Matches both hooks: <html data-theme="dark"> and <body class="dark-theme">.
   Only the local tokens above are re-pointed; no layout or markup changes.
   ========================================================================= */
:root[data-theme="dark"] .yv-solution-content > .yv-gs,
.dark-theme .yv-solution-content > .yv-gs{
  --gs-ink:#E7F0FF;
  --gs-muted:#AEBED4;
  --gs-accent:#7FA9FF;
  --gs-line:rgba(111,166,255,.16);
  --gs-line-soft:rgba(111,166,255,.12);
  --gs-panel:rgba(8,27,57,.52);
  --gs-panel-soft:rgba(8,27,57,.46);
  --gs-panel-faint:rgba(8,27,57,.38);
  --gs-glass-border:rgba(111,166,255,.16);
  --gs-glass-bg:linear-gradient(135deg,rgba(8,27,57,.58),rgba(8,27,57,.44));
  --gs-glass-shadow:0 24px 65px rgba(0,0,0,.45), inset 0 1px rgba(255,255,255,.06);
  --gs-rail:rgba(111,166,255,.22);
  --gs-rail-2:rgba(232,60,240,.18);
  --gs-node:#4F91FF;
}
:root[data-theme="dark"] .yv-gs__btn--secondary,
.dark-theme .yv-gs__btn--secondary{
  color:#E7F0FF !important;
  border-color:rgba(111,166,255,.16);
}