/*
Theme Name: Neve Child
Template: neve
*/
body {
  background: #fff; /* example */
}


/* =========================
   Global Variables
   ========================= */

:root {
    --container-width: 970px;

  /* NEVE PALETTE (from Elementor kit) */
  --color-primary: #01257D;
  --color-secondary: #0134B0;
  --color-accent: #F0AB00;
  --color-accent-hover: #D19911;
  --color-text: #0A1828;
  --color-muted: #8D8D8D;
  --color-bg-light: #FAFAFA;
  --color-bg-mid: #EEEEEE;
  --color-bg-dark: #FFFFFF;
  --color-bg-overlay: #121212AB;
  --color-bg-shadow: #0000001A;

  /* BUTTONS */
  --color-btn-bg: #F0AB00;
  --color-btn-text: #FFFFFF;
  --color-btn-hover-bg: #F0AB00;
  --color-btn-hover-text: #FFFFFF;

  /* SHADOWS */
  --shadow-1: 2px 4px 4px 0px rgba(0,0,0,0.15);
  --shadow-2: 0px 4px 16px 0px rgba(0,0,0,0.15);
  --shadow-3: 0px 20px 20px 0px rgba(0,0,0,0.15);
  --shadow-4: 0px 30px 55px 0px rgba(0,0,0,0.15);
  --shadow-5: 0px 80px 80px 0px rgba(0,0,0,0.10);

  /* TYPOGRAPHY */
  --font-family-base: "Raleway", "Inter";
  --font-family-heading: "Cinzel", serif;
  --font-family-alt: "Raleway", sans-serif;
  --font-family-bold: "nexa bold", "Poppins", Arial, sans-serif;
  --font-size-base: clamp(1rem, 1vw + 0.9rem, 1.125rem);
  --font-size-h1: clamp(1.34rem, 3.3vw + 0.67rem, 1.74rem);
  --font-size-h2: clamp(1.4rem, 2vw + 0.8rem, 1.7rem);
  --font-size-h3: clamp(1.15rem, 1vw + 0.8rem, 1.4rem);
  --font-size-h4: clamp(1.05rem, 0.75vw + 0.7rem, 1.2rem);
  --font-size-h5: clamp(1rem, 0.65vw + 0.65rem, 1.1rem);
  --font-size-h6: clamp(0.95rem, 0.45vw + 0.5rem, 1rem);

  --font-weight-bold: 700;
  --font-weight-semi-bold: 600;
  --font-weight-normal: 400;
  --letter-spacing-wide: 0.1rem;

  /* LINE HEIGHTS */
  --line-height-base: 1.6;
  --line-height-heading: 1.15;
  --line-height-alt: 1.3em;

  /* BORDER */
  --border-radius-base: 6px;
  --border-radius-btn: 6px;
  --input-bg: #EEEEEE;
  --input-border: #000;

  /* SPACING */
  --padding-xs: 0.5rem;
  --padding-sm: 1.4rem;
  --padding-md: 2rem;
  --padding-lg: 4rem;

  --space-xsm: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-xl: 2.5rem;
}


/* =========================
   Base Styles & Resets
   ========================= */

html {
  font-size: var(--font-size-base);
  background-color: var(--color-bg-light);
  color: var(--color-text);
  header a.neve-skip-link {display: none; }
}

body {
  font-family: var(--font-family-base);
  line-height: var(--line-height-base);
  font-size: var(--font-size-base);     /* Ensures override */
}

/* Headings */
h1 {
  color: var(--color-primary);
  font-family: var(--font-family-heading);
  font-size: var(--font-size-h1);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-heading);
  letter-spacing: var(--letter-spacing-wide);
  text-transform: uppercase;
}
h2 {
  color: var(--color-primary);
  font-family: var(--font-family-bold);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-semi-bold);
  line-height: var(--line-height-heading);
  letter-spacing: var(--letter-spacing-wide);
  text-transform: uppercase;
}
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }
h5 { font-size: var(--font-size-h5); }
h6 { font-size: var(--font-size-h6); }

/* Paragraphs, Links */
p {
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
}
a, a:visited {
  color: var(--color-accent);
  transition: color 0.2s;
}
a:hover {
  color: var(--color-accent-hover);
}

/* =========================
   Buttons
   ========================= */

button,
input[type="button"],
input[type="submit"],
.elementor-button {
  background-color: var(--color-btn-bg);
  color: var(--color-btn-text);
  font-family: var(--font-family-bold);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semi-bold);
  line-height: var(--line-height-alt);
  border: solid 2px var(--color-btn-bg);
  border-radius: var(--border-radius-btn);
  padding: 0.75em 1.5em;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.elementor-button:hover {
  background-color: var(--color-btn-hover-bg);
  color: var(--color-btn-hover-text);
  border-radius: var(--border-radius-btn);
}



/* =========================
   Forms & Fields
   ========================= */

input,
textarea,
select {
  background-color: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--border-radius-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-alt);
}
label {
  font-size: 18px;
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-alt);
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--color-primary);
}


/* =========================
   Containers & Layout
   ========================= */

.flex { display: flex; }

.container, main#content {
  margin: 0 auto;
  padding: 0 var(--padding-md);
}

.container-spacer-small { height: var(--padding-xs); }
.container-spacer-medium { height: var(--padding-md); }
.container-spacer-large { height: 11.5rem; }

/* OLD WAY */
#page-header #post-info ul li, #page-header #breadcrumbs #breadcrumbs, #page-header #breadcrumbs #breadcrumbs a {
    font-size: 1.2rem;
}

.section--container {
  max-width: 970px;
  margin: 0 auto;
  /*padding: 0 1.5rem; */
}

