/*
Theme Name: Dawnwalker Stripe
Theme URI: https://example.com/
Author: OpenAI
Description: Pixel-matched Dawnwalker landing page with server-side Stripe Checkout integration.
Version: 1.0.0
Text Domain: dawnwalker-stripe
*/
html, body { margin:0; padding:0; background:#08080a; }
* { box-sizing:border-box; }
body { overflow-x:hidden; }
a { color:#e6e2da; text-decoration:none; }
a:hover { color:#d8b26a; }
.dw-stripe-buy { transition:filter .16s ease, transform .16s ease; }
.dw-stripe-buy:hover { filter:brightness(1.12); }
.dw-stripe-buy.is-loading { opacity:.72; pointer-events:none; }
.dw-payment-notice {
  position:fixed; left:50%; top:24px; transform:translateX(-50%);
  z-index:99999; max-width:min(92vw,620px); padding:14px 18px;
  background:#0c0c0f; border:1px solid #6b5a3a; color:#e6e2da;
  font-family:'EB Garamond',Georgia,serif; font-size:16px;
  box-shadow:0 16px 50px rgba(0,0,0,.55);
}
.dw-payment-notice strong { color:#d8b26a; }
/* Responsive foundation */
html { scroll-behavior: smooth; }
body { min-width: 320px; }
img, svg, video, iframe { max-width: 100%; }
button, input, select, textarea { font: inherit; }

.dw-page {
  width: min(100% - 32px, 1180px);
  margin: 0 auto;
  padding: 112px 0 64px;
  color: #e6e2da;
}
.dw-page h1 {
  margin: 0 0 28px;
  font-family: 'Cinzel', serif;
  font-size: clamp(30px, 6vw, 52px);
  font-weight: 500;
  color: #d8b26a;
}
.dw-page .entry-content { font-size: 17px; line-height: 1.65; }
.dw-page input:not([type="checkbox"]):not([type="radio"]),
.dw-page select,
.dw-page textarea {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  color: #f1ece2;
  background: #101014;
  border: 1px solid #5d5039;
  border-radius: 0;
}
.dw-page button,
.dw-page .button,
.dw-page .wp-element-button {
  min-height: 46px;
  padding: 12px 20px !important;
  color: #f6efdf !important;
  background: linear-gradient(180deg,#b58c4a,#8e6a33) !important;
  border: 1px solid #d9b878 !important;
  border-radius: 0 !important;
}
.woocommerce table.shop_table { border-color: #4c4230; }
.woocommerce table.shop_table th,
.woocommerce table.shop_table td { padding: 14px; }
.woocommerce .cart_totals,
.woocommerce-checkout-review-order { color: #e6e2da; }

@media (max-width: 1280px) {
  .dw-canvas { width: 100% !important; max-width: 100% !important; }

  .dw-canvas > header {
    height: 70px !important;
    padding: 0 20px !important;
    background: rgba(6,6,9,.94) !important;
  }
  .dw-canvas > header > a { width: 42px !important; height: 42px !important; }
  .dw-canvas > header > a svg { width: 42px; height: 42px; }
  .dw-canvas > header nav {
    min-width: 0;
    margin-left: 28px !important;
    gap: 24px !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    white-space: nowrap;
  }
  .dw-canvas > header nav::-webkit-scrollbar { display: none; }
  .dw-canvas > header > div:last-child { display: none !important; }

  #top {
    height: auto !important;
    min-height: 590px;
    padding: 0 24px 40px;
    background-position: center top !important;
    background-size: cover !important;
  }
  #top > div:nth-child(2) { padding-top: 105px !important; }
  #top h1 span:first-child { font-size: clamp(26px, 6vw, 40px) !important; }
  #top h1 span:last-child { font-size: clamp(46px, 10vw, 82px) !important; }
  #top > div:nth-child(2) > p { max-width: 680px; }

  #game { padding: 18px 24px 0 !important; }
  #game > div { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  #game article { min-height: 250px; height: auto !important; }

  #preorder { padding: 24px 24px 0 !important; }
  #preorder > div { height: auto !important; min-height: 440px; }
  #preorder > div > div:nth-child(1) {
    width: 50% !important;
    opacity: .5;
  }
  #preorder > div > div:nth-child(2) { width: 68% !important; }
  #preorder > div > div:nth-child(3) {
    right: 12px !important;
    width: 170px !important;
    opacity: .34;
  }
  #preorder > div > div:nth-child(4) {
    padding: 38px 28px 30px !important;
    margin: 0 !important;
  }
}

@media (max-width: 680px) {
  .dw-canvas > header {
    align-items: flex-start !important;
    height: 104px !important;
    padding: 12px 14px 10px !important;
  }
  .dw-canvas > header > a { flex: 0 0 40px !important; }
  .dw-canvas > header nav {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0 !important;
    padding: 10px 14px 13px;
    gap: 24px !important;
    font-size: 11px !important;
    border-top: 1px solid rgba(201,161,90,.22);
  }
  .dw-canvas > header nav a { min-height: 24px; display: inline-flex; align-items: center; }

  #top {
    min-height: 640px;
    padding: 0 16px 36px;
    background-position: 58% top !important;
  }
  #top > div:nth-child(2) { width: 100%; padding-top: 126px !important; }
  #top > div:nth-child(2) > svg { width: 60px; height: 60px; }
  #top h1 { width: 100%; margin-top: 12px !important; }
  #top h1 span:first-child {
    font-size: clamp(22px,7vw,30px) !important;
    letter-spacing: .035em !important;
  }
  #top h1 span:last-child {
    margin-top: 8px !important;
    font-size: clamp(37px,11.3vw,58px) !important;
    letter-spacing: 0 !important;
  }
  #top > div:nth-child(2) > p:nth-of-type(1) {
    margin-top: 18px !important;
    font-size: 14px !important;
    letter-spacing: .08em !important;
    text-align: center;
  }
  #top > div:nth-child(2) > p:nth-of-type(2) {
    margin-top: 18px !important;
    padding: 0 8px;
    font-size: 16px !important;
  }
  #top > div:nth-child(2) > div:last-child {
    flex-direction: column;
    width: 100%;
    max-width: 360px;
    gap: 12px !important;
    margin-top: 24px !important;
    white-space: normal !important;
  }
  #top .dw-stripe-buy,
  #top > div:nth-child(2) > div:last-child > a {
    width: 100% !important;
    min-height: 48px;
  }

  #game { padding: 14px 14px 0 !important; }
  #game > div { grid-template-columns: 1fr !important; gap: 14px !important; }
  #game article {
    min-height: 235px;
    background-position: center !important;
  }
  #game article > div:last-child { padding: 24px 20px !important; }
  #game article p { max-width: 54% !important; font-size: 15px !important; }

  #preorder { padding: 14px 14px 0 !important; }
  #preorder > div { min-height: 530px; }
  #preorder > div > div:nth-child(1) {
    width: 100% !important;
    height: 100%;
    opacity: .18;
    background-position: 30% center !important;
  }
  #preorder > div > div:nth-child(2) {
    width: 100% !important;
    background: linear-gradient(180deg,rgba(8,8,10,.35),#0b0b0d 82%) !important;
  }
  #preorder > div > div:nth-child(3) { display: none; }
  #preorder > div > div:nth-child(4) {
    padding: 34px 16px 26px !important;
  }
  #preorder h2 {
    font-size: clamp(27px,8vw,34px) !important;
    text-align: center;
  }
  #preorder h2 + p {
    max-width: 300px;
    text-align: center;
    line-height: 1.45;
  }
  #preorder h2 + p + div {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr));
    width: 100%;
    max-width: 260px;
    gap: 24px 20px !important;
  }
  #preorder h2 + p + div > div { width: auto !important; }
  #preorder .dw-stripe-buy {
    width: 100% !important;
    max-width: 330px;
    min-height: 48px;
  }

  .dw-page {
    width: min(100% - 28px, 1180px);
    padding-top: 132px;
  }
  .woocommerce .col2-set .col-1,
  .woocommerce .col2-set .col-2 { float: none; width: 100%; }
  .woocommerce table.shop_table_responsive tr td,
  .woocommerce-page table.shop_table_responsive tr td { padding: 12px 10px; }
  .woocommerce-cart table.cart td.actions .coupon {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .woocommerce-cart table.cart td.actions .coupon .input-text,
  .woocommerce-cart table.cart td.actions .coupon .button { width: 100% !important; }
  .woocommerce-checkout #payment { color: #e6e2da; background: #111115; }
}

