/*
Theme Name: Cypress Holidays Custom
Theme URI: https://cypressholidays.com/
Author: JAX Creative / R2
Description: Custom static-scene theme for Cypress Holidays.
Version: 1.0.0
Text Domain: cypressholidays
*/

@font-face {
  font-family: "Christmas Comeback";
  src: url("assets/fonts/Christmas-Comeback.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Mountains of Christmas";
  src: url("assets/fonts/MountainsofChristmas-Regular.woff2") format("woff2"),
       url("assets/fonts/MountainsofChristmas-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root{
  --ch-blue:#061a72;
  --ch-red:#9f101e;
  --ch-cream:#fffef8;
  --ch-copy:#161616;
  --ch-content-shadow: 0 0 18px rgba(0,0,0,.35);
}

*{ box-sizing:border-box; }
html, body {
  margin:0;
  padding:0;
  width:100%;
  height:100%;
  background:#02081f;
  overflow:hidden;
}
body {
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ch-copy);
}
body.admin-bar .ch-fullscreen {
  height: calc(100vh - 32px);
  min-height: calc(100vh - 32px);
}
a { color:inherit; }
img { max-width:100%; height:auto; }

.ch-fullscreen{
  height:100vh;
  min-height:100vh;
  width:100vw;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  /* Intentional night-sky surround for the static scene. Keeps side space from feeling like empty bars. */
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.34) 0 1px, transparent 2px),
    radial-gradient(circle at 86% 12%, rgba(255,255,255,.28) 0 1px, transparent 2px),
    radial-gradient(circle at 18% 72%, rgba(255,255,255,.24) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 66%, rgba(255,255,255,.22) 0 1px, transparent 2px),
    radial-gradient(circle at center 38%, #0b54ca 0%, #063293 38%, #020b3a 72%, #00030f 100%);
  background-size: 180px 180px, 240px 240px, 210px 210px, 260px 260px, 100% 100%;
  overflow:hidden;
}

/* Scene aspect-ratio wrapper. This keeps all absolute overlays locked to the artwork. */
.ch-scene{
  position:relative;
  width:min(100vw, calc(100vh * 1.5));
  aspect-ratio: 3 / 2;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:100% 100%;
  overflow:hidden;
}
body.admin-bar .ch-scene{
  width:min(100vw, calc((100vh - 32px) * 1.5));
}
.ch-home-scene{
  background-image:url("assets/images/Desktop/Desktop-Full-Size/CH-JCC-Homepage-Background-Desktop-05262026-1236AM.png");
}
.ch-internal-scene{
  background-image:url("assets/images/Desktop/Desktop-Full-Size/CH-JCC-Internal-Pages-Desktop-05192026-1247AM.png");
}

/* Admin bar is fine, but the public page should feel like an experience. */
.ch-sign{
  position:absolute;
  display:block;
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  text-indent:-9999px;
  overflow:hidden;
  z-index:20;
  transition: transform .12s ease, filter .12s ease;
}
.ch-sign:hover,
.ch-sign:focus{
  transform:scale(1.035);
  filter:brightness(1.08);
  outline:none;
}

/* Homepage signs: larger overlay targets, locked to the scene without scaling the background. */
.ch-home-sign{
  top:1.0%;
  width:17%;
  height:12.5%;
}
.ch-home-sign.meet{ left:2.5%; background-image:url("assets/images/Desktop/Desktop-Homepage-Wooden-Menu-Signs/Desktop-Wooden-Sign-Meet-Us-Homepage.png"); }
.ch-home-sign.christmas{ left:22.0%; background-image:url("assets/images/Desktop/Desktop-Homepage-Wooden-Menu-Signs/Desktop-Wooden-Sign-Christmas-Homepage.png"); }
.ch-home-sign.support{ left:41.5%; background-image:url("assets/images/Desktop/Desktop-Homepage-Wooden-Menu-Signs/Desktop-Wooden-Sign-Support-Us-Homepage.png"); }
.ch-home-sign.faq{ left:61.0%; background-image:url("assets/images/Desktop/Desktop-Homepage-Wooden-Menu-Signs/Desktop-Wooden-Sign-FAQ-Homepage.png"); }
.ch-home-sign.contact{ left:80.5%; background-image:url("assets/images/Desktop/Desktop-Homepage-Wooden-Menu-Signs/Desktop-Wooden-Sign-Contact-Us-Homepage.png"); }

/* Internal desktop signs */
.ch-internal-sign{
  width:14.6%;
  height:13.4%;
}
.ch-left-1{ left:3.9%; top:5.2%; }
.ch-left-2{ left:3.9%; top:22.0%; }
.ch-left-3{ left:3.9%; top:38.9%; }
.ch-left-4{ left:3.9%; top:55.8%; }
.ch-left-5{ left:3.9%; top:72.7%; }
.ch-right-1{ right:3.9%; top:5.2%; }
.ch-right-2{ right:3.9%; top:22.0%; }
.ch-right-3{ right:3.9%; top:38.9%; }
.ch-right-4{ right:3.9%; top:55.8%; }
.ch-right-5{ right:3.9%; top:72.7%; }

