:root{
  --navy:#17395f;
  --navy-dark:#0b223d;
  --navy-soft:#eef3f7;
  --green:#92b72e;
  --ink:#17324d;
  --text:#3c4f62;
  --muted:#708192;
  --line:#dbe4eb;
  --bg:#f6f8fa;
  --white:#ffffff;
  --shadow:0 22px 60px rgba(12,34,61,.10);
  --radius:20px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.55}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.topbar{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid rgba(23,57,95,.08)}
.nav{height:86px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo img{width:240px;height:auto}
.menu{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:700}
.menu a{position:relative;padding:30px 0 28px;color:var(--ink)}
.menu a::after{content:"";position:absolute;left:0;right:100%;bottom:19px;height:2px;background:var(--green);transition:.24s}
.menu a:hover::after,.menu a.active::after{right:0}
.menu-toggle{display:none;border:0;background:none;color:var(--navy);font-size:28px}

.eyebrow{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--navy);margin-bottom:16px}
.eyebrow::before{content:"";width:34px;height:3px;background:var(--green);display:inline-block}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;border-radius:4px;border:1px solid var(--navy);font-size:13px;letter-spacing:.04em;font-weight:700;text-transform:uppercase;transition:.22s}
.btn.primary{background:var(--green);border-color:var(--green);color:#fff}
.btn.secondary{background:#fff;color:var(--navy)}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(11,34,61,.12)}
.actions{display:flex;gap:14px;flex-wrap:wrap}

.hero-home{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff 0%,#f6f8fa 100%)}
.hero-home .hero-grid{display:grid;grid-template-columns:1fr .92fr;gap:36px;align-items:stretch;padding:58px 0 76px}
.hero-copy{padding:24px 0 0}
.hero-copy h1{font-size:70px;line-height:.98;margin:0 0 18px;letter-spacing:-.05em}
.hero-copy h1 span{color:var(--green)}
.hero-copy .lead{font-size:21px;color:var(--text);max-width:620px;margin:0 0 32px}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:42px;border:1px solid var(--line);max-width:720px}
.hero-stat{background:#fff;padding:18px 18px 16px}
.hero-stat b{display:block;color:var(--green);font-size:12px;letter-spacing:.16em;margin-bottom:6px}
.hero-stat span{display:block;font-size:15px;font-weight:700;color:var(--ink);line-height:1.35}
.hero-visual{position:relative;min-height:620px;border-radius:0;overflow:hidden;box-shadow:var(--shadow)}
.hero-visual img{width:100%;height:100%;object-fit:cover}
.hero-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,61,.24),rgba(11,34,61,.02) 45%,rgba(11,34,61,.14))}
.hero-panel{position:absolute;left:0;right:0;bottom:0;padding:26px 28px;color:#fff;background:linear-gradient(180deg,transparent 0,rgba(11,34,61,.88) 100%)}
.hero-panel h3{font-size:32px;line-height:1.08;margin:0 0 10px;max-width:450px}
.hero-panel p{margin:0;max-width:460px;color:#d9e5f0}

.section{padding:92px 0}
.section.soft{background:var(--bg)}
.section-head{display:flex;justify-content:space-between;gap:40px;align-items:flex-end;margin-bottom:36px}
.section-head h2{font-size:46px;line-height:1.07;margin:0;letter-spacing:-.04em}
.section-head p{max-width:560px;color:var(--text);margin:0;font-size:17px}

.split{display:grid;grid-template-columns:1.02fr .98fr;gap:46px;align-items:center}
.split.reverse{grid-template-columns:.98fr 1.02fr}
.image-frame{position:relative;overflow:hidden;border-radius:0;box-shadow:var(--shadow);min-height:420px}
.image-frame img{width:100%;height:100%;object-fit:cover}
.image-frame.tall{min-height:520px}
.image-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,34,61,.03),rgba(11,34,61,.16))}
.image-badge{position:absolute;left:28px;bottom:28px;z-index:2;background:rgba(255,255,255,.95);padding:16px 18px;max-width:290px;border-left:4px solid var(--green);box-shadow:0 16px 30px rgba(11,34,61,.14)}
.image-badge strong{display:block;font-size:20px;color:var(--ink);line-height:1.1;margin-bottom:6px}
.image-badge span{display:block;color:var(--text);font-size:14px}
.copy-block h2{font-size:46px;line-height:1.07;margin:0 0 18px;letter-spacing:-.04em}
.copy-block p{font-size:18px;color:var(--text);margin:0 0 18px}

