/* Tommy Johnagin visual skin: the SWP Base framework owns all layout widths and grids.
   This file intentionally never sets --swp-site-max-width or overrides SWP video grids. */
:root {
  --swp-color-primary: #259cc9;
  --swp-color-primary-dark: #1c397b;
  --swp-color-header: #203b7d;
  --swp-color-footer: #203b7d;
}
body { background: #f5f5f1 url("images/white_background.jpg") repeat; color:#1d1d1d; }
.page-wrap, .tommy-main, .tommy-main > .swp-site-container { background:transparent; }
a { color:#208fc0; }
a:hover { color:#16367a; }

/* SWP is responsible for the desktop header layout and the mobile menu mechanics. */
.site-header { background:#203b7d url("images/menu_blue_background.jpg") repeat; border:0; }
.site-header .site-title, .site-header .site-title a { color:#fff; text-decoration:none; }
.site-header .site-menu a { color:#fff; text-transform:uppercase; font-weight:800; }
.site-header .site-menu a:hover, .site-header .site-menu a:focus-visible { color:#50bce5; }

/* SWP Tools Home Hero remains the source of truth when enabled. */
.tommy-home .swp-home-header { margin-bottom:0; background:transparent; }
.tommy-home .swp-home-hero--single .swp-home-hero__image { object-fit:contain; }
.tommy-masthead { display:grid;place-items:center;min-height:290px;background:#f4f4f0 url("images/header_background_white.png") center bottom/cover no-repeat; }
.tommy-masthead__inner { width:min(90%,850px);margin:20px auto 45px;text-align:center; }
.tommy-masthead img { display:block;width:min(100%,650px);height:auto;margin:auto; }
/* No legacy pseudo-element at the hero/video seam. */
.tommy-home .swp-home-header::after,.tommy-masthead::after { content:none;display:none; }

/* Video band breaks out to viewport width, but its CONTENT uses the framework container. */
.tommy-home-content .tommy-featured-video,
.tommy-home-content .tommy-video-torn {
  width:100vw;max-width:100vw;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  box-sizing:border-box;
}
.tommy-home-content .tommy-featured-video {
  position:relative;isolation:isolate;
  background:#203b7d url("images/menu_blue_background.jpg") repeat;
  color:#fff;
  padding:clamp(14px,2.5vw,36px) var(--swp-site-gutter,24px) clamp(20px,3vw,42px);
  margin-top:0;
}
.tommy-video-wrap,.tommy-video-content {width:100%;min-width:0;margin-inline:auto;}
.tommy-video-wrap {max-width:var(--swp-site-max-width,1280px);text-align:center;}
.tommy-video-content .swp-artist-videos {max-width:var(--swp-site-max-width,1280px);}
/* The banner/link is regular editable content, not theme-generated markup. */
.tommy-video-content > p:first-child {margin-top:0;}
.tommy-video-content > p > a:has(img) {display:block;line-height:0;}
.tommy-video-content > p > a > img {display:block;width:100%;height:auto;}
.tommy-video-content iframe {max-width:100%;}

/* Masked blue texture above and below the video band; white paper shows through. */
.tommy-home-content .tommy-featured-video::before {
  content:"";display:block;position:absolute;left:0;right:0;top:-39px;height:42px;
  background:#203b7d url("images/menu_blue_background.jpg") center top repeat;
  -webkit-mask:url("images/tommy-tear-top.svg") center/100% 100% no-repeat;
  mask:url("images/tommy-tear-top.svg") center/100% 100% no-repeat;
  pointer-events:none;z-index:0;
}
.tommy-video-wrap {position:relative;z-index:1;}
.tommy-home-content .tommy-video-torn {height:42px;margin-top:-1px;position:relative;}
.tommy-home-content .tommy-video-torn::before {
  content:"";display:block;position:absolute;inset:0;
  background:#203b7d url("images/menu_blue_background.jpg") center top repeat;
  -webkit-mask:url("images/tommy-tear-bottom.svg") center/100% 100% no-repeat;
  mask:url("images/tommy-tear-bottom.svg") center/100% 100% no-repeat;
  pointer-events:none;
}

/* Page editor content and embedded players keep their normal SWP widths. */
.tommy-home-content img {max-width:100%;height:auto;}
.tommy-home-content .entry {overflow-wrap:anywhere;}
.tommy-home-content .entry iframe {max-width:100%;}
.tommy-home-content h2 {color:#249bc9;text-transform:uppercase;font-weight:900;font-style:italic;letter-spacing:-.025em;}
.tommy-main {padding-top:0;}
.tommy-home-article .entry > p:first-child {margin-top:0;}
.site-footer {background:#203b7d url("images/menu_blue_background.jpg") repeat;color:#fff;}
.site-footer a,.site-footer p,.site-footer span {color:#fff;}
.site-footer a:hover {color:#65c7f0;}

@media(max-width:900px) {
  .site-header .site-menu-toggle,.site-header .site-menu-toggle:hover,
  .site-header .site-menu-toggle:focus,.site-header .site-menu-toggle.is-open {color:#fff;}
  .site-navigation,.site-navigation.is-open,.site-navigation.mobile-menu-open {
    background:#203b7d url("images/menu_blue_background.jpg") repeat;
  }
  .site-navigation .site-menu a,.site-navigation .site-menu .sub-menu a,
  .site-navigation .swp-mobile-menu-header a,.site-navigation .swp-mobile-menu-footer a {color:#fff;}
  .site-navigation .swp-mobile-menu-header a {font-size:clamp(16px,4vw,23px);white-space:nowrap;}
  .site-header .site-title,.site-header .site-title a {white-space:nowrap;font-size:clamp(12px,3.3vw,20px);}
  .site-branding {min-width:0;max-width:calc(100% - 65px);}
  .tommy-masthead {min-height:220px;}
  .tommy-home-content .tommy-featured-video::before {top:-35px;height:38px;}
  .tommy-home-content .tommy-video-torn {height:38px;}
}
@media(max-width:600px) {
  .tommy-masthead {min-height:190px;}
  .tommy-masthead__inner {margin:12px auto 30px;}
  .tommy-home-content .tommy-featured-video::before {top:-27px;height:30px;}
  .tommy-home-content .tommy-video-torn {height:30px;}
}

/* 2026-10-13: Keep the original paper texture visible through SVG tear masks.
   The SVGs only determine the silhouette of the blue section; the paper is
   supplied by the surfaces behind the transparent portions. */
.tommy-home .tommy-main {
  background-color: #f5f5f1;
  background-image: url("images/white_background.jpg");
  background-repeat: repeat;
  background-size: auto;
}
.tommy-home .tommy-home-content,
.tommy-home .tommy-home-article,
.tommy-home .tommy-home-article > .entry {
  background: transparent;
}
.tommy-home .swp-home-header {
  background-color: #f5f5f1;
  background-image: url("images/white_background.jpg");
  background-repeat: repeat;
  background-size: auto;
}
.tommy-home-content .tommy-video-torn {
  /* The unmasked section must be textured paper, never a flat white strip. */
  background-color: #f5f5f1;
  background-image: url("images/white_background.jpg");
  background-repeat: repeat;
  background-size: auto;
}
