@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Source+Sans+3:wght@300;400;600;700&display=swap');

:root{
  --vw-surface:  rgba(255,255,255,.03);
  --vw-border:   rgba(255,255,255,.06);
  --vw-border2:  rgba(200,216,236,.15);
  --vw-text:     #e4e4e4;
  --vw-muted:    #3d5a73;
  --vw-dim:      #1e3345;
  --vw-sky:      #c8d8ec;
  --vw-navy:     #1f2d3d;
  --vw-radius:   8px;
  --vw-radius-lg:12px;
  --font-h:'Playfair Display',Georgia,serif;
  --font-b:'Source Sans 3',system-ui,sans-serif;
}

/* =====================================================
   DIVI OVERRIDE
   Fixes edge-to-edge bleed on Divi full-width pages.
   Scoped to .vcs-page only — zero impact on anything
   else on the Vineyard site.
   ===================================================== */

/* Step 1: pull Divi's full-width page back from the edges */
.et_full_width_page #main-content .et_pb_section,
.et_full_width_page #main-content .et_pb_row,
.et_full_width_page #main-content .et_pb_column {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Step 2: give the plugin content breathing room inside Divi */
.et_pb_text_inner > #vcs-watch,
.et_pb_text_inner > .vcs-page,
.et_pb_text_inner > .vcs-latest-widget,
.et_pb_text_inner > .vcs-single {
  max-width: 100%;
  box-sizing: border-box;
}

/* Step 3: override Divi removing padding from its text module */
.et_pb_text_inner {
  overflow: visible;
}



/* PAGE WRAPPER — sits inside theme content area, no bleeding */
.vcs-page{
  background:linear-gradient(180deg,#0d1f33 0%,#091520 35%,#060e16 100%);
  color:var(--vw-text);
  font-family:var(--font-b);
  -webkit-font-smoothing:antialiased;
  border-radius:12px;
  overflow:hidden;
  padding:0 0 60px;
}

.vcs-page a{ text-decoration:none; color:inherit; }
.vcs-page img{ display:block; max-width:100%; }

/* INNER — consistent padding on everything */
.vcs-inner{
  padding:0 52px;
}

/* HERO */
.vcs-hero{
  padding:72px 52px 32px;
  text-align:center;
}
.vcs-eyebrow{
  font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.16em;color:var(--vw-dim);margin-bottom:14px;
}
.vcs-h1{
  font-family:var(--font-h);
  font-size:72px;font-weight:400;color:#fff;
  letter-spacing:-.02em;line-height:1.0;margin-bottom:8px;
}
.vcs-sub{
  font-size:15px;color:var(--vw-muted);
  font-weight:300;margin-bottom:36px;
}

/* SEARCH */
.vcs-search-row{
  display:flex;gap:10px;margin-bottom:18px;
  max-width:680px;margin-left:auto;margin-right:auto;
}
.vcs-search-wrap{
  flex:1;display:flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);
  border-radius:var(--vw-radius);padding:0 16px;
  transition:border-color .2s;
}
.vcs-search-wrap:focus-within{border-color:var(--vw-border2)}
.vcs-search-wrap i{color:var(--vw-dim);font-size:15px}
.vcs-search-input{
  background:transparent;border:none;outline:none;
  color:var(--vw-text);font-size:14px;width:100%;height:46px;
  font-family:var(--font-b);font-weight:300;
}
.vcs-search-input::placeholder{color:#243d52}
.vcs-filter-btn{
  display:flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);
  border-radius:var(--vw-radius);padding:0 18px;
  color:#6a8faa;font-size:13px;font-weight:600;
  cursor:pointer;font-family:var(--font-b);height:46px;
  transition:background .15s;white-space:nowrap;
}
.vcs-filter-btn:hover{background:rgba(255,255,255,.09)}

