/* Soma Media Works — faithful replica of current somatv.ca skin */
:root{
  --teal:#1f7a8c; --teal-d:#155e6b; --teal-l:#3aa0b3;
  --red:#c0392b; --red-d:#a93226;
  --purple:#5b2c87; --purple-l:#7d4bb0;
  --green:#2e8b57; --green-l:#3fae6e;
  --gold:#d4a017; --yellow:#ffe14d;
  --ink:#222; --muted:#555; --line:#ddd;
  --bg:#f3f1ea; --panel:#ffffff;
  --mint:#bfe3d0; --mint-d:#1c5e4a;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);font-size:14px;line-height:1.5}
a{color:var(--teal-d);text-decoration:none}
a:hover{text-decoration:underline}

/* banner (real image) */
.site-header{background:#1f7a8c;padding:0;line-height:0}
.banner-img{display:block;width:100%;height:auto}

/* top nav */
.topnav{background:#e9e7df;border-bottom:2px solid var(--line)}
.topnav .wrap{max-width:980px;margin:0 auto;display:flex;flex-wrap:wrap}
.topnav a{padding:9px 16px;color:#333;font-weight:bold;border-right:1px solid #d8d6cd}
.topnav a:hover{background:var(--teal);color:#fff;text-decoration:none}

/* layout */
.wrap{max-width:980px;margin:0 auto;padding:0 14px}
.layout{display:flex;gap:18px;align-items:flex-start;padding:16px 0}
.leftcol{width:200px;flex:0 0 200px}
.main{flex:1 1 auto;min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:18px}

/* left sidebar nav */
.sidehead{background:var(--purple);color:#fff;font-weight:bold;padding:7px 10px;border-radius:4px 4px 0 0;font-size:13px}
.sidenav{display:flex;flex-direction:column;margin-bottom:14px}
.sidenav a{background:#efedf5;color:#3a2a55;padding:8px 10px;border:1px solid #d9d2ea;border-top:none;font-size:13px;font-weight:bold}
.sidenav a:first-child{border-top:1px solid #d9d2ea}
.sidenav a:hover,.sidenav a.cur{background:var(--purple-l);color:#fff;text-decoration:none}

/* video tiles */
.vtiles{display:flex;flex-direction:column;gap:10px}
.vtile{position:relative;display:block;border-radius:6px;overflow:hidden;border:1px solid #ccc;aspect-ratio:1/1;background:var(--purple)}
.vtile .img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.85}
.vtile .cap{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.55);color:var(--yellow);font-weight:bold;font-size:12px;padding:5px 7px;text-align:center}
.vtile:hover .cap{background:rgba(0,0,0,.75)}

/* headings */
h1{color:var(--red);font-family:Georgia,serif;font-size:24px;margin:.2em 0 .5em}
h2{color:var(--red);font-size:18px;margin:1em 0 .4em}
h3{color:var(--teal-d);font-size:15px;margin:.8em 0 .3em}
.main p{margin:.4em 0 .8em}
.main ul{margin:.3em 0 1em;padding-left:20px}
.main li{margin:3px 0}

/* category grid (homepage) — split tile: colored label half + photo half */
.catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:10px}
.cat{position:relative;border-radius:8px;overflow:hidden;min-height:120px;color:#fff;display:flex;align-items:stretch;font-weight:bold;font-size:16px;text-decoration:none}
.cat .catphoto{width:58%;background-size:cover;background-position:center;background-color:#ddd}
.cat span{width:42%;display:flex;align-items:center;padding:8px 10px;font-size:18px;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.cat.h{background:linear-gradient(135deg,#19c3d6,#16a6b8)}
.cat.w{background:linear-gradient(135deg,#2f7fd1,#2563b8)}
.cat.b{background:linear-gradient(135deg,#7ac943,#5fae2e)}
.cat.n{background:linear-gradient(135deg,#f0a823,#e08e0b)}
.cat.p{background:linear-gradient(135deg,#f5b82e,#e0a30b)}
.cat.t{background:linear-gradient(135deg,#2e7d4f,#1f6b3f)}
.cat.empty{background:linear-gradient(135deg,#e8f4f7,#d4e9ee);min-height:120px}

/* hero image (homepage main) */
.hero-img{width:100%;height:auto;border-radius:8px;border:1px solid var(--line);margin-top:8px;display:block}
.about-pics{display:flex;gap:12px;margin:.4em 0 1em;flex-wrap:wrap}
.about-pics img{width:46%;max-width:240px;border:1px solid var(--line);border-radius:6px}
/* interactive single-column page */
.centered-page{max-width:760px;margin:14px auto;padding:0 16px}
.pagetitle{text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 0;margin:6px 0 18px}
.appsec{margin:18px 0}
.appsec h3{color:var(--red);margin:.2em 0}
.centerbtn{text-align:center;margin:14px 0}
.greybtn{display:inline-block;background:#e8e8e8;color:#333;border:1px solid #ccc;border-radius:6px;padding:8px 22px;font-weight:bold}
.greybtn:hover{background:#dcdcdc;text-decoration:none}
.vidrow{display:flex;gap:14px;align-items:center;margin:.4em 0 1em}
.vidrow img{width:120px;height:auto;border:1px solid var(--line);border-radius:6px}
.vidrow .meta p{margin:2px 0}
.yt{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:640px;border-radius:6px;margin:8px 0}
.yt iframe{position:absolute;top:0;left:0;width:100%;height:100%}
.vrow .thumb{width:160px;flex:0 0 160px;border-radius:6px;overflow:hidden;border:1px solid #ccc;aspect-ratio:16/10;background:#888;background-size:cover;background-position:center}
.byline{color:#555;font-style:italic;font-size:14px;margin:-4px 0 12px}
.vrow .body{flex:1}
.vrow.alt{background:#eef3f0}
.pagelink{display:inline-block;margin-top:6px;color:var(--teal-d);font-weight:bold}
.vidpending{color:#777;font-style:italic;padding:10px 12px;background:#f3f3f3;border-radius:6px;margin:10px 0}
.morebtn{display:block;width:fit-content;margin-left:auto;background:var(--purple);color:#fff;padding:4px 12px;border-radius:4px;font-size:13px;font-weight:bold;margin-top:4px}
.morebtn:hover{background:var(--purple-l);text-decoration:none}

/* awards */
.award-sec{padding:10px 14px;margin:10px 0;border-radius:6px}
.award-sec.alt{background:#eef3f0}
.award-list{columns:2;column-gap:28px;list-style:none;padding:0;max-width:760px}
.award-list li{break-inside:avoid;margin-bottom:6px;font-size:12px;padding-left:10px;border-left:3px solid var(--gold)}

/* placeholder (planned rebuild) */
.placeholder h1{color:var(--purple)}
.placeholder .note{background:#fff7e6;border:1px solid var(--gold);padding:12px;border-radius:6px;color:#7a5b00}

/* youtube embed */
.yt{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:8px;margin:10px 0;max-width:640px}
.yt iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}

footer.site-footer{background:#e9e7df;border-top:2px solid var(--line);margin-top:18px;padding:12px 0;color:#666;font-size:12px}
footer.site-footer a{color:var(--teal-d)}

/* videos & books cover grid */
.cathead{background:var(--mint);color:var(--mint-d);font-weight:bold;padding:6px 12px;border-radius:4px;margin:18px 0 10px;font-size:15px}
.covgrid{display:flex;flex-wrap:wrap;gap:16px}
.cov{width:90px;text-align:center}
.cov img{width:90px;height:auto;border:1px solid var(--line);border-radius:4px;background:#fff;display:block}
.covcap{margin-top:5px}
.covcap a{color:var(--purple);font-weight:bold;font-size:13px}
.covcap a:hover{text-decoration:underline}

/* left video-thumbnail sidebar */
.vside{display:block;margin-bottom:10px;text-align:center}
.vside img{width:90px;height:auto;border:1px solid var(--line);border-radius:4px;background:#fff;display:block;margin:0 auto}
.vside span{display:block;font-size:12px;color:var(--purple);font-weight:bold;margin-top:3px}
.vnote{font-size:11px;color:var(--muted);margin:6px 0;font-weight:bold}
.vcover{float:right;width:110px;margin:0 0 12px 16px}
.vcover img{width:110px;height:auto;border:1px solid var(--line);border-radius:4px;background:#fff;display:block}
.award-h{background:var(--gold);color:#5a3d00;padding:5px 10px;border-radius:4px;margin:14px 0 8px;font-size:14px}