@media (max-width: 380px) {
  #top h1 span:last-child { font-size: 35px !important; }
  #game article p { max-width: 62% !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}

/* ===== Mobile hardening (added) ===== */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(201,161,90,.18); }
html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
body { min-width: 0; }
/* canvas is NEVER a fixed 1536px: fluid everywhere, capped on huge screens */
.dw-canvas { width: 100% !important; max-width: 1536px !important; }
.dw-canvas img, .dw-canvas iframe, .dw-canvas video { max-width: 100%; }
.dw-canvas a, .dw-canvas button { touch-action: manipulation; }

@media (max-width: 1280px) {
  .dw-canvas > header { padding-left: 20px !important; padding-right: 20px !important; }
  #game, #preorder { padding-left: 24px !important; padding-right: 24px !important; }
  #game article p { max-width: 70% !important; }
  #preorder > div > div:nth-child(4) { margin: 0 !important; padding: 38px 28px 30px !important; align-items: center; }
  #preorder h2 { font-size: clamp(24px, 4vw, 34px) !important; text-align: center; }
  #preorder h2 + p + div { flex-wrap: wrap; justify-content: center; gap: 22px 28px !important; }
  #preorder a[href*="g2a"] { max-width: 100%; }
  #dw-trailer-modal > div { width: min(1000px, 92vw) !important; }
}

@media (max-width: 680px) {
  .dw-canvas > header { padding-top: max(12px, env(safe-area-inset-top)) !important; }
  .dw-canvas > header nav { -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
  .dw-canvas > header nav a { scroll-snap-align: start; flex: 0 0 auto; }
  #top { min-height: 620px; background-size: cover !important; }
  #top h1 span:last-child { word-break: normal; overflow-wrap: anywhere; }
  #top > div:nth-child(2) > div:last-child > a,
  #top > div:nth-child(2) > div:last-child > button { width: 100% !important; max-width: 100%; min-height: 48px; }
  #game article { background-size: cover !important; }
  #preorder a[href*="g2a"] { width: 100% !important; max-width: 330px; }
  #dw-trailer-modal { padding: 12px !important; }
  #dw-trailer-modal button[aria-label] { right: 4px !important; top: -44px !important; }
  .dw-payment-notice { top: max(12px, env(safe-area-inset-top)); font-size: 15px; }
}

@media (max-width: 360px) {
  .dw-canvas > header nav { gap: 18px !important; font-size: 10px !important; }
  #top { padding-left: 12px; padding-right: 12px; }
  #top h1 span:first-child { font-size: 20px !important; }
  #top h1 span:last-child { font-size: 32px !important; }
  #game article p { max-width: 68% !important; font-size: 14px !important; }
  #preorder h2 + p + div { max-width: 240px; gap: 18px 14px !important; }
}

@media (max-height: 480px) and (orientation: landscape) {
  #top { min-height: 520px; }
}