:root{
  --navy:#081224;
  --navy-2:#101d37;
  --blue:#1498ff;
  --orange:#ff5b2c;
  --white:#ffffff;
  --muted:#a8b3c5;
  --grid:#263754;
}
*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{margin:0;background:var(--navy);color:var(--white);font-family:Arial,Helvetica,sans-serif;line-height:1.35}

a{color:inherit}

.header {
  height: 147px;
  background: var(--header);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 70px;
}
.brand { display: flex; align-items: center; gap: 14px; }
.brand-mark {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.brand-mark img { width: 78px; height: auto; }
.brand-name { font-size: 28px; font-weight: 700; line-height: 25px; font-style: italic; }
.brand-name span { color: #1997e8; }
.brand-name strong { color: var(--orange); }
.brand-slogan { margin-top: 3px; font-size: 13px; font-weight: 700; font-style: italic; color: #fff; }
.brand-slogan.orange { color: var(--orange); }
.header-note { font-size: 11px; color: #a8b1c1; white-space: nowrap; }

.brand-wrap{display:flex;align-items:center;gap:12px}.brand-badge{width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden}.brand-badge img{width:36px;height:36px;object-fit:contain}.brand-copy{line-height:1}.brand-name{font-size:28px;font-weight:800;letter-spacing:-.7px}.brand-name span{color:var(--blue)}.brand-name strong{color:var(--orange)}.tagline{margin-top:4px;font-size:11px;font-weight:700;color:#fff;letter-spacing:.1px}

.top-meta{font-size:11px;color:var(--muted);text-align:right}

main{max-width:1152px;margin:0 auto}
.slide{padding:64px 48px 58px;min-height:920px}.slide h1{margin:0 0 12px;font-size:40px;line-height:1.05;letter-spacing:.2px; margin-top: -25px;}.slide h2{margin:26px 0 16px;color:var(--blue);font-size:26px;line-height:1.1}.slide h3{margin:0;font-size:17px;line-height:1.15}.slide p{margin:10px 0 0;font-size:15px}


.value-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--grid);margin-top:20px}.value-strip article{padding:14px 14px 16px;min-height:112px;border-right:1px solid var(--grid)}.value-strip article:last-child{border-right:0}.value-strip h3{color:var(--orange);font-size:15px}.value-strip p{font-size:13.5px;margin-top:12px}

.feature-box,.card,.operation-table>div,.highlight-box,.closing-box,.contact-box,.important-box{background:var(--navy-2);border:1px solid var(--grid)}.feature-box{padding:20px 24px;margin-bottom:18px;border-left:5px solid var(--blue)}.feature-box p{max-width:960px}

.steps{display:grid;gap:12px}.step{display:grid;grid-template-columns:82px 1fr;align-items:stretch;background:var(--navy-2);border:1px solid var(--grid)}.step .num{display:grid;place-items:center;border-right:1px solid var(--grid);font-size:26px;font-weight:800;color:var(--orange)}.step>div:last-child{padding:12px 15px}.step p{margin-top:7px}

.photo-collage { position: relative; height: 500px; margin-top: 100px; }
.hero-photo { position: absolute; width: 610px; left: 126px; top: 0; }
.shirt { position: absolute; width: 210px; left: 57px; top: -40px; z-index: 3; }

h2 {
  margin-top: 80px !important;
}

.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.card{padding:18px 20px;min-height:132px;border-left:5px solid var(--orange)}.card h3{font-size:17px}.card p{font-size:13.5px}

.important-box{margin:24px 0 8px;padding:14px 16px;color:var(--muted);font-size:12.5px}.important-box strong{color:var(--orange)}
.operation-table{display:grid;gap:10px}

.operation-table>div{display:grid;grid-template-columns:38% 62%;padding:14px 16px;font-size:13.5px}.operation-table strong{padding-right:16px;border-right:1px solid var(--grid)}.operation-table span{padding-left:16px}.closing-box{border:2px solid var(--blue);padding:18px 22px;margin-top:28px}.closing-box h3,.highlight-box h3,.contact-box h3{color:var(--orange)}.closing-box p{margin-top:6px}

.checklist{display:grid;gap:10px;margin-top:18px}.checklist div{background:var(--navy-2);border:1px solid var(--grid);padding:17px 18px 17px 48px;position:relative;font-size:14px}.checklist div::before{content:"";width:9px;height:9px;background:var(--orange);position:absolute;left:18px;top:24px}

.highlight-box{border:2px solid var(--blue);padding:20px 22px}.highlight-box p{max-width:920px}

.flow{font-size:18px;font-weight:800;margin-top:6px}.flow span{color:var(--blue);padding:0 5px}

.contact-box{border:2px solid var(--blue);display:grid;grid-template-columns:1fr 1fr;gap:30px;padding:22px 24px;margin-top:26px}.contact-box h3{font-size:16px}.contact-box p{font-size:14px;margin-top:9px}.contact-box a{text-decoration:none}.contact-box a:hover{text-decoration:underline}

footer{max-width:1152px;margin:0 auto;padding:0 48px 32px;color:var(--muted);font-size:11px}footer span{float:right;color:var(--muted)}

@media(min-width:820px){
  .photo-collage { height: 500px !important; }
}

@media(max-width:820px){
  .header { height: auto; min-height: 110px; padding: 22px 24px; align-items: flex-start; }
  .header-note { display: none; }
  .brand-name { font-size: 23px; }
  .brand-slogan { font-size: 10px; }

  .topbar{padding:15px 20px;align-items:flex-start}
  .top-meta{display:none}

  .slide{padding:42px 20px;min-height:auto}
  .slide h1{font-size:32px}
  .slide h2{font-size:22px}

  .value-strip,.cards{grid-template-columns:1fr}
  .value-strip article{border-right:0;border-bottom:1px solid var(--grid)}
  .value-strip article:last-child{border-bottom:0}

  .step{grid-template-columns:66px 1fr}
  .step p, .card p, .operation-table>div, .checklist div, .contact-box p{font-size:13px}
  
  .operation-table>div{grid-template-columns:1fr}.operation-table strong{border-right:0;border-bottom:1px solid var(--grid);padding:0 0 10px}
  .operation-table span{padding:10px 0 0}
  
  .contact-box{grid-template-columns:1fr;gap:18px}
  
  .hero-frame{width:100%}
  .flow{font-size:15px}
  
  footer{padding:0 20px 24px}
  footer span{float:none;display:block;margin-top:5px}
  .brand-name{font-size:23px}
  .tagline{font-size:9px}}
  
  .photo-collage { height: 310px; }
  .hero-photo { width: 58%; left: 12%; }
  .shirt { width: 20%; left: 5%; }

  .h2-nomargim {margin-top: 35px !important;}

@media print{body{background:var(--navy)}.topbar{position:static}.slide{break-after:page;min-height:100vh}a{color:inherit}.slide h1{font-size:32px}.slide h2{font-size:21px}}