@charset "UTF-8";
/*
 * MEPOR Gradient CI v1.0.0
 * One shared visual layer for every public TH/EN renderer.
 * Content, routes, SEO, CMS data and component structure remain unchanged.
 */
:root{
  --mepor-red:#D61523;
  --mepor-coral:#EF4A45;
  --mepor-yellow:#F8DA02;
  --mepor-burgundy:#3B0710;
  --mepor-night:#12090B;
  --mepor-cream:#FFF8F1;
  --mepor-rose:#FFF1F1;
  --mepor-gradient-brand:linear-gradient(118deg,var(--mepor-red) 0%,var(--mepor-coral) 58%,var(--mepor-yellow) 132%);
  --mepor-gradient-hot:linear-gradient(112deg,var(--mepor-red) 0%,#F02D37 54%,#FF7A36 100%);
  --mepor-gradient-dark:linear-gradient(135deg,var(--mepor-night) 0%,var(--mepor-burgundy) 100%);
  --mepor-gradient-warm:linear-gradient(125deg,#FFF 0%,var(--mepor-rose) 55%,#FFF3C8 100%);
  --mepor-glow-red:rgba(214,21,35,.18);
  --mepor-glow-yellow:rgba(248,218,2,.22);
  --mepor-shadow:0 24px 64px rgba(59,7,16,.12);
  --mepor-shadow-hover:0 30px 74px rgba(59,7,16,.18);
}

/* Global surfaces and navigation */
.mepor-site{background:#fff;color:var(--ink,#121212)}
.mepor-site .topbar{background:rgba(255,255,255,.91);border-bottom-color:rgba(214,21,35,.1)}
.mepor-site .navlinks a:after{height:3px;border-radius:999px;background:var(--mepor-gradient-hot)}
.mepor-site .btn.primary,
.mepor-site button.primary,
.mepor-site input[type="submit"]{background:var(--mepor-gradient-hot);border-color:transparent;color:#fff;box-shadow:0 10px 24px rgba(214,21,35,.2)}
.mepor-site .btn.primary:hover,
.mepor-site button.primary:hover,
.mepor-site input[type="submit"]:hover{background:var(--mepor-gradient-hot);box-shadow:0 14px 30px rgba(214,21,35,.28);transform:translateY(-2px)}
.mepor-site .btn.secondary{background:rgba(255,255,255,.88);border-color:rgba(214,21,35,.22)}
.mepor-site .btn.secondary:hover{background:var(--mepor-rose);border-color:var(--mepor-red)}
.mepor-site .eyebrow,
.mepor-site .kicker,
.mepor-site .sr-kicker,
.mepor-site .breadcrumbs a{color:var(--mepor-red)}
.mepor-site .eyebrow:before{background:var(--mepor-gradient-hot)}

/* Warm hero language: glow fields, rings and restrained motion */
.mepor-site .hero,
.mepor-site .inner-hero,
.mepor-site .sr-hero,
.mepor-site .sr-service-hero-v2,
.mepor-site .solution-detail-hero,
.mepor-site .case-detail-hero,
.mepor-site .about-hub-hero,
.mepor-site .work-hub-hero,
.mepor-site .insights-hub-hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 18%,var(--mepor-glow-yellow),transparent 24rem),
    radial-gradient(circle at 66% 38%,var(--mepor-glow-red),transparent 27rem),
    var(--mepor-gradient-warm)!important;
}
.mepor-site .hero:before,
.mepor-site .inner-hero:after{
  border-color:rgba(214,21,35,.18);
  box-shadow:0 0 0 44px rgba(239,74,69,.045),0 0 0 90px rgba(248,218,2,.035)
}
.mepor-site .hero:after{border-color:rgba(239,74,69,.23)}
.mepor-site .display .red,
.mepor-site .red{
  color:var(--mepor-red);
  background:var(--mepor-gradient-hot);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent
}

/* Reusable cards: light, numbered and tactile like the shared CI */
.mepor-site :where(.cap-card,.step,.project,.service-card,.solution-card,.insight-card,.sr-card,.sr-service-problem-grid-v2 article,.sr-service-deliverable-grid-v2 article,.solution-detail-challenge-grid article,.solution-detail-outcome-grid article,.case-detail-deliverable-grid article,.case-detail-insight-grid>a,.sr-article-more-grid>a,.about-principle-grid article){
  border-color:rgba(214,21,35,.11);
  box-shadow:0 14px 36px rgba(59,7,16,.055);
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease
}
.mepor-site :where(.cap-card,.step,.service-card,.solution-card,.insight-card,.sr-card,.sr-service-problem-grid-v2 article,.sr-service-deliverable-grid-v2 article,.solution-detail-challenge-grid article,.solution-detail-outcome-grid article,.case-detail-deliverable-grid article,.case-detail-insight-grid>a,.sr-article-more-grid>a,.about-principle-grid article):hover{
  transform:translateY(-5px);
  border-color:rgba(214,21,35,.25);
  box-shadow:var(--mepor-shadow-hover)
}
.mepor-site .cap-card:not(.dark),
.mepor-site .step,
.mepor-site .sr-service-deliverable-grid-v2 article,
.mepor-site .solution-detail-challenge-grid article,
.mepor-site .case-detail-insight-grid>a{
  background:linear-gradient(145deg,#fff 0%,#fff8f7 62%,#fff6d8 140%)
}
.mepor-site :where(.index,.num,.n,article>small){color:var(--mepor-red)}

/* Dark strategy bands */
.mepor-site :where(.motion,.solution-detail-stack,.case-detail-blueprint,.sr-service-signal-card,.about-story,.work-hub-proof){
  background:var(--mepor-gradient-dark)!important
}
.mepor-site .motion:before,
.mepor-site .solution-detail-stack:before{
  background-image:
    radial-gradient(circle at 82% 18%,rgba(239,74,69,.35),transparent 24rem),
    radial-gradient(circle at 12% 88%,rgba(248,218,2,.1),transparent 19rem),
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px)!important;
  background-size:auto,auto,42px 42px,42px 42px!important
}
.mepor-site .canvas-shell{background:var(--mepor-gradient-dark);box-shadow:0 36px 90px rgba(59,7,16,.28)}
.mepor-site .map-card{background:rgba(28,9,13,.9);border-color:rgba(239,74,69,.24)}
.mepor-site .link,
.mepor-site .about-line,
.mepor-site .solution-detail-map>i{background:linear-gradient(90deg,transparent,var(--mepor-coral),var(--mepor-yellow),transparent)}

/* Strong campaign bands and CTAs */
.mepor-site :where(.cta,.sr-cta,.sr-service-cta-v2,.case-detail-cta,.case-detail-connections,.about-final-cta,.solution-detail-cta,.ps-cta){
  position:relative;
  overflow:hidden;
  background:var(--mepor-gradient-hot)!important;
  color:#fff
}
.mepor-site :where(.cta,.sr-cta,.sr-service-cta-v2,.case-detail-cta,.case-detail-connections,.about-final-cta,.solution-detail-cta,.ps-cta):before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 88% 22%,rgba(255,255,255,.2),transparent 18rem),
    repeating-radial-gradient(ellipse at 108% 110%,transparent 0 34px,rgba(255,255,255,.1) 35px 36px,transparent 37px 66px)
}
.mepor-site :where(.cta,.sr-cta,.sr-service-cta-v2,.case-detail-cta,.about-final-cta,.solution-detail-cta,.ps-cta)>*{position:relative;z-index:1}
.mepor-site :where(.sr-cta-button,.sr-service-cta-primary,.case-detail-cta-primary,.solution-detail-cta-primary){background:#fff;color:var(--mepor-red);box-shadow:0 14px 34px rgba(59,7,16,.15)}

/* Warm supporting sections */
.mepor-site :where(.outcome-section,.process,.audience,.sr-service-deliverables-v2,.case-detail-visual-stage,.mepor-faq-section){
  background:
    radial-gradient(circle at 94% 8%,rgba(248,218,2,.12),transparent 20rem),
    linear-gradient(145deg,var(--mepor-cream),#fff)!important
}
.mepor-site .ribbon{border-color:rgba(214,21,35,.1);background:linear-gradient(90deg,#fff,var(--mepor-rose),#fff9d8)}
.mepor-site .ribbon-item,.mepor-site .ribbon-intro{border-color:rgba(214,21,35,.1)}
.mepor-site .mepor-faq-list details[open],
.mepor-site details[open]{border-color:rgba(214,21,35,.25)}

/* Media and UI accents */
.mepor-site :where(.floating-stat,.project-meta,.about-system-node,.sr-article-hero-note){box-shadow:var(--mepor-shadow)}
.mepor-site :where(.sr-service-deliverable-icon,.solution-detail-stack-icon,.about-system-core){background:var(--mepor-gradient-hot)}
.mepor-site :where(.project,.sr-hero-media,.case-detail-visual-stage figure,.sr-article-cover-v2 figure) img{transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.mepor-site :where(.project,.sr-hero-media,.case-detail-visual-stage figure,.sr-article-cover-v2 figure):hover img{transform:scale(1.025)}

/* Footer follows the shared dark CI without reducing legibility */
.mepor-site footer{
  position:relative;
  background:
    radial-gradient(circle at 84% 12%,rgba(214,21,35,.2),transparent 23rem),
    var(--mepor-gradient-dark);
  color:#f7f1f2
}
.mepor-site footer:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 64%,rgba(248,218,2,.035))}
.mepor-site footer .wrap{position:relative}

/* Motion stays decorative, subtle and accessible */
@media (prefers-reduced-motion:no-preference){
  .mepor-site.ux-motion-on .hero:before{animation:mepor-orbit 12s ease-in-out infinite alternate}
  .mepor-site.ux-motion-on .floating-stat{animation:mepor-float 5s ease-in-out infinite}
  @keyframes mepor-orbit{to{transform:translate3d(-18px,18px,0) rotate(4deg)}}
  @keyframes mepor-float{50%{transform:translateY(-7px)}}
}
@media (prefers-reduced-motion:reduce){
  .mepor-site *,
  .mepor-site *:before,
  .mepor-site *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media (max-width:760px){
  .mepor-site .hero,
  .mepor-site .inner-hero,
  .mepor-site .sr-hero,
  .mepor-site .sr-service-hero-v2,
  .mepor-site .solution-detail-hero,
  .mepor-site .case-detail-hero,
  .mepor-site .about-hub-hero{background:radial-gradient(circle at 100% 4%,rgba(248,218,2,.2),transparent 15rem),linear-gradient(145deg,#fff,var(--mepor-rose))!important}
  .mepor-site .topbar{backdrop-filter:blur(12px)}
  .mepor-site :where(.cap-card,.step,.project,.service-card,.solution-card,.insight-card,.sr-card):hover{transform:none}
}