@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
/* ==========================================================================
   THE DEVINE EDIT — Custom CSS (v2, consolidated)
   ========================================================================== */

:root {
  --de-navy:   #19324B;
  --de-pink:   #B83A6E;
  --de-olive:  #6B8438;
  --de-cream:  #FAF6EC;
  --de-paper:  #FCF8EE;
  --de-ink:    #19324B;
}

body { background-color: var(--de-cream); color: var(--de-ink); }

body, p, li, a, .wp-block-button__link {
  font-family: 'Lora', Georgia, serif;
  font-size: 1.05rem;
  line-height: 1.7;
}

h1, h2, h3, h4, h5, h6, .wp-block-heading {
  font-family: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  color: var(--de-navy);
  font-weight: 500;
  letter-spacing: 0.01em;
  background-color: transparent !important;
  background: transparent !important;
}

h1.wp-block-post-title, .wp-block-post-title {
  background-color: transparent !important;
  background: transparent !important;
  padding: 0 !important;
}

h1, .wp-block-heading.has-x-large-font-size { font-size: clamp(2.4rem, 4.2vw, 3.6rem); }
h2 { font-size: clamp(1.9rem, 3vw, 2.6rem); }
h3 { font-size: clamp(1.4rem, 2vw, 1.7rem); }

.is-style-script, .has-script-font {
  font-family: 'Parisienne', cursive;
  color: var(--de-pink);
  font-weight: 400;
}

a { color: var(--de-pink); text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: var(--de-navy); }

.wp-block-button .wp-block-button__link {
  background-color: var(--de-navy);
  color: #FCF8EE;
  border-radius: 999px;
  padding: 14px 32px;
  font-family: 'DM Sans', 'Lora', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.2s ease;
}
.wp-block-button .wp-block-button__link:hover {
  background-color: var(--de-pink);
  color: #FCF8EE;
}

.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--de-navy);
  border: 1px solid var(--de-navy);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--de-navy);
  color: #FCF8EE;
}

.wp-block-site-title a, .wp-block-site-title {
  font-family: 'Cormorant Garamond', serif;
  color: var(--de-navy);
  font-weight: 500;
  letter-spacing: 0.04em;
}

.wp-block-navigation, .wp-block-navigation.has-background, nav.wp-block-navigation {
  background-color: transparent !important;
  background: transparent !important;
  padding: 0 !important;
}

.wp-block-navigation .wp-block-navigation-item__content {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.82rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--de-navy);
  text-decoration: none;
}
.wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--de-pink); }

@media (min-width: 782px) {
  .wp-block-navigation__responsive-container-open { display: none !important; }
  .wp-block-navigation__responsive-container {
    position: static !important;
    background: transparent !important;
    padding: 0 !important;
    color: inherit !important;
  }
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: block !important;
    visibility: visible !important;
  }
  .wp-block-navigation__responsive-container-content,
  .wp-block-navigation__container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 28px !important;
  }
  .wp-block-navigation__responsive-container-close { display: none !important; }
}

body.home .wp-block-image,
body.page-id-137 .wp-block-image,
body.home figure.wp-block-image,
body.page-id-137 figure.wp-block-image { display: none !important; }

body.home .wp-block-site-logo,
body.home .wp-block-site-logo img,
body.home .wp-block-site-logo figure,
body.home .wp-block-site-logo .wp-block-image,
body.home header .wp-block-image,
body.home .wp-block-template-part .wp-block-image,
body.page-id-137 .wp-block-site-logo,
body.page-id-137 .wp-block-site-logo img,
body.page-id-137 .wp-block-site-logo figure,
body.page-id-137 .wp-block-site-logo .wp-block-image,
body.page-id-137 header .wp-block-image,
body.page-id-137 .wp-block-template-part .wp-block-image { display: block !important; }

.wp-block-post-content ul:not(.wp-block-navigation):not(.wp-block-page-list) {
  list-style: none;
  padding-left: 0;
}
.wp-block-post-content ul:not(.wp-block-navigation):not(.wp-block-page-list) li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 8px;
}
.wp-block-post-content ul:not(.wp-block-navigation):not(.wp-block-page-list) li::before {
  content: "\2726";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--de-pink);
  font-size: 0.9em;
  line-height: 1.7;
}

.de-card {
  background: var(--de-paper);
  padding: 32px 26px;
  border: 2px solid var(--de-pink);
  border-radius: 12px;
  position: relative;
}
.de-card::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid var(--de-olive);
  border-radius: 8px;
  pointer-events: none;
}