.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.value-card{background:#fff;padding:32px 28px}
.value-card b{display:block;color:var(--green);font-size:12px;letter-spacing:.16em;margin-bottom:8px}
.value-card h3{font-size:28px;margin:0 0 8px}
.value-card p{margin:0;color:var(--text)}

.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.service-card{background:#fff;border:1px solid var(--line);padding:28px;display:flex;flex-direction:column;gap:12px;min-height:230px;transition:.22s}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.service-icon{width:52px;height:52px;border:1px solid rgba(146,183,46,.55);display:flex;align-items:center;justify-content:center;color:var(--green);font-size:25px}
.service-card h3{margin:0;font-size:22px;line-height:1.12}
.service-card p{margin:0;color:var(--text);font-size:15px}
.text-link{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);font-weight:700;margin-top:auto}

.collab-band{position:relative;overflow:hidden;background:linear-gradient(118deg,var(--navy-dark),var(--navy));color:#fff}
.collab-band::after{content:"";position:absolute;right:-90px;top:-20px;width:360px;height:360px;border:55px solid rgba(255,255,255,.05);transform:rotate(45deg)}
.collab-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:0;align-items:stretch;position:relative;z-index:1}
.collab-copy{padding:74px 54px 74px 0}
.collab-copy h2{font-size:48px;line-height:1.05;margin:0 0 18px;letter-spacing:-.04em}
.collab-copy h2 span{color:var(--green)}
.collab-copy p{font-size:18px;color:#d8e4ef;margin:0 0 28px;max-width:610px}
.collab-visual{min-height:450px;position:relative}
.collab-visual img{width:100%;height:100%;object-fit:cover}
.collab-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,61,.06),rgba(11,34,61,.34))}

.audiences-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.audience-card{padding:20px 22px;background:#fff;border-top:3px solid var(--green);box-shadow:0 10px 35px rgba(11,34,61,.05);font-weight:700}

.cta-banner{position:relative;overflow:hidden;color:#fff}
.cta-banner .image-frame{min-height:320px;box-shadow:none}
.cta-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,61,.88) 0%,rgba(11,34,61,.70) 45%,rgba(11,34,61,.45) 100%)}
.cta-content{position:absolute;inset:0;display:flex;align-items:center}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px;width:min(var(--max),calc(100% - 40px));margin:auto}
.cta-inner h2{font-size:42px;line-height:1.08;max-width:700px;margin:0;letter-spacing:-.04em}
.cta-inner h2 span{color:var(--green)}

