/* ===== Ostmen Marketing — shared styles ===== */
:root{
  --navy:#0A1A2F;
  --navy2:#0E2440;
  --card:#13294B;
  --blue:#007FFD;
  --blue-dark:#0066cc;
  --white:#FFFFFF;
  --light:#C9D6E5;
  --border:rgba(0,127,253,0.25);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:var(--navy);
  color:var(--light);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px;}
section{padding:96px 0;}
.bg-navy{background:var(--navy);}
.bg-navy2{background:var(--navy2);}

.eyebrow{color:var(--blue);font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;margin-bottom:16px;}
h1,h2,h3{color:var(--white);font-weight:800;line-height:1.12;}
h1{font-size:clamp(34px,5.5vw,56px);margin-bottom:22px;}
h2{font-size:clamp(28px,4vw,42px);margin-bottom:18px;}
h3{font-size:23px;margin-bottom:12px;font-weight:700;}
p{font-size:18px;color:var(--light);}
.lead{font-size:19px;max-width:760px;}
.center{text-align:center;}
.mx-auto{margin-left:auto;margin-right:auto;}
.maxw{max-width:840px;}
.accent-bar{width:60px;height:4px;background:var(--blue);border-radius:2px;margin:22px auto;}
.accent-bar.left{margin-left:0;}

.btn{display:inline-block;background:var(--blue);color:var(--white);text-decoration:none;font-weight:700;font-size:17px;padding:18px 40px;border-radius:8px;box-shadow:0 10px 30px rgba(0,127,253,0.35);transition:all .2s ease;}
.btn:hover{background:var(--blue-dark);transform:translateY(-2px);}
.btn-outline{display:inline-block;background:transparent;color:var(--white);text-decoration:none;font-weight:700;font-size:17px;padding:16px 36px;border-radius:8px;border:1px solid rgba(255,255,255,.25);transition:all .2s ease;}
.btn-outline:hover{border-color:var(--blue);background:rgba(0,127,253,.08);}
.subnote{font-size:14px;margin-top:18px;color:var(--light);opacity:.8;}

