:root{--ink:#111;--muted:#6b7280;--link:#0a66c2;--pad: clamp(16px, 4vw, 48px)}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.5}
.container{max-width:1200px;margin:0 auto;padding:var(--pad)}
.header{display:flex;align-items:flex-start;gap:40px;flex-wrap:wrap}
h1{font-size:clamp(3rem,6vw,9rem);line-height:.8;margin:10px 0 0 0;font-weight:900}
h1 .ln2{display:block;color: steelblue;}
h1 .ln3{display:block;color: crimson}

.tagline{font-size:1.2rem;margin:12px 10 24px}
.social{display:flex;gap:15px}
.social a img{width:36px;height:36px;border-radius:8px}
.hero-portrait{margin-left:auto;margin-bottom:20px;max-width:360px;width:100%;border-radius:10px;box-shadow:0 10px 10px rgba(0,0,0,.1)}
hr{border:none;border-top:1px solid #e5e7eb;margin:28px 0}
.section-title{font-weight:800;margin:0 0 16px 0}
.videos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media (max-width:500px){.videos{grid-template-columns:1fr} .header{gap:10px}}
.video a{display:block;text-decoration:none;color:inherit}
.video img{width:100%;display:block;border-radius:12px;border:1px solid #e5e7eb}
.video .caption{font-size:.95rem;margin-top:8px}
.video-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem; /* space between videos */
}

.video-container iframe {
  flex: 1 1 400px; /* minimum width 400px, flexible growth */
  max-width: 100%;
  aspect-ratio: 16 / 9; /* keeps them proportional */
  height: auto;
}
.brands{display:flex;flex-direction:column;gap:10px}
.brand-rows{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content: center;  margin-bottom: 5px; ,margin-top: 0px;gap: 1rem;}
.brand-rows img{height:60px;width:auto;background:#fff;border:0px solid #eee;border-radius:0px;padding:7px}
.starbrands{display:flex;flex-direction:column;gap:40px}
.starbrand-rows{display:flex;flex-wrap:wrap;gap:35px;align-items:center  margin-bottom: 10px;}
.starbrand-rows img{height:80px;width:auto;background:#fff;border:0px solid #eee;border-radius:0px;padding:5px}
.footer{padding:40px 0;color:var(--muted);text-align:center}
a{color:var(--link)} a:hover{text-decoration:underline}
.bio{
  margin-top: 40px;
  max-width: 65ch;            /* keeps lines readable */
  color: #333;                 /* a touch darker than the tagline */
  font-size: 1.05rem;
}
.bio p{ margin: 0 0 .45rem }
@media (max-width: 900px){
  .bio{ max-width: 60ch; }     /* roomier on mobile */
}

@media (max-width: 800px){
  .header{ flex-direction: column; }

  /* stacking order on phones: title (0) -> image (1) -> bio (2) */
  .title{ order: 0; }
  .hero-portrait{
    order: 1;
    width: 100%;
    max-width: none;         /* full-bleed width of the content column */
    margin: 16px 0;
  }
  .bio{ order: 2; }
}