
:root{
  --blue:#0B4F8C; --dark:#072B4D; --petrol:#0E7C86; --ink:#17212B;
  --muted:#5D6B78; --soft:#F3F8FB; --line:#DCE8F1; --white:#fff;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",Arial,sans-serif;color:var(--ink);line-height:1.58;background:white}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:18px clamp(22px,5vw,76px);background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.logo{font-weight:900;text-decoration:none;color:var(--blue);letter-spacing:.02em}
.main-nav{display:flex;gap:26px}
.main-nav a{text-decoration:none;color:var(--muted);font-weight:650}
.main-nav a:hover{color:var(--blue)}
.menu-toggle{display:none;border:0;background:transparent;font-size:28px}
.hero{display:grid;grid-template-columns:minmax(0,1.35fr) 320px;gap:clamp(28px,5vw,70px);align-items:center;padding:54px clamp(22px,5vw,76px) 34px;background:radial-gradient(circle at 85% 10%,rgba(14,124,134,.19),transparent 30%),linear-gradient(135deg,#fff,#eef6fb)}
.eyebrow{margin:0 0 14px;color:var(--petrol);font-weight:900;letter-spacing:.09em;text-transform:uppercase;font-size:13px}
h1{margin:0;color:var(--dark);font-size:clamp(44px,6.6vw,82px);line-height:.96;letter-spacing:-.055em}
.lead{font-size:clamp(19px,2vw,24px);color:#273b4f;max-width:850px;margin:30px 0 0}
.sublead{font-size:17px;color:var(--muted);max-width:820px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:999px;padding:13px 22px;font-weight:850}
.primary{background:var(--blue);color:white}.secondary{background:white;border:1px solid var(--line);color:var(--blue)}
.portrait-card{background:white;border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:0 22px 62px rgba(7,43,77,.15)}
.portrait-card img{display:block;width:100%;aspect-ratio:4/4.7;object-fit:cover}
.portrait-card div{padding:18px}.portrait-card strong{display:block;color:var(--dark);font-size:20px}.portrait-card span{color:var(--muted)}
.statement{margin:0;padding:28px clamp(22px,5vw,76px);background:var(--dark);color:white;font-size:clamp(22px,2.5vw,34px);font-weight:320;line-height:1.25}
.statement p{max-width:1120px;margin:0 auto}
.section{padding:76px clamp(22px,5vw,76px)}
.section-head{max-width:860px;margin-bottom:32px}
h2{margin:0 0 18px;color:var(--dark);font-size:clamp(30px,4vw,48px);line-height:1.05;letter-spacing:-.035em}
h3{margin:0 0 10px;color:var(--blue);font-size:25px}
.tinted{background:var(--soft)}
.process-grid,.challenge-grid,.cards-4,.case-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.process-grid article,.challenge-grid div,.service-card,.case-card{background:white;border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:0 14px 36px rgba(7,43,77,.06)}
.process-grid span{display:inline-flex;margin-bottom:18px;color:var(--petrol);font-weight:900}
.challenge-grid{grid-template-columns:repeat(3,1fr)}
.challenge-grid div{min-height:138px;background:white}
.cards-4{align-items:stretch}
.service-card ul,.case-card ul{padding-left:20px;margin:0}
li{margin:8px 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.split p,.page-hero p,.about-hero p,.contact-hero p{font-size:19px;color:var(--muted);max-width:840px}
.benefit-list{display:grid;gap:12px}
.benefit-list strong{background:var(--soft);border:1px solid var(--line);border-radius:18px;padding:18px;color:var(--dark)}
.results{background:linear-gradient(135deg,var(--dark),var(--blue));color:white}
.results h2,.results .eyebrow{color:white}
.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.result-grid strong{padding:22px;border-radius:18px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.22);min-height:88px}
.page-hero,.contact-hero{padding:76px clamp(22px,5vw,76px) 44px;background:linear-gradient(135deg,#fff,#eef6fb)}
.page-hero h1,.contact-hero h1{max-width:1050px}
.case-grid{grid-template-columns:repeat(4,1fr)}
.case-card p{color:var(--muted)}
.about-hero{display:grid;grid-template-columns:1fr 300px;gap:54px;align-items:center;padding:76px clamp(22px,5vw,76px) 44px;background:linear-gradient(135deg,#fff,#eef6fb)}
.about-hero img{width:300px;border-radius:26px;box-shadow:0 22px 62px rgba(7,43,77,.15)}
.timeline{display:grid;gap:18px;max-width:960px}
.timeline div{border-left:5px solid var(--petrol);padding:4px 0 4px 22px}
.timeline strong{font-size:21px;color:var(--blue)}
.timeline p{margin:4px 0 0;color:var(--muted)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:12px}
.tag-cloud span{padding:12px 16px;border-radius:999px;background:white;border:1px solid var(--line);font-weight:750;color:var(--dark)}
.contact-box{display:grid;gap:12px;margin-top:28px;max-width:520px}
.contact-box a{padding:18px 22px;background:white;border:1px solid var(--line);border-radius:18px;text-decoration:none;font-weight:850;color:var(--blue);box-shadow:0 12px 30px rgba(7,43,77,.06)}
.site-footer{display:flex;justify-content:space-between;gap:32px;padding:56px clamp(22px,5vw,76px);background:#061E35;color:white}
.site-footer h2{color:white;font-size:34px}
.site-footer p{color:#B9C8D6}
.footer-contact{display:flex;flex-direction:column;gap:10px;font-size:20px;font-weight:850}
.footer-contact a{text-decoration:none}
.reveal{animation:fadeUp .65s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.process-grid,.cards-4,.case-grid{grid-template-columns:repeat(2,1fr)}.challenge-grid,.result-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){
  .menu-toggle{display:block}.main-nav{display:none}.nav-open .main-nav{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;padding:22px;background:white;border-bottom:1px solid var(--line)}
  .hero,.split,.about-hero,.site-footer{grid-template-columns:1fr;display:grid}
  .portrait-card,.about-hero img{max-width:260px}
  h1{font-size:44px}
  .process-grid,.challenge-grid,.cards-4,.case-grid,.result-grid{grid-template-columns:1fr}
  .section{padding:54px 22px}.hero,.page-hero,.about-hero,.contact-hero{padding-left:22px;padding-right:22px}
}