.page-hero{position:relative;color:#fff;overflow:hidden}
.page-hero .bg{position:absolute;inset:0}
.page-hero .bg img{width:100%;height:100%;object-fit:cover}
.page-hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,61,.82) 0%,rgba(11,34,61,.62) 44%,rgba(11,34,61,.48) 100%)}
.page-hero .container{position:relative;z-index:1;padding:98px 0 86px}
.page-hero h1{font-size:62px;line-height:1.02;margin:0 0 18px;letter-spacing:-.05em;max-width:760px}
.page-hero p{max-width:760px;font-size:20px;margin:0;color:#dbe7f1}

.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.info-card{background:#fff;border:1px solid var(--line);padding:30px}
.info-card h3{margin:0 0 10px;font-size:26px}
.info-card p{margin:0;color:var(--text);font-size:16px}

.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step-card{padding:28px;background:#fff;border:1px solid var(--line)}
.step-card b{display:block;color:var(--green);font-size:12px;letter-spacing:.16em;margin-bottom:10px}
.step-card h3{margin:0 0 8px;font-size:24px}
.step-card p{margin:0;color:var(--text)}

.insights-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.insight-card{background:#fff;border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column}
.insight-card .thumb{aspect-ratio:16/10;overflow:hidden}
.insight-card .thumb img{width:100%;height:100%;object-fit:cover}
.insight-card .body{padding:24px}
.insight-card .tag{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:700;margin-bottom:10px}
.insight-card h3{margin:0 0 10px;font-size:24px;line-height:1.12}
.insight-card p{margin:0;color:var(--text)}

.contact-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px}
.contact-card{position:relative;color:#fff;overflow:hidden;min-height:100%}
.contact-card .bg{position:absolute;inset:0}
.contact-card .bg img{width:100%;height:100%;object-fit:cover}
.contact-card .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,34,61,.28),rgba(11,34,61,.88))}
.contact-card .inner{position:relative;z-index:1;padding:34px;height:100%;display:flex;flex-direction:column;justify-content:flex-end}
.contact-card h2{font-size:36px;line-height:1.05;margin:0 0 10px}
.contact-card p{color:#dbe7f1;margin:0 0 12px}
.contact-list{display:grid;gap:12px;margin-top:20px}
.contact-item{padding:14px 16px;background:rgba(255,255,255,.09);border-left:3px solid var(--green)}
.form-shell{border:1px solid var(--line);padding:34px;background:#fff}
.form{display:grid;gap:16px}
.form label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.form input,.form textarea{width:100%;padding:14px 15px;border:1px solid #ccd7df;font:inherit}
.form textarea{min-height:150px;resize:vertical}
.notice{font-size:13px;color:var(--muted)}

footer{background:#0b223d;color:#d6e0e8;padding:45px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:40px}
.footer-logo{width:220px;background:#fff;padding:8px}
.footer-title{font-weight:700;color:#fff;margin-bottom:12px}
.footer-links{display:grid;gap:8px;font-size:14px}
.copyright{border-top:1px solid rgba(255,255,255,.10);margin-top:30px;padding-top:16px;font-size:12px;color:#9eb0bf}

@media(max-width:1050px){
  .hero-home .hero-grid,.split,.split.reverse,.collab-grid,.contact-wrap,.info-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .hero-copy h1{font-size:58px}
  .page-hero h1{font-size:52px}
  .process-grid{grid-template-columns:repeat(2,1fr)}
  .insights-grid{grid-template-columns:1fr 1fr}
  .collab-copy{padding:64px 0}
  .section-head{align-items:flex-start;flex-direction:column}
  .cta-inner{flex-direction:column;align-items:flex-start;padding:60px 0}
}
@media(max-width:900px){
  .menu{display:none;position:absolute;top:86px;left:0;right:0;background:#fff;padding:18px 22px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}
  .menu.open{display:flex}.menu a{padding:10px 0}.menu a::after{bottom:3px}.menu-toggle{display:block}
  .logo img{width:200px}
  .hero-stats,.values-grid{grid-template-columns:1fr}
  .audiences-grid,.services-grid,.insights-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .container{width:min(var(--max),calc(100% - 26px))}
  .nav{height:76px}.menu{top:76px}
  .logo img{width:175px}
  .hero-home .hero-grid{padding:34px 0 54px}
  .hero-copy{padding-top:8px}
  .hero-copy h1{font-size:42px}
  .hero-copy .lead{font-size:18px}
  .hero-visual{min-height:360px}
  .hero-panel h3{font-size:26px}
  .section{padding:68px 0}
  .copy-block h2,.section-head h2,.cta-inner h2,.collab-copy h2{font-size:34px}
  .page-hero .container{padding:74px 0 66px}
  .page-hero h1{font-size:40px}
  .page-hero p{font-size:18px}
  .image-frame,.image-frame.tall,.collab-visual{min-height:300px}
  .services-grid,.process-grid,.info-grid,.audiences-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}
