/* HELLBORN Legacy Styles (DW 19.1 friendly)
   - No CSS Grid, no sticky, no aspect-ratio, no animations/effects
   - Simple floats/blocks so Design view matches live
*/

/* Base */
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#0b0c10;color:#e7e8ea;font-family:Arial,Helvetica,sans-serif}
a{color:#e7e8ea;text-decoration:none}
img{
    max-width: 100%;
    height: auto;
    border: 0;
    padding-top: 10px;
}

/* Layout helpers */
.container{width:1160px;max-width:96%;margin:0 auto;padding:0 10px}
.row:after{content:"";display:block;clear:both}
.left{float:left}
.right{float:right}

/* Header (no sticky/backdrop) */
.hdr{background:#0f1116;border-bottom:1px solid #1b1e26}
.nav{height:64px;line-height:64px}
.brand{float:left}
.logo{display:inline-block;width:36px;height:36px;background:#b3001b;border-radius:8px;vertical-align:middle;margin-right:10px}
.wordmark{display:inline-block;vertical-align:middle;font-weight:bold;letter-spacing:2px}

/* Nav links */
.navlinks{float:left;margin-left:20px}
.navlinks a{display:inline-block;padding:0 10px;color:#b9bcc4}
.navlinks a:hover{color:#ffffff}

/* CTA */
.cta{float:right}
.btn{display:inline-block;padding:10px 14px;margin-left:6px;border-radius:10px;background:#b3001b;font-weight:bold}
.btn.secondary{background:#1b1e26}

/* Hero */
.hero{background:#12060a url('media/hero.jpg') center no-repeat;background-size:cover}
.hero .inner{padding:80px 0;text-align:center}
.kicker{display:inline-block;font-size:12px;color:#a1a5ad;letter-spacing:2px;text-transform:uppercase}
.title{font-size:44px;line-height:1.05;margin:10px 0 10px}
.lead{
    max-width: 760px;
    margin-top: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 30px;
    color: #c9cbd1
}
.badge{display:inline-block;margin-left:8px;padding:6px 10px;border:1px solid #30343f;border-radius:999px;color:#a1a5ad}

/* Sections */
.section{padding:50px 0;border-top:1px solid #1b1e26}
h1,h2,h3{margin:0 0 12px;font-weight:bold}
.muted{color:#a1a5ad}

/* Two-column (float-based) */
.twocol .col{float:left;width:48%}
.twocol .col + .col{float:right}

/* Cards (simple blocks) */
.cards .card{background:#0d0f14;border:1px solid #1b1e26;border-radius:12px;padding:16px;margin:10px 0}

/* Feature list */
.featurelist .feature{border:1px dashed #262a35;border-radius:10px;padding:12px;margin:8px 0}

/* Media block (fixed height iframe) */
.media{border:1px solid #1b1e26;border-radius:12px;background:#0d0f14;padding:8px}
.media iframe{width:100%;height:360px}

/* Gallery (float grid) */
.gallery .shot{float:left;width:32%;height:0;padding-bottom:18%; /* 16:9-ish tile */ margin:0 2% 2% 0;background:#12151c;border:1px solid #1b1e26;border-radius:10px}
.gallery .shot:nth-child(3n){margin-right:0}

/* Timeline (simple list) */
.timeline .titem{background:#0d0f14;border:1px solid #1b1e26;border-radius:10px;padding:12px;margin:12px 0}

/* Footer */
.footer{padding:40px 0;border-top:1px solid #1b1e26}
.cols .col{float:left;width:23%}
.cols .col:first-child{width:31%}
.small{font-size:12px;color:#7f8490}

/* Mobile fallback (very light, DW-friendly) */
@media screen and (max-width:760px){
  .left,.right,.twocol .col,.cols .col,.gallery .shot{float:none;width:100%;margin-right:0}
  .media iframe{height:240px}
  .container{max-width:94%}
}