/* nav */
nav{position:sticky;top:0;z-index:50;background:rgba(10,26,47,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06);}
nav .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:16px;padding-bottom:16px;}
.logo{font-weight:800;color:var(--white);font-size:24px;letter-spacing:.5px;text-decoration:none;}
.logo span{color:var(--blue);}
.nav-links{display:flex;gap:30px;align-items:center;}
.nav-links a{color:var(--light);text-decoration:none;font-size:15px;font-weight:500;transition:color .2s;}
.nav-links a:hover,.nav-links a.active{color:var(--white);}
.nav-cta{background:var(--blue);color:#fff !important;padding:11px 22px;border-radius:7px;font-weight:700;}
.nav-cta:hover{background:var(--blue-dark);}
/* dropdown */
.has-dropdown{position:relative;}
.has-dropdown>a::after{content:" \25BE";font-size:11px;opacity:.7;}
.dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);background:var(--navy2);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px;min-width:220px;opacity:0;visibility:hidden;transition:opacity .18s,transform .18s;box-shadow:0 18px 50px rgba(0,0,0,.45);z-index:60;}
.has-dropdown:hover .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(4px);}
.dropdown a{display:block;padding:11px 14px;border-radius:7px;color:var(--light);font-size:14.5px;white-space:nowrap;}
.dropdown a:hover{background:rgba(0,127,253,.12);color:var(--white);}
.nav-toggle{display:none;background:none;border:none;color:#fff;font-size:26px;cursor:pointer;line-height:1;}
@media(max-width:820px){
  .nav-links{position:fixed;top:0;right:0;height:100vh;width:260px;flex-direction:column;align-items:flex-start;gap:8px;background:var(--navy2);padding:90px 28px 28px;transform:translateX(100%);transition:transform .25s ease;box-shadow:-10px 0 40px rgba(0,0,0,.4);}
  .nav-links.open{transform:translateX(0);}
  .nav-links a{font-size:17px;padding:10px 0;width:100%;}
  .nav-toggle{display:block;z-index:60;}
  .has-dropdown>a::after{display:none;}
  .dropdown{position:static;transform:none;opacity:1;visibility:visible;background:transparent;border:none;box-shadow:none;padding:0 0 0 16px;min-width:0;}
  .dropdown a{padding:8px 0;font-size:15px;}
}

/* hero */
.hero{padding:120px 0;text-align:center;background:radial-gradient(ellipse at top,#102a4d 0%,var(--navy) 60%);}
.page-hero{padding:120px 0 80px;text-align:center;background:radial-gradient(ellipse at top,#102a4d 0%,var(--navy) 65%);}

/* trust badges */
.trust-strip{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;margin-top:40px;}
.trust-badge{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);border-radius:10px;padding:12px 18px;text-decoration:none;color:var(--light);font-size:14px;font-weight:600;transition:border-color .2s,background .2s;}
a.trust-badge:hover{border-color:var(--blue);background:rgba(0,127,253,.08);}
.gpartner-badge{display:inline-flex;align-items:center;border-radius:10px;overflow:hidden;transition:transform .2s;line-height:0;}
.gpartner-badge:hover{transform:translateY(-2px);}
.gpartner-badge img{display:block;height:84px;width:auto;}
.trust-badge .stars{color:#FFC107;font-size:15px;letter-spacing:1px;}
.trust-badge .chk{color:var(--blue);font-weight:800;}
@media(max-width:768px){.gpartner-badge img{height:72px;}}

/* logo wall */
.trustband{background:var(--navy2);padding:54px 0;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);}
.trustband .tagline{text-align:center;color:var(--light);font-size:14px;letter-spacing:2px;text-transform:uppercase;font-weight:700;margin-bottom:8px;}
.trustband .statline{text-align:center;color:var(--white);font-size:20px;font-weight:700;margin-bottom:30px;}
.trustband .statline b{color:var(--blue);}
.logo-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px 22px;max-width:880px;margin:0 auto;}
.logo-cell{display:flex;align-items:center;justify-content:center;width:128px;height:44px;}
.client-logo{max-width:100%;max-height:100%;width:auto;height:auto;opacity:.72;filter:brightness(0) invert(1);transition:opacity .2s ease;}
.client-logo:hover{opacity:1;}
@media(max-width:768px){.logo-cell{width:104px;height:36px;}.logo-row{gap:18px 14px;max-width:460px;}}

/* cards / grids */
.grid3{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:46px;}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:36px 32px;transition:transform .2s ease,border-color .2s ease;}
.card:hover{transform:translateY(-4px);border-color:var(--blue);}
.card h3{margin-bottom:12px;}
.card p{font-size:16px;}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:46px;}
.step .n{color:var(--blue);font-size:40px;font-weight:800;margin-bottom:8px;}
.step h3{font-size:21px;}
.step p{font-size:16px;}

/* compare cards */
.compare{max-width:940px;margin:48px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:24px;text-align:left;}
.cmp-card{border-radius:18px;padding:34px 32px;border:1px solid rgba(255,255,255,.08);}
.cmp-card.agency{background:rgba(255,255,255,.025);}
.cmp-card.ostmen{background:linear-gradient(165deg,rgba(0,127,253,.14) 0%,rgba(0,127,253,.04) 100%);border:1px solid rgba(0,127,253,.45);box-shadow:0 18px 50px rgba(0,127,253,.12);position:relative;}
.cmp-card .label{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px;}
.cmp-card.agency .label{color:rgba(201,214,229,.6);}
.cmp-card.ostmen .label{color:var(--blue);}
.cmp-card .title{font-size:23px;font-weight:800;color:var(--white);margin-bottom:22px;line-height:1.2;}
.cmp-list{list-style:none;margin:0;padding:0;}
.cmp-list li{display:flex;gap:13px;align-items:flex-start;padding:11px 0;font-size:15.5px;line-height:1.5;border-top:1px solid rgba(255,255,255,.06);}
.cmp-list li:first-child{border-top:none;}
.cmp-card.agency .cmp-list li{color:var(--light);}
.cmp-card.ostmen .cmp-list li{color:var(--white);}
.ic{flex:none;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;margin-top:1px;}
.ic.x{background:rgba(201,214,229,.12);color:rgba(201,214,229,.7);}
.ic.check{background:var(--blue);color:#fff;}
.cmp-badge{position:absolute;top:-13px;right:24px;background:var(--blue);color:#fff;font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;padding:6px 14px;border-radius:20px;box-shadow:0 6px 18px rgba(0,127,253,.4);}
@media(max-width:760px){.compare{grid-template-columns:1fr;}}

/* case study grid */
.case-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:46px;}
.case{position:relative;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:linear-gradient(160deg,var(--card) 0%,#0c1f3b 100%);border:1px solid var(--border);text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;padding:22px;transition:transform .2s ease,border-color .2s ease;}
.case:hover{transform:translateY(-5px);border-color:var(--blue);}
.case .tag{display:block;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--blue);}
.case .result{color:var(--white);font-size:26px;font-weight:800;line-height:1.1;margin-bottom:6px;margin-top:14px;}
.case .who{color:var(--light);font-size:14px;margin-bottom:14px;}
.case .more{color:var(--blue);font-size:13px;font-weight:700;}
.case .more::after{content:" \2192";}
@media(max-width:980px){.grid3{grid-template-columns:repeat(2,1fr);}.case-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:820px){.steps{grid-template-columns:1fr;}section{padding:64px 0;}.hero{padding:84px 0;}.page-hero{padding:96px 0 64px;}}
@media(max-width:560px){.grid3{grid-template-columns:1fr;}.case{padding:18px;}.case .result{font-size:22px;}}

/* case study list (case studies page) */
.cs-list{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:46px;}
.cs-item{display:block;background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;text-decoration:none;transition:transform .2s,border-color .2s;}
.cs-item:hover{transform:translateY(-5px);border-color:var(--blue);}
.cs-thumb{height:180px;background:linear-gradient(135deg,#102a4d,#0c1f3b);display:flex;align-items:center;justify-content:center;color:var(--blue);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;border-bottom:1px solid var(--border);}
.cs-body{padding:26px 28px;}
.cs-body .cat{color:var(--blue);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;}
.cs-body h3{color:var(--white);font-size:21px;margin:8px 0 10px;}
.cs-body p{color:var(--light);font-size:15px;line-height:1.6;}
.cs-body .more{color:var(--blue);font-size:14px;font-weight:700;margin-top:14px;display:inline-block;}
.cs-body .more::after{content:" \2192";}
@media(max-width:760px){.cs-list{grid-template-columns:1fr;}}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:46px;text-align:left;align-items:start;}
.contact-info .ci-item{margin-bottom:26px;}
.contact-info .ci-item .lbl{color:var(--blue);font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:6px;}
.contact-info .ci-item a,.contact-info .ci-item span{color:var(--white);font-size:18px;text-decoration:none;}
.form-field{margin-bottom:18px;}
.form-field label{display:block;color:var(--light);font-size:14px;font-weight:600;margin-bottom:7px;}
.form-field input,.form-field textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:13px 15px;color:var(--white);font-size:15px;font-family:inherit;}
.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--blue);}
.form-field textarea{min-height:130px;resize:vertical;}
@media(max-width:760px){.contact-grid{grid-template-columns:1fr;gap:36px;}}

/* about values */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:46px;text-align:left;}
@media(max-width:820px){.values{grid-template-columns:1fr;}}