/* TAGS */
.vcs-tags{
  display:flex;gap:7px;flex-wrap:wrap;
  justify-content:center;
}
.vcs-tag{
  padding:5px 16px;border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:transparent;color:var(--vw-muted);
  font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;
  cursor:pointer;font-family:var(--font-b);transition:all .15s;
}
.vcs-tag.on{background:rgba(20,40,65,.9);border-color:var(--vw-border2);color:var(--vw-sky)}
.vcs-tag:hover:not(.on){border-color:rgba(200,216,236,.12);color:#7a9ab8}

/* SECTION */
.vcs-section{padding:32px 52px 0}
.vcs-section-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:16px}
.vcs-section-label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--vw-sky)}
.vcs-view-all{font-size:12px;color:var(--vw-muted);cursor:pointer;font-weight:600;transition:color .15s;letter-spacing:.04em;text-decoration:none}
.vcs-view-all:hover{color:#7a9ab8}
.vcs-section-empty{font-size:13px;color:var(--vw-dim);font-style:italic;padding:8px 0}

/* SERIES ROW */
.vcs-series-row{display:flex;gap:12px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.vcs-series-row::-webkit-scrollbar{display:none}
.vcs-series-card{flex:0 0 160px;border-radius:var(--vw-radius);overflow:hidden;border:1px solid var(--vw-border);cursor:pointer;transition:transform .2s;text-decoration:none}
.vcs-series-card:hover{transform:scale(1.04)}
.vcs-series-art{width:160px;height:92px;background:#0d2a4a;display:flex;align-items:center;justify-content:center;overflow:hidden}
.vcs-series-art img{width:100%;height:100%;object-fit:cover}
.vcs-series-art span{font-family:var(--font-h);font-size:13px;color:rgba(255,255,255,.65);text-align:center;padding:10px;line-height:1.3}
.vcs-series-foot{background:rgba(0,0,0,.5);padding:8px 10px}
.vcs-series-name{font-size:11px;font-weight:600;color:#b0c4d8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vcs-series-count{font-size:10px;color:var(--vw-dim);margin-top:2px}

/* RULE + RESULTS */
.vcs-rule{height:1px;background:rgba(255,255,255,.05);margin:32px 52px 0}
.vcs-results-bar{padding:14px 52px 0;font-size:10px;color:var(--vw-dim);text-transform:uppercase;letter-spacing:.1em;font-weight:700}

/* GRIDS */
.vcs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:14px 52px 0}
.vcs-sec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

/* CARD */
.vcs-card{display:block;cursor:pointer;border-radius:var(--vw-radius);overflow:hidden;background:var(--vw-surface);border:1px solid var(--vw-border);transition:border-color .2s,transform .2s,background .2s;text-decoration:none}
.vcs-card:hover{border-color:var(--vw-border2);transform:translateY(-3px);background:rgba(255,255,255,.05)}
.vcs-card-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0a1e30}
.vcs-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.vcs-card:hover .vcs-card-thumb img{transform:scale(1.04)}
.vcs-thumb-ph{width:100%;height:100%;background:linear-gradient(135deg,#0d1f33,#1a3a5a)}
.vcs-card-overlay{position:absolute;inset:0;background:rgba(0,0,0,0);display:flex;align-items:center;justify-content:center;transition:background .2s}
.vcs-card:hover .vcs-card-overlay{background:rgba(0,0,0,.42)}
.vcs-play-circle{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.15);border:1.5px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}
.vcs-card:hover .vcs-play-circle{opacity:1}
.vcs-play-circle i{font-size:12px;color:#fff;margin-left:2px}
.vcs-card-body{padding:10px 12px 14px}
.vcs-card-series{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--vw-dim);margin-bottom:3px}
.vcs-card-title{font-size:13px;font-weight:600;color:#c8c8c8;line-height:1.35}
.vcs-latest-badge{position:absolute;top:8px;left:8px;background:var(--vw-sky);color:var(--vw-navy);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:3px 9px;border-radius:20px}

/* EMPTY */
.vcs-empty{padding:40px 52px;text-align:center;color:var(--vw-muted);font-size:14px}

/* SINGLE PAGE */
.vcs-single-hero{padding:48px 52px 36px}
.vcs-single-inner{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start}
.vcs-video-ratio{position:relative;width:100%;padding-bottom:56.25%;border-radius:var(--vw-radius-lg);overflow:hidden}
.vcs-video-ratio iframe{position:absolute;inset:0;width:100%;height:100%;border:none}
.vcs-single-info{display:flex;flex-direction:column;gap:14px;padding-top:4px}
.vcs-single-meta-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.vcs-series-badge{display:inline-flex;align-items:center;background:rgba(20,40,65,.9);color:var(--vw-sky);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:5px 13px;border-radius:20px;border:1px solid var(--vw-border2);text-decoration:none;transition:background .15s}
.vcs-series-badge:hover{background:rgba(30,55,90,.9)}
.vcs-single-title{font-family:var(--font-h);font-size:28px;font-weight:400;color:#fff;line-height:1.2}
.vcs-single-desc{font-size:14px;color:var(--vw-muted);line-height:1.7;border-top:1px solid var(--vw-border);padding-top:14px}
.vcs-share{border-top:1px solid var(--vw-border);padding-top:14px}
.vcs-share-label{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--vw-dim);margin-bottom:10px}
.vcs-share-btns{display:flex;gap:7px;flex-wrap:wrap}
.vcs-sbtn{display:inline-flex;align-items:center;gap:5px;padding:7px 13px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:transparent;color:#8aafc8;font-size:12px;font-weight:600;cursor:pointer;font-family:var(--font-b);text-decoration:none;transition:background .15s,border-color .15s}
.vcs-sbtn:hover{background:rgba(255,255,255,.07);border-color:var(--vw-border2)}
.vcs-sbtn i{font-size:14px}
.vcs-single-nav{display:flex;gap:12px;justify-content:space-between;border-top:1px solid var(--vw-border);padding-top:14px}
.vcs-nav-link{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--vw-muted);font-weight:600;cursor:pointer;transition:color .15s;text-decoration:none}
.vcs-nav-link:hover{color:var(--vw-sky)}
.vcs-more{padding:28px 52px 40px}
.vcs-more-label{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--vw-sky);margin-bottom:14px}
.vcs-more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

/* LATEST WIDGET */
.vcs-latest-widget{width:100%}
.vcs-latest-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--vw-border);border-radius:var(--vw-radius-lg);overflow:hidden;background:rgba(255,255,255,.02)}
.vcs-latest-thumb{position:relative;display:block;background:#0a1e30;overflow:hidden;min-height:220px}
.vcs-latest-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.vcs-latest-thumb:hover img{transform:scale(1.03)}
.vcs-play-lg{width:48px;height:48px}
.vcs-play-lg i{font-size:18px}
.vcs-latest-info{padding:32px 36px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.vcs-latest-title{font-family:var(--font-h);font-size:24px;font-weight:400;color:#fff;line-height:1.25}
.vcs-latest-title a{color:inherit;text-decoration:none;transition:color .15s}
.vcs-latest-title a:hover{color:var(--vw-sky)}
.vcs-latest-desc{font-size:14px;color:var(--vw-muted);line-height:1.7;border-top:1px solid var(--vw-border);padding-top:12px}
.vcs-latest-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* BUTTONS */
.vcs-btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 24px;border-radius:40px;background:var(--vw-navy);color:#fff !important;font-family:var(--font-b);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;border:1px solid rgba(255,255,255,.1);text-decoration:none;transition:background .2s,transform .15s}
.vcs-btn:hover{background:#2a4a6e;transform:translateY(-1px)}
.vcs-btn-ghost{display:inline-flex;align-items:center;padding:11px 24px;border-radius:40px;background:transparent;color:#8aafc8 !important;font-family:var(--font-b);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;border:1px solid rgba(255,255,255,.1);text-decoration:none;transition:background .15s,transform .15s}
.vcs-btn-ghost:hover{background:rgba(255,255,255,.05);transform:translateY(-1px)}

.vcs-notice{font-size:14px;color:var(--vw-muted);padding:12px;border:1px solid var(--vw-border);border-radius:var(--vw-radius)}

/* RESPONSIVE */
@media(max-width:1000px){
  .vcs-grid{grid-template-columns:repeat(3,1fr)}
  .vcs-single-inner{grid-template-columns:1fr}
  .vcs-latest-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
  .vcs-hero,.vcs-section,.vcs-rule,.vcs-results-bar,.vcs-grid,.vcs-empty,.vcs-single-hero,.vcs-more{padding-left:24px;padding-right:24px}
  .vcs-h1{font-size:48px}
  .vcs-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:480px){
  .vcs-h1{font-size:36px}
  .vcs-grid,.vcs-sec-grid,.vcs-more-grid{grid-template-columns:1fr}
  .vcs-single-inner{gap:20px}
}