@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

:root{
  --blue:#49afe5;
  --blue2:#4d73c8;
  --purple:#7446c7;
  --purple2:#4b287f;
  --deep:#271050;
  --ink:#25223a;
  --muted:#6c6a78;
  --soft:#f7f7f9;
  --line:#ecebf0;
  --mint:#a8dda9;
  --white:#fff;
  --shell:min(1140px,calc(100% - 42px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:#fff;color:var(--ink);
  font-family:'Poppins',Arial,sans-serif;
  font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
.shell{width:var(--shell);margin:auto}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.12;letter-spacing:-.025em}
.kicker{
  display:inline-flex;align-items:center;gap:9px;
  color:var(--blue2);font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase
}
.kicker:before{content:"";width:22px;height:2px;background:currentColor}
.kicker.light{color:#fff}
.btn{
  min-height:48px;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;
  border:0;border-radius:2px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;
  transition:.2s ease
}
.btn:hover{transform:translateY(-2px)}
.btn-blue{background:var(--blue);color:#fff}
.btn-purple{background:var(--purple);color:#fff}
.btn-white{background:#fff;color:var(--deep)}
.btn-mint{background:var(--mint);color:var(--deep)}

/* Header – white, clean, like the reference */
.header{
  position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid #f0eff3
}
.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{
  display:flex;align-items:center;gap:7px;
  color:#29104e;font-family:Georgia,'Times New Roman',serif;font-size:36px;font-weight:700;letter-spacing:-.05em
}
.logo-dot{width:8px;height:8px;border-radius:50%;background:var(--mint);margin-top:13px}
.nav{display:flex;align-items:center;gap:28px}
.nav a{font-size:12px;font-weight:600;color:#363243}
.nav a:hover{color:var(--blue2)}
.nav .nav-cta{padding:13px 18px;background:var(--blue);color:#fff}
.menu{
  display:none;width:42px;height:42px;border:1px solid var(--line);background:#fff
}
.menu span{display:block;width:18px;height:2px;margin:4px auto;background:var(--deep)}

/* HERO: photo right, diagonal blue/purple field left */
.hero{
  position:relative;min-height:655px;overflow:hidden;background:#1c1b24;
}
.hero-photo{
  position:absolute;inset:0;
  background:
    linear-gradient(rgba(29,37,55,.10),rgba(29,37,55,.10)),
    url('https://images.pexels.com/photos/6476185/pexels-photo-6476185.jpeg?auto=compress&cs=tinysrgb&w=1800') center/cover no-repeat;
  filter:grayscale(1) contrast(1.04);
}
.hero-photo:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(40,20,86,.10) 30%,rgba(35,68,110,.22) 100%)
}
.hero-color{
  position:absolute;left:0;top:0;bottom:0;width:62%;
  background:linear-gradient(135deg,rgba(74,174,229,.96) 0%,rgba(83,107,199,.96) 47%,rgba(116,70,199,.96) 100%);
  clip-path:polygon(0 0,78% 0,100% 100%,0 100%);
}
.hero-color:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(45,25,100,.20));
}
.world-map{
  position:absolute;left:1.5%;top:7%;width:55%;height:88%;z-index:2;
  background:url('../img/world-panama.svg') center/contain no-repeat;
  opacity:.86
}
.hero-inner{
  position:relative;z-index:4;min-height:655px;display:flex;align-items:center
}
.hero-copy{width:56%;padding:64px 0 78px;color:#fff}
.hero-copy h1{
  margin:17px 0 18px;max-width:620px;color:#fff;
  font-size:clamp(42px,4.6vw,64px);font-weight:800;line-height:1.01;text-transform:uppercase
}
.hero-copy p{max-width:575px;color:rgba(255,255,255,.92);font-size:16px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:31px}
.hero-play{
  position:absolute;right:16%;top:49%;z-index:5;
  width:70px;height:70px;display:grid;place-items:center;border-radius:50%;
  background:#fff;color:var(--blue);font-size:25px;box-shadow:0 12px 38px rgba(0,0,0,.16)
}

/* cards crossing hero boundary */
.hero-services{position:relative;z-index:6;margin-top:-54px}
.hero-service-grid{
  width:min(840px,calc(100% - 36px));margin:auto;display:grid;grid-template-columns:repeat(3,1fr);
  background:#fff;box-shadow:0 17px 45px rgba(31,21,72,.14)
}
.mini-service{
  min-height:150px;padding:26px 25px;border-right:1px solid var(--line);position:relative
}
.mini-service:last-child{border-right:0}
.mini-service.featured{background:linear-gradient(145deg,var(--blue),var(--purple));color:#fff}
.mini-icon{
  width:46px;height:46px;display:grid;place-items:center;border-radius:50%;
  background:#eef7fd;color:var(--blue2);font-size:20px
}
.featured .mini-icon{background:rgba(255,255,255,.18);color:#fff}
.mini-service h3{margin:15px 0 6px;font-size:16px}
.featured h3{color:#fff}
.mini-service p{margin:0;color:#7b7784;font-size:11px}
.featured p{color:#eef7ff}

/* generic sections */
.section{padding:94px 0}
.section.gray{background:#f7f7f9}
.section.deep{background:linear-gradient(135deg,#3a1a74 0%,#6a3dbc 52%,#5045a9 100%);color:#fff}
.section-head{max-width:720px;margin-bottom:42px}
.section-head.center{text-align:center;margin-inline:auto}
.section-head h2{margin:10px 0 12px;font-size:clamp(34px,4vw,54px);font-weight:700}
.section-head p{color:var(--muted);font-size:14px}
.section.deep .section-head p{color:#e7e2f4}

/* Why / about */
.intro-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:60px;align-items:center}
.photo-stack{position:relative;min-height:420px}
.photo-main{
  position:absolute;right:0;top:0;width:78%;height:340px;object-fit:cover;filter:saturate(.85);
  box-shadow:0 20px 50px rgba(33,24,62,.15)
}
.photo-small{
  position:absolute;left:0;bottom:0;width:48%;height:210px;object-fit:cover;
  border:8px solid #fff;box-shadow:0 16px 38px rgba(33,24,62,.12)
}
.intro-copy h2{margin:10px 0 15px;font-size:42px}
.intro-copy p{color:var(--muted)}
.benefits{display:grid;gap:15px;margin-top:25px}
.benefit{display:grid;grid-template-columns:45px 1fr;gap:13px}
.benefit b{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#edf7ff;color:var(--blue2)}
.benefit strong{display:block;font-size:14px}
.benefit p{margin:3px 0 0;font-size:11px}

/* Services */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.service-card{
  min-height:330px;padding:28px;background:#fff;color:var(--ink);box-shadow:0 16px 38px rgba(28,14,62,.16);
  display:flex;flex-direction:column;transition:.22s
}
.service-card:hover{transform:translateY(-6px)}
.service-card.featured{background:linear-gradient(160deg,#3fc3f2,var(--blue));color:#fff}
.service-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:#eef8fe;color:var(--blue2);font-size:24px}
.service-card.featured .service-icon{background:rgba(255,255,255,.16);color:#fff}
.service-card h3{margin:24px 0 10px;font-size:21px}
.service-card.featured h3{color:#fff}
.service-card p{color:#77717d;font-size:12px}
.service-card.featured p{color:#effbff}
.service-list{list-style:none;padding:0;margin:14px 0 25px;display:grid;gap:8px}
.service-list li{font-size:11px;border-top:1px solid rgba(40,30,60,.10);padding-top:8px}
.service-card.featured .service-list li{border-color:rgba(255,255,255,.24)}
.service-card .btn{margin-top:auto}

/* Methodology */
.process{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;position:relative}
.process:before{
  content:"";position:absolute;left:14%;right:14%;top:40px;border-top:1px dashed #bbb4c7
}
.process-step{text-align:center;position:relative}
.step-circle{
  width:78px;height:78px;margin:0 auto 22px;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(145deg,var(--blue),var(--purple));color:#fff;font-size:22px;font-weight:700;
  border:9px solid #f5f5f8;position:relative;z-index:2
}
.process-step h3{font-size:18px;margin-bottom:8px}
.process-step p{color:var(--muted);font-size:11px}

/* Founder */
.founder-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:62px;align-items:center}
.founder-photo{background:#eee;box-shadow:0 18px 45px rgba(28,20,55,.13)}
.founder-photo img{width:100%;height:490px;object-fit:cover;object-position:center 15%}
.founder-copy h2{font-size:42px;margin:9px 0 4px}
.founder-role{color:var(--blue2);font-weight:700;font-size:13px}
.founder-copy p{color:var(--muted);font-size:13px}
.credentials{display:grid;gap:9px;margin-top:19px}
.credentials span{display:flex;gap:9px;align-items:flex-start;font-size:11px}
.credentials i{width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:var(--mint);font-style:normal;color:#20482c;font-weight:700}

/* CTA + Footer */
.cta{padding:72px 0;background:linear-gradient(125deg,#2f1763,#5d35a8 58%,#4773c6);color:#fff}
.cta-grid{display:flex;align-items:center;justify-content:space-between;gap:40px}
.cta h2{margin:8px 0;color:#fff;font-size:40px}
.cta p{margin:0;color:#e6e1f0}
.footer{background:#201044;color:#d5cee0}
.footer-grid{padding:45px 0 30px;display:grid;grid-template-columns:1.4fr .7fr .7fr;gap:45px}
.footer .logo{color:#fff}
.footer p{max-width:420px;color:#aaa1b7;font-size:11px}
.footer-links{display:grid;gap:8px;align-content:start}
.footer-links strong{color:#fff;font-size:12px}
.footer-links a{font-size:11px;color:#c8c0d3}
.footer-bottom{padding:18px 0 26px;border-top:1px solid rgba(255,255,255,.10);font-size:10px;color:#948aa1;display:flex;justify-content:space-between}

/* Motion */
.reveal{opacity:0;transform:translateY(28px);transition:.65s ease}
.reveal.left{transform:translateX(-34px)}
.reveal.right{transform:translateX(34px)}
.reveal.show{opacity:1;transform:none}
.stagger>*{opacity:0;transform:translateY(22px);transition:.55s ease}
.stagger.show>*{opacity:1;transform:none}
.stagger.show>*:nth-child(2){transition-delay:.08s}
.stagger.show>*:nth-child(3){transition-delay:.16s}
.stagger.show>*:nth-child(4){transition-delay:.24s}
.progress{position:fixed;left:0;top:0;height:3px;width:0;z-index:1200;background:linear-gradient(90deg,var(--blue),var(--purple))}

/* responsive */
@media(max-width:980px){
  .nav{display:none}.menu{display:block}
  .nav.open{display:grid;position:absolute;top:82px;left:20px;right:20px;padding:16px;background:#fff;box-shadow:0 16px 38px rgba(32,20,60,.15)}
  .hero-color{width:76%}.hero-copy{width:68%}.hero-play{right:10%}
  .intro-grid,.founder-grid{grid-template-columns:1fr}
  .service-grid{grid-template-columns:1fr}
  .founder-photo{max-width:520px}
}
@media(max-width:720px){
  :root{--shell:min(100% - 28px,1140px)}
  .header-inner{height:68px}.logo{font-size:30px}.nav.open{top:68px;left:14px;right:14px}
  .hero,.hero-inner{min-height:620px}
  .hero-photo{background-position:65% center}
  .hero-color{width:100%;clip-path:polygon(0 0,100% 0,90% 100%,0 100%);opacity:.92}
  .world-map{width:95%;left:-10%;opacity:.45}
  .hero-copy{width:90%;padding:70px 0}
  .hero-copy h1{font-size:40px}
  .hero-play{display:none}
  .hero-service-grid{grid-template-columns:1fr;margin-top:0}
  .mini-service{border-right:0;border-bottom:1px solid var(--line)}
  .section{padding:70px 0}
  .photo-stack{min-height:350px}.photo-main{width:85%;height:285px}.photo-small{height:170px}
  .intro-copy h2,.founder-copy h2{font-size:34px}
  .process{grid-template-columns:1fr;gap:22px}.process:before{display:none}
  .cta-grid{display:grid}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:grid;gap:7px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}
  .reveal,.stagger>*{opacity:1!important;transform:none!important}
}

/* CENTTI_MARKETING_V5_OFFICIAL_LOGO */
.logo-image-wrap{display:flex;align-items:center;min-width:0}
.logo-image{display:block;height:48px;width:auto;max-width:none}
@media(max-width:991px){.logo-image{height:42px}}
@media(max-width:640px){.logo-image{height:38px}}