*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#fff}
body{font-family:Arial,Helvetica,sans-serif;color:#071d37}
.page{position:relative;width:min(100%,747px);margin:0 auto;line-height:0}
.page>img{display:block;width:100%;height:auto}
.nav-overlay{position:absolute;z-index:5;top:0;left:60.2%;width:39.8%;height:70px;background:#072233;display:flex;align-items:center;justify-content:flex-end;gap:0;padding:0 3.5% 0 0;line-height:1;white-space:nowrap}
.nav-overlay a{display:inline-block;margin-left:13px;position:relative;color:#f5f8fa;text-decoration:none;font-size:clamp(8px,1.53vw,11.5px);font-weight:500;padding:8px 0 9px}
.nav-overlay a:hover,.nav-overlay a.active{color:#fff}
.nav-overlay a.active:after{content:"";position:absolute;height:2px;background:#00b8b1;left:0;right:0;bottom:2px}
.book-amazon-link{position:absolute;z-index:4;left:63.2%;top:61.1%;width:35.5%;height:19.6%;display:block;cursor:pointer;background:transparent}
.book-amazon-link:focus-visible{outline:3px solid #00b6b1;outline-offset:2px;border-radius:3px}
.case-study-entry{width:min(100%,747px);margin:0 auto;padding:10px 18px 14px;text-align:right;background:#fff;line-height:1}
.case-study-entry a{font-size:12px;color:#087f87;text-decoration:none;font-weight:700}
.case-study-entry a:hover{text-decoration:underline}

/* Third page: uses the same source artwork, colours and proportions as the approved Experience & Results page. */
.case-page{line-height:normal}
.case-nav{position:relative;height:auto;aspect-ratio:747 / 70;}
.case-nav>img{width:100%;height:100%;object-fit:cover;display:block}
.case-hero{height:202px;position:relative;overflow:hidden;background:#062335;color:#fff;padding:31px 34px 24px;display:flex;flex-direction:column;justify-content:center}
.case-hero .hero-photo{position:absolute;right:0;top:0;width:52%;height:100%;object-fit:cover;object-position:right center;z-index:0}
.case-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#062335 0%,rgba(6,35,53,.98) 39%,rgba(6,35,53,.52) 69%,rgba(6,35,53,.12) 100%);z-index:1}
.case-hero>*{position:relative;z-index:2;max-width:440px}
.eyebrow{font-size:10px;letter-spacing:1.25px;text-transform:uppercase;font-weight:800;color:#20c2bd;margin:0 0 10px}
.case-hero h1{font-size:clamp(27px,3.8vw,34px);line-height:1.08;letter-spacing:-.7px;margin:0 0 12px;color:#fff;max-width:440px}
.case-hero p{font-size:14px;line-height:1.42;color:#e2edf1;margin:0;max-width:420px}
.case-body{height:543px;padding:17px 20px 18px;background:#fff;overflow:hidden}
.case-intro{margin-bottom:13px}
.case-intro .eyebrow{margin:0 0 5px;font-size:9px}
.case-intro h2{margin:0 0 5px;font-size:22px;line-height:1.12;letter-spacing:-.45px;color:#071d37}
.case-intro p{font-size:12px;line-height:1.3;color:#39485a;margin:0;max-width:690px}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:13px}
.stat{min-height:77px;padding:10px 12px;background:#eef0f4;border-radius:3px;display:flex;flex-direction:column;justify-content:center}
.stat strong{display:block;color:#087f87;font-size:24px;line-height:1.05;margin-bottom:4px;letter-spacing:-.6px}
.stat span{font-size:10.5px;line-height:1.2;color:#263347;font-weight:700}
.story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;height:290px}
.story-card{background:#eef0f4;border-radius:3px;padding:13px 14px 12px;overflow:hidden}
.story-card .step{font-size:9px;line-height:1.1;letter-spacing:1px;color:#07878a;font-weight:800;margin:0 0 6px;text-transform:uppercase}
.story-card h3{font-size:15px;line-height:1.15;color:#081d38;margin:0 0 7px}
.story-card p{font-size:11.4px;line-height:1.38;color:#243246;margin:0}
.case-cta{position:relative;width:100%;line-height:0}
.case-cta img,.case-footer img{display:block;width:100%;height:auto}
.case-cta a{position:absolute;right:4.8%;top:25%;width:21%;height:55%;display:block}
.case-footer{position:relative;line-height:0}
.case-footer a.phone{position:absolute;left:34%;top:18%;width:17%;height:45%}
.case-footer a.email{position:absolute;left:56%;top:18%;width:18%;height:45%}
.case-footer a.linkedin{position:absolute;left:79%;top:18%;width:19%;height:45%}
@media(max-width:600px){
 .nav-overlay{gap:7px;padding-right:2.5%}
 .nav-overlay a{font-size:8px}
 .case-hero{height:auto;min-height:190px;padding:24px 22px}
 .case-hero>*{max-width:78%}
 .case-body{height:auto;overflow:visible;padding:16px}
 .case-intro h2{font-size:21px}
 .stats{gap:7px}
 .stat{padding:9px 8px;min-height:74px}
 .stat strong{font-size:20px}
 .stat span{font-size:9.5px}
 .story-grid{height:auto;grid-template-rows:auto;}
 .story-card{min-height:150px}
 .story-card p{font-size:12px}
}
@media(max-width:420px){
 .nav-overlay{left:55%;width:45%;gap:5px}
 .nav-overlay a{font-size:7.5px}
 .stats{grid-template-columns:1fr;}
 .story-grid{grid-template-columns:1fr}
 .story-card{min-height:unset}
}

@page{size:747px 998px;margin:0}