/* === Force 3-column grid for tier cards (target inner wrapper) === */
.elementor-element-ea6cb5a {
  max-width: 1100px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.elementor-element-ea6cb5a > .e-con-inner {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}
@media (max-width: 768px) {
  .elementor-element-ea6cb5a > .e-con-inner {
    grid-template-columns: 1fr !important;
  }
}
.elementor-element-ea6cb5a > .e-con-inner > .elementor-element {
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
}

@media (max-width: 1024px) {
  .elementor-element-ea6cb5a > .e-con-inner {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* === Widen tier cards container to break out of e-con-boxed === */
.elementor-element-61e5e11 {
  --container-max-width: 1280px !important;
  max-width: 100% !important;
}
.elementor-element-61e5e11 > .e-con-inner {
  max-width: 1280px !important;
  width: 100% !important;
}
.elementor-element-ea6cb5a {
  --container-max-width: 1200px !important;
  max-width: 100% !important;
}
.elementor-element-ea6cb5a > .e-con-inner {
  max-width: 1200px !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* === Bigger section eyebrow labels (How It Works / The Shop / Wrapping) === */
.de-section-label {
  font-size: 16px !important;
  letter-spacing: 0.32em !important;
  font-weight: 700 !important;
  margin-bottom: 22px !important;
  gap: 18px !important;
}
.de-section-label::before,
.de-section-label::after {
  width: 38px !important;
}

/* Hide "Welcome" script in hero */
.e-4b86859-8a6123f { display: none !important; }


/* === Mobile-friendly: top nav + pickup callout === */

/* Top custom nav (HTML widget) - tighten at mobile */
@media (max-width: 700px) {
  .elementor-element-2445571,
  .elementor-element-2445571 > .e-con-inner {
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
  .elementor-element-2445571 nav {
    gap: 14px 18px !important;
    font-size: 11px !important;
    letter-spacing: 0.14em !important;
  }
  .elementor-element-2445571 nav a {
    padding: 4px 0 !important;
  }
}
@media (max-width: 420px) {
  .elementor-element-2445571 nav {
    font-size: 10.5px !important;
    gap: 10px 14px !important;
    letter-spacing: 0.12em !important;
  }
}

/* Local Pickup & Delivery navy callout (.de-pickup) - mobile polish */
@media (max-width: 768px) {
  .de-pickup {
    padding: 28px 22px !important;
    gap: 18px !important;
    text-align: center !important;
  }
  .de-pickup-icon {
    font-size: 38px !important;
    margin: 0 auto !important;
  }
  .de-pickup-text {
    font-size: 0.95rem !important;
    line-height: 1.55 !important;
  }
  .de-pickup-btn {
    padding: 14px 22px !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.18em !important;
    width: 100%;
    max-width: 280px;
    text-align: center;
  }
}





/* ============================================================
   COMPREHENSIVE MOBILE RESPONSIVENESS — full site
   ============================================================ */

@media (max-width: 768px) {
  /* === HERO === */
  /* Inline-styled headline "Where beautiful gifting begins." — force scale down */
  .elementor-element-2979861 p,
  .elementor-element-2979861 h1,
  .elementor-element-2979861 h2 {
    font-size: clamp(28px, 8vw, 40px) !important;
    line-height: 1.1 !important;
  }
  .elementor-element-2979861 em {
    font-size: inherit !important;
  }
  /* Hero subhead (text-editor below headline) */
  .elementor-element-0f4dc67 p {
    font-size: 1rem !important;
    line-height: 1.6 !important;
    padding: 0 12px !important;
  }
  /* Hero logo - shrink */
  .elementor-element-a6d59f5 img {
    max-width: 70vw !important;
    height: auto !important;
    margin: 0 auto !important;
  }
  /* EXPLORE WRAPPING SERVICES button */
  .elementor-element-e38e355 .elementor-button {
    font-size: 12px !important;
    letter-spacing: 0.16em !important;
    padding: 14px 24px !important;
  }

  /* === SECTION EYEBROW LABELS === */
  .de-section-label {
    font-size: 12px !important;
    letter-spacing: 0.22em !important;
    gap: 10px !important;
  }
  .de-section-label::before,
  .de-section-label::after {
    width: 20px !important;
  }

  /* === H2 STYLE (HOW IT WORKS / Wrapping / Shop headlines) === */
  .de-h2 {
    font-size: clamp(26px, 7vw, 36px) !important;
    line-height: 1.15 !important;
    padding: 0 8px !important;
  }

  /* === SHOP SECTION === */
  .de-shop { padding: 60px 16px !important; }
  .de-shop-kicker { font-size: 28px !important; }
  .de-shop-lede { font-size: 1rem !important; padding: 0 8px !important; }
  .de-shop-note { font-size: 0.9rem !important; }
  .de-shop-cta { padding: 24px 18px !important; }
  .de-shop-cta-line { font-size: 1.15rem !important; }
  .de-shop-btn { padding: 14px 24px !important; font-size: 12px !important; letter-spacing: 0.16em !important; }
  .de-mahjong { font-size: 0.85rem !important; padding: 10px 16px !important; line-height: 1.5 !important; }

  /* === HOW IT WORKS === */
  .de-how { padding: 60px 16px !important; }
  .de-how-item { padding: 18px 12px !important; }
  .de-how-title { font-size: 1.25rem !important; }
  .de-how-text { font-size: 0.95rem !important; }

  /* === WRAPPING SECTION === */
  .de-wrap { padding: 60px 16px !important; }
  .de-wrap-strip {
    padding: 18px 20px !important;
    font-size: 0.95rem !important;
    line-height: 1.55 !important;
    margin-bottom: 32px !important;
  }
  .de-wrap-card { padding: 36px 22px 28px !important; }
  .de-wrap-tier { font-size: 1.6rem !important; }
  .de-wrap-desc { font-size: 0.95rem !important; }

  /* === CONCIERGE SECTION (Tell us who, when, feeling) === */
  /* The concierge container holding the heading, bullets, button */
  .elementor-element-d9c38e7 {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  /* Concierge bullets */
  .elementor-element-7dd000e ul {
    text-align: left !important;
    padding-left: 8px !important;
  }
  .elementor-element-7dd000e ul li {
    font-size: 0.95rem !important;
    line-height: 1.55 !important;
  }
  /* START YOUR CONCIERGE INQUIRY button */
  .elementor-element-ddc8ddb .elementor-button {
    font-size: 11px !important;
    letter-spacing: 0.14em !important;
    padding: 14px 22px !important;
    white-space: normal !important;
  }

  /* === CUSTOM FOOTER === */
  .de-footer { padding: 60px 20px 28px !important; }
  .de-footer-tagline { font-size: 30px !important; }
  .de-footer-name { font-size: 1.15rem !important; letter-spacing: 0.16em !important; }
  .de-footer-sub { font-size: 0.88rem !important; }
  .de-footer-cta { padding: 22px 20px !important; }
  .de-footer-cta p { font-size: 1.05rem !important; }
  .de-footer-cta a { padding: 10px 22px !important; font-size: 11px !important; letter-spacing: 0.18em !important; }
  .de-footer-cols { gap: 28px !important; padding-bottom: 28px !important; }
  .de-footer-bottom { font-size: 0.78rem !important; justify-content: center !important; }
}

@media (max-width: 480px) {
  /* Tighter padding on very small screens */
  .de-how, .de-shop, .de-wrap { padding-left: 14px !important; padding-right: 14px !important; }
  .de-pickup-text { font-size: 0.9rem !important; }
  .de-pickup-btn { padding: 13px 18px !important; font-size: 0.72rem !important; }
  .de-wrap-strip { font-size: 0.9rem !important; }
}


/* === Mobile nav container fit fix === */
@media (max-width: 700px) {
  .elementor-element-2445571 {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: hidden !important;
  }
  .elementor-element-2445571 > .e-con-inner {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 12px 10px !important;
  }
  .elementor-element-2445571 .elementor-widget-html,
  .elementor-element-2445571 .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }
}


/* === Global mobile overflow prevention === */
@media (max-width: 700px) {
  html, body { overflow-x: hidden !important; max-width: 100vw !important; }
  body * { max-width: 100vw !important; }
}



/* === Final mobile nav: clean vertical stack === */
@media (max-width: 700px) {
  .elementor-element-2445571 {
    width: 100% !important;
    max-width: 100vw !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  .elementor-element-2445571 > .e-con-inner {
    width: calc(100% - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    margin: 0 auto !important;
    padding: 18px 14px !important;
    box-sizing: border-box !important;
  }
  .elementor-element-2445571 nav {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    font-size: 12px !important;
    letter-spacing: 0.16em !important;
    text-align: center !important;
    width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  .elementor-element-2445571 nav a {
    padding: 6px 12px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }
}


/* ---------- Footer subtitle color fix + tagline stars (override) ---------- */
.de-footer-sub {
  color: #D4A24C !important;
  opacity: 1 !important;
  letter-spacing: 0.04em;
}
.de-footer-tagline::before,
.de-footer-tagline::after {
  content: "\2726";
  color: #D4A24C;
  font-family: 'Lora', Georgia, serif;
  font-size: 20px;
  vertical-align: middle;
  margin: 0 14px;
  display: inline-block;
  position: relative;
  top: -6px;
}


/* Space between hero script line and intro paragraph */
p.de-hero-script {
  margin-bottom: 18px !important;
}

/* Site logo above header nav */
.elementor-element-265cb09::before {
  content: "";
  display: block;
  width: 240px;
  height: 240px;
  margin: 10px auto 14px;
  background: url(https://devineedit.com/wp-content/uploads/2026/07/devine-edit-logo-transparent.png) center/contain no-repeat;
}
@media (max-width: 640px) {
  .elementor-element-265cb09::before { width: 160px; height: 160px; margin: 8px auto 10px; }
}

/* Hide duplicate hero logo widget (kept in Elementor, just not displayed) */
.elementor-element-a6d59f5 { display: none; }


/* Hero script size - responsive, prevents overflow */
p.de-hero-script { font-size: clamp(34px, 4.4vw, 62px) !important; }


/* Script font: 'Parisienne' */
p.de-hero-script,
.de-shop-kicker {
  font-family: 'Parisienne', cursive !important;
}


/* Footer script font: Parisienne */
.de-footer-tagline,
.de-footer-star {
  font-family: 'Parisienne', cursive !important;
}


/* Great Vibes cleanup - broken font reference, render as Parisienne */
.e-4b86859-8a6123f { font-family: 'Parisienne', cursive !important; }


/* Hero spacing - script sits lower, less gap before next section */
.elementor-element-97a1590 { padding-top: 36px !important; }
.elementor-element-b8cefd2 { height: 48px !important; min-height: 48px !important; }