/* footer */
footer{background:var(--navy);padding:56px 0 40px;border-top:1px solid rgba(255,255,255,.06);}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:34px;}
.foot-col h4{color:var(--white);font-size:14px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px;font-weight:700;}
.foot-col .logo{display:inline-block;margin-bottom:14px;}
.foot-col p{font-size:14.5px;color:var(--light);line-height:1.7;margin-bottom:6px;}
.foot-col a{color:var(--light);text-decoration:none;font-size:14.5px;display:block;padding:5px 0;}
.foot-col a:hover{color:var(--white);}
.foot-col a.inline{display:inline;padding:0;}
.foot-col a.inline:hover{color:var(--blue);}
.foot-bottom{text-align:center;font-size:13px;color:rgba(201,214,229,.6);border-top:1px solid rgba(255,255,255,.05);padding-top:24px;}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr;gap:30px;}}

/* about split hero */
.split-hero{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;text-align:left;}
.split-hero .copy h1{margin-bottom:20px;}
.video-embed{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;border:1px solid var(--border);background:linear-gradient(135deg,#102a4d,#0c1f3b);}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--light);gap:14px;}
.video-placeholder .play{width:74px;height:74px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,127,253,.4);}
.video-placeholder .play::after{content:"";border-style:solid;border-width:13px 0 13px 22px;border-color:transparent transparent transparent #fff;margin-left:5px;}
.video-placeholder span{font-size:14px;letter-spacing:1px;text-transform:uppercase;font-weight:600;}
@media(max-width:820px){.split-hero{grid-template-columns:1fr;gap:36px;text-align:center;}.split-hero .copy h1{}}

/* service page sections */
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:46px;text-align:left;}
@media(max-width:820px){.benefits{grid-template-columns:1fr;}}
.faq{max-width:820px;margin:40px auto 0;text-align:left;}
.faq-item{border-bottom:1px solid rgba(255,255,255,.08);padding:22px 0;}
.faq-item h3{color:var(--white);font-size:19px;margin-bottom:10px;}
.faq-item p{color:var(--light);font-size:16px;line-height:1.6;}
.svc-hero-tag{display:inline-block;background:rgba(0,127,253,.12);border:1px solid var(--border);color:var(--blue);font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:8px 16px;border-radius:30px;margin-bottom:20px;}

/* services overview cards link */
.svc-card-link{text-decoration:none;display:block;}
.svc-card-link .more{color:var(--blue);font-size:14px;font-weight:700;margin-top:14px;display:inline-block;}
.svc-card-link .more::after{content:" \2192";}

/* ===== contrast upgrades ===== */
/* alternating feature row: text beside visual */
.feature-row{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;max-width:1080px;margin:0 auto;text-align:left;}
.feature-row+.feature-row{margin-top:80px;}
.feature-row.flip .fr-visual{order:-1;}
.feature-row .fr-copy h2{font-size:clamp(26px,3.2vw,34px);margin-bottom:16px;}
.feature-row .fr-copy p{font-size:17px;color:var(--light);line-height:1.7;}
.feature-row .fr-eyebrow{color:var(--blue);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;}
.fr-visual img{width:100%;height:auto;display:block;}
@media(max-width:820px){.feature-row{grid-template-columns:1fr;gap:30px;}.feature-row.flip .fr-visual{order:0;}.feature-row+.feature-row{margin-top:56px;}}

/* stats strip */
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1000px;margin:0 auto;}
.stat-strip .s{text-align:center;}
.stat-strip .s .big{font-size:clamp(32px,4vw,44px);font-weight:800;color:var(--blue);line-height:1;margin-bottom:8px;}
.stat-strip .s .lbl{font-size:14px;color:var(--light);}
.stat-band{background:#0E2440;}
@media(max-width:680px){.stat-strip{grid-template-columns:repeat(2,1fr);gap:32px 16px;}}

/* hero with side visual */
.hero-split{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;text-align:left;}
.hero-split .hs-visual img{width:100%;height:auto;display:block;border-radius:16px;}
@media(max-width:880px){.hero-split{grid-template-columns:1fr;gap:36px;text-align:center;}}

/* gradient accent CTA band */
.cta-band{background:linear-gradient(120deg,#007FFD 0%,#0047a3 100%);}
.cta-band h2,.cta-band p{color:#fff;}
.cta-band .btn{background:#fff;color:#0a3d8f;}
.cta-band .btn:hover{background:#eef4ff;}

/* image-less feature block: centered, contained, with side accent */
.feature-solo{max-width:820px;margin:0 auto;text-align:center;padding:36px 40px;background:var(--card);border:1px solid var(--border);border-radius:16px;}
.feature-solo+.feature-solo{margin-top:24px;}
.feature-solo .fr-eyebrow{color:var(--blue);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;}
.feature-solo h2{font-size:clamp(24px,3vw,32px);margin-bottom:14px;}
.feature-solo p{font-size:17px;color:var(--light);line-height:1.7;}
.feature-row+.feature-solo,.feature-solo+.feature-row{margin-top:40px;}
/* paid social real grid sizing */
.hs-visual img,.fr-visual img{border-radius:16px;}