.section {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.section--bg-primary {
  background: var(--color-bg-mid);
}

.section--bg-accent {
  background: var(--accent-bg, #232017);
  color: #fff;
}

.section--bg-dark {
  background: #222;
  color: #fff;
}

.section--bg-image {
  background: url('/path/to/image.jpg') center/cover no-repeat;
  color: #fff;
}

.section--pad-xsm { padding-top: var(--space-xsm);    padding-bottom: var(--space-xsm);}
.section--pad-sm { padding-top: var(--space-sm);    padding-bottom: var(--space-sm);}
.section--pad-md { padding-top: var(--space-md);    padding-bottom: var(--space-md);}
.section--pad-lg { padding-top: var(--space-lg);    padding-bottom: var(--space-lg);}
.section--pad-xl { padding-top: var(--space-xl);    padding-bottom: var(--space-xl);}

/* Section Margins */
.mt-none    { margin-top: 0 !important; }
.mt-sm      { margin-top: 1rem !important; }
.mt-md      { margin-top: 2rem !important; }
.mt-lg      { margin-top: 4rem !important; }
.mt-xl      { margin-top: 6rem !important; }

.mb-none    { margin-bottom: 0 !important; }
.mb-sm      { margin-bottom: 1rem !important; }
.mb-md      { margin-bottom: 2rem !important; }
.mb-lg      { margin-bottom: 4rem !important; }
.mb-xl      { margin-bottom: 6rem !important; }

.mx-auto    { margin-left: auto !important; margin-right: auto !important; }
.my-lg      { margin-top: 4rem !important; margin-bottom: 4rem !important; }

/* SPACERS */
.spacer-xsm  { height: var(--space-xsm);  width: 100%; display: block; }
.spacer-sm  { height: var(--space-sm);  width: 100%; display: block; }
.spacer-md  { height: var(--space-md);  width: 100%; display: block; }
.spacer-lg  { height: var(--space-lg);  width: 100%; display: block; }
.spacer-xl  { height: var(--space-xl);  width: 100%; display: block; }

/* If you want horizontal spacers, e.g. for flex layouts: */
.spacer-x-sm  { width: var(--space-sm);  height: 1px; display: inline-block; }
.spacer-x-md  { width: var(--space-md);  height: 1px; display: inline-block; }
/* ...and so on */

/* Generic gap utility (both directions) */
.gap-sm  { gap: var(--space-sm); }
.gap-md  { gap: var(--space-md); }
.gap-lg  { gap: var(--space-lg); }
.gap-xl  { gap: var(--space-xl); }

/* Only horizontal gap (gap between columns, e.g. in flex row) */
.gap-x-sm  { column-gap: var(--space-sm); }
.gap-x-md  { column-gap: var(--space-md); }
.gap-x-lg  { column-gap: var(--space-lg); }
.gap-x-xl  { column-gap: var(--space-xl); }

/* Only vertical gap (gap between rows, e.g. in flex column/grid) */
.gap-y-sm  { row-gap: var(--space-sm); }
.gap-y-md  { row-gap: var(--space-md); }
.gap-y-lg  { row-gap: var(--space-lg); }
.gap-y-xl  { row-gap: var(--space-xl); }


/* Section Borders */
.border        { border: 1px solid var(--border-color, #dfdfdf) !important; }
.border-top    { border-top: 2px solid var(--border-color, #dfdfdf) !important; }
.border-bottom { border-bottom: 2px solid var(--border-color, #dfdfdf) !important; }
.border-none   { border: none !important; }

/* Border colors */
.border-accent { border-color: var(--accent, #C50C19) !important; }
.border-dark   { border-color: #222 !important; }
.border-light  { border-color: #fff !important; }

/* Border radius */
.rounded       { border-radius: 12px !important; }
.rounded-lg    { border-radius: 24px !important; }
.rounded-full  { border-radius: 999px !important; }

/* =========================
   Common Blocks & Reusable UI
   ========================= */

.share-links {
  display: flex;
  gap: 1em;
}

.heading-title {
  font-family: var(--font-heading);
  color: var(--color-primary);
}


/* =========================
   Shadows and Cards
   ========================= */

.card-shadow-1 { box-shadow: var(--shadow-1); }
.card-shadow-2 { box-shadow: var(--shadow-2); }
.card-shadow-3 { box-shadow: var(--shadow-3); }
.card-shadow-4 { box-shadow: var(--shadow-4); }
.card-shadow-5 { box-shadow: var(--shadow-5); }


/* =========================
   Responsive Typography
   ========================= */

@media (max-width: 1024px) {
  :root {
    --font-size-base: 16px;
    --font-size-h1: 2rem;
    --font-size-h2: 1.5rem;
  }
}
@media (max-width: 767px) {
  :root {
    --font-size-base: 15px;
    --font-size-h1: 1.5rem;
    --font-size-h2: 1.2rem;
  }
}



/* =========================
   Utility Classes
   ========================= */

.text-muted { color: var(--color-muted); }
.bg-light { background-color: var(--color-bg-light); }
.bg-dark { background-color: var(--color-bg-dark); }
.rounded { border-radius: var(--border-radius-base); }

/* Overline style */
.sk-overline {
  font-weight: var(--font-weight-semi-bold);
  text-transform: uppercase;
}


/* =========================
   Custom Fonts
   ========================= */

@font-face {
  font-family: 'nexa bold';
  src: url('https://dev.dragonloretours.com/wp-content/uploads/2024/10/Nexa-Bold.ttf') format('truetype'); 
  font-display: auto;
  font-weight: normal;
}


/* Main containers */
.container, .single-page-container, .neve-main .container {
  margin-right: auto;
  margin-left: auto;
  width: 100%;
  padding-left: var(--padding-md, 2rem);
  padding-right: var(--padding-md, 2rem);
  box-sizing: border-box;
}