.ch-internal-sign.family{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Meet-The-Family-Interior-Pages.png");}
.ch-internal-sign.display{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Christmas-Display-Interior-Pages.png");}
.ch-internal-sign.santa{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Santa-Claus-Interior-Pages.png");}
.ch-internal-sign.contact{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Get-In-Contact-Interior-Pages.png");}
.ch-internal-sign.faq{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-FAQ-Interior-Pages.png");}
.ch-internal-sign.articles{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Holiday-Articles-Interior-Pages.png");}
.ch-internal-sign.how{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-How-We-Do-It-All-Interior-Pages.png");}
.ch-internal-sign.support-display{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Support-the-Display-Interior-Pages.png");}
.ch-internal-sign.carol{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-The-Heart-Of-The-Carol-Interior-Pages.png");}
.ch-internal-sign.northpole{ background-image:url("assets/images/Desktop/Desktop-Interior-Page-Wooden-Menu-Signs/Desktop-Wooden-Sign-Visit-The-North-Pole-Interior-Pages.png");}

/* Content window */
.ch-content-window{
  position:absolute;
  left:23%;
  top:24.2%;
  width:54%;
  height:65.8%;
  background:rgba(255,255,255,.97);
  border:3px solid rgba(170,0,0,.82);
  box-shadow:var(--ch-content-shadow);
  overflow-y:auto;
  padding:clamp(18px, 1.25vw, 50px);
  z-index:10;
}
.ch-content-window::-webkit-scrollbar{ width:12px; }
.ch-content-window::-webkit-scrollbar-thumb{ background:#9f101e; border-radius:8px; border:3px solid #fff; }
.ch-content-window::-webkit-scrollbar-track{ background:#f3f3f3; }

.ch-content-inner{
  font-family:Garamond, "Times New Roman", serif;
  font-size:18px;
  line-height:1.25;
  text-align:justify;
}
.ch-content-inner p{ margin:0 0 .35em; }
.ch-content-inner h1,
.ch-content-inner .ch-heading-1,
.entry-content h1{
  font-family:"Christmas Comeback", serif;
  font-weight:normal;
  color:rgb(255,0,0);
  font-size:48px;
  line-height:1.05;
  margin:0 0 .25em;
  text-align:center;
}
.ch-content-inner h2,
.ch-content-inner .ch-heading-2,
.entry-content h2{
  font-family:"Mountains of Christmas", cursive;
  font-weight:normal;
  color:rgb(255,0,0);
  font-size:48px;
  line-height:1.05;
  margin:.4em 0 .25em;
  text-align:center;
}
.ch-content-inner h3,
.entry-content h3{
  font-family:"Christmas Comeback", serif;
  font-weight:normal;
  color:#000;
  font-size:36px;
  line-height:1.1;
  margin:.45em 0 .25em;
  text-align:center;
}
.ch-content-inner h4,
.entry-content h4{
  font-family:"Mountains of Christmas", cursive;
  font-weight:normal;
  color:#000;
  font-size:36px;
  line-height:1.1;
  margin:.45em 0 .25em;
  text-align:center;
}
.ch-content-inner hr{
  margin:.7em 0;
  border:0;
  border-top:1px solid rgba(0,0,0,.35);
}

.ch-content-inner img{
  display:block;
  max-width:100%;
  height:auto;
  margin:1.25em auto;
}
.ch-content-inner .wp-caption{
  max-width:100%;
  margin:1.25em auto;
  text-align:center;
}
.ch-content-inner .wp-caption-text{
  font-size:15px;
  line-height:1.4;
  color:#555;
  text-align:center;
}

/* Post listing grid inside internal frame */
.ch-post-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(14px, 1.1vw, 32px);
  text-align:left;
}
.ch-post-card{
  display:block;
  text-decoration:none;
  color:#111;
  background:#fff;
  border:1px solid rgba(0,0,0,.18);
  box-shadow:0 2px 8px rgba(0,0,0,.16);
}
.ch-post-card img{
  width:100%;
  aspect-ratio:1300 / 875;
  object-fit:cover;
  display:block;
  margin:0;
}
.ch-post-card-title{
  font-family:Garamond, "Times New Roman", serif;
  font-weight:700;
  color:var(--ch-red);
  font-size:16px;
  line-height:1.1;
  text-align:center;
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
}
.ch-post-card:hover{ transform:translateY(-2px); }

/* Mobile */
.ch-mobile-only{ display:none; }
.ch-desktop-only{ display:block; }

@media (max-width: 767px){
  html, body{ background:#000; }
  .ch-fullscreen{
    height:100dvh;
    min-height:100dvh;
    align-items:center;
    justify-content:center;
  }
  body.admin-bar .ch-fullscreen{ height:100dvh; min-height:100dvh; }
  .ch-desktop-only{ display:none !important; }
  .ch-mobile-only{ display:block; }

  .ch-scene{
    width:min(100vw, calc(100dvh / 2));
    height:auto;
    aspect-ratio:1 / 2;
    background-size:100% 100%;
  }
  body.admin-bar .ch-scene{
    width:min(100vw, calc(100dvh / 2));
    height:auto;
  }
  .ch-home-scene{
    background-image:url("assets/images/Mobile/CH-JCC-Homepage-Mobile-05262026-0117AM.png");
  }
  .ch-internal-scene{
    background-image:url("assets/images/Mobile/CH-JCC-Interior-Pages-Mobile-05262026-0114AM.png");
  }

  .ch-mobile-home-sign{
    left:23%;
    width:54%;
    height:12.5%;
    z-index:20;
  }
  .ch-mobile-home-sign.meet{ top:25.0%; background-image:url("assets/images/Mobile/Mobile-Wooden-Sign-Meet-Us-Homepage.png");}
  .ch-mobile-home-sign.christmas{ top:38.0%; background-image:url("assets/images/Mobile/Mobile-Wooden-Sign-Christmas-Homepage.png");}
  .ch-mobile-home-sign.support{ top:51.0%; background-image:url("assets/images/Mobile/Mobile-Wooden-Sign-Support-Us-Homepage.png");}
  .ch-mobile-home-sign.faq{ top:64.0%; background-image:url("assets/images/Mobile/Mobile-Wooden-Sign-FAQ-Homepage.png");}
  .ch-mobile-home-sign.contact{ top:77.0%; background-image:url("assets/images/Mobile/Mobile-Wooden-Sign-Contact-Us-Homepage.png");}

  .ch-mobile-menu-checkbox{
    position:absolute;
    opacity:0;
    pointer-events:none;
  }
  .ch-mobile-icon-link{
    position:absolute;
    top:6.55%;
    width:5.7%;
    height:2.85%;
    text-indent:-9999px;
    z-index:55;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    cursor:pointer;
  }
  .ch-mobile-icon-link.menu{
    left:5.55%;
    background-image:url("assets/images/Mobile/Menu-Hamburger-Icon.png");
  }
  .ch-mobile-icon-link.email{
    right:5.55%;
    background-image:url("assets/images/Mobile/Email-Icon.png");
  }
  .ch-mobile-menu-panel{
    display:none;
    position:absolute;
    left:10%;
    top:12%;
    width:80%;
    max-height:72%;
    overflow-y:auto;
    z-index:50;
    background:rgba(255,255,255,.97);
    border:2px solid #9f101e;
    box-shadow:0 0 18px rgba(0,0,0,.35);
    padding:14px 16px 16px;
    font-family:"Christmas Comeback", "Mountains of Christmas", serif;
    font-size:24px;
    line-height:1.0;
    text-align:center;
  }
  .ch-mobile-menu-checkbox:checked ~ .ch-mobile-menu-panel{
    display:block;
  }
  .ch-mobile-menu-panel ul{
    list-style:none;
    margin:0;
    padding:0;
  }
  .ch-mobile-menu-panel li{
    margin:0;
    padding:0;
    border-bottom:1px solid rgba(159,16,30,.22);
  }
  .ch-mobile-menu-panel a{
    display:block;
    padding:6px 6px;
    color:#9f101e;
    text-decoration:none;
  }
  .ch-mobile-menu-close{
    display:block;
    margin:10px auto 0;
    padding:6px 12px;
    width:max-content;
    border:1px solid rgba(159,16,30,.45);
    color:#111;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    line-height:1;
    cursor:pointer;
  }

  .ch-content-window{
    left:9.2%;
    top:14.8%;
    width:81.6%;
    height:69.8%;
    padding:24px 22px;
    border:none;
    box-shadow:none;
    background:rgba(255,255,255,.98);
  }
  .ch-content-inner{
    font-size:17px;
    line-height:1.35;
    text-align:left;
  }
  .ch-content-inner h1,
  .ch-content-inner .ch-heading-1,
  .entry-content h1{
    font-size:40px;
  }
  .ch-content-inner h2,
  .ch-content-inner .ch-heading-2,
  .entry-content h2{
    font-size:40px;
  }
  .ch-content-inner h3,
  .entry-content h3{
    font-size:32px;
  }
  .ch-content-inner h4,
  .entry-content h4{
    font-size:32px;
  }
  .ch-post-grid{
    display:block;
  }
  .ch-mobile-post-list{
    list-style:none;
    padding:0;
    margin:0;
    font-family:Garamond, "Times New Roman", serif;
    font-size:20px;
    line-height:1.35;
    text-align:left;
  }
  .ch-mobile-post-list li{
    margin:0;
    border-bottom:1px solid #ddd;
  }
  .ch-mobile-post-list a{
    display:block;
    padding:12px 0;
    color:#111;
    text-decoration:none;
  }
}

@media (min-width:768px) and (max-aspect-ratio: 3/2){
  .ch-fullscreen{ align-items:flex-start; }
}

/* Fallback for normal WordPress blocks inside content */
.aligncenter{ margin-left:auto; margin-right:auto; display:block; }
.alignleft{ float:left; margin:0 1.2em 1em 0; }
.alignright{ float:right; margin:0 0 1em 1.2em; }
.screen-reader-text{ position:absolute; left:-9999px; }
