/*
Theme Name: Stylish Writer Pro V4 Perfect Arrows
Theme URI: https://example.com/stylish-writer-pro
Author: Benjamin Arthur Robinson
Description: A stylish writer and author WordPress theme with large font choices, title alignment controls, gradient menus, mega-menu support, optional sidebars, floating footer, WooCommerce styling, rounded posts and products, and strong responsive design.
Version: 1.3.2
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: stylish-writer-pro
Tags: blog, e-commerce, custom-logo, custom-menu, right-sidebar, left-sidebar, threaded-comments, translation-ready
*/

:root{
  --swp-bg:#faf7f1;
  --swp-text:#171717;
  --swp-muted:#666;
  --swp-card:#ffffff;
  --swp-accent:#7c3aed;
  --swp-accent-2:#f97316;
  --swp-menu-text:#ffffff;
  --swp-radius:22px;
  --swp-title-align:center;
  --swp-body-font:Georgia, serif;
  --swp-title-font:Georgia, serif;
  --swp-menu-font:Arial, sans-serif;
  --swp-menu-gradient:linear-gradient(135deg,#191970,#7c3aed,#f97316);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--swp-body-font);
  background:
    radial-gradient(circle at top left, rgba(124,58,237,.14), transparent 30%),
    radial-gradient(circle at bottom right, rgba(249,115,22,.13), transparent 35%),
    var(--swp-bg);
  color:var(--swp-text);
  line-height:1.65;
  font-size:18px;
}
a{color:var(--swp-accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.screen-reader-text{position:absolute;left:-9999px}
.site-header{position:relative;z-index:50}
.top-brand{
  padding:36px 20px 26px;
  text-align:var(--swp-title-align);
}
.site-title{
  margin:0;
  font-family:var(--swp-title-font);
  font-size:clamp(34px,6vw,76px);
  line-height:1;
  letter-spacing:.03em;
  text-shadow:0 4px 18px rgba(0,0,0,.18);
}
.site-title a{color:var(--swp-text)}
.site-description{margin:12px 0 0;color:var(--swp-muted);font-size:19px}
.custom-logo{max-height:120px;width:auto}
.main-navigation{
  background:var(--swp-menu-gradient);
  color:var(--swp-menu-text);
  box-shadow:0 14px 38px rgba(0,0,0,.22);
  position:sticky;
  top:0;
  z-index:999;
}
.nav-inner{
  max-width:1280px;
  margin:0 auto;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:66px;
}
.menu-toggle{
  display:none;
  border:0;
  background:rgba(255,255,255,.18);
  color:#fff;
  padding:11px 16px;
  border-radius:999px;
  font-weight:700;
}
.primary-menu,.primary-menu ul{
  list-style:none;
  margin:0;
  padding:0;
}
.primary-menu{
  display:flex;
  align-items:center;
  gap:4px;
  flex-wrap:wrap;
  font-family:var(--swp-menu-font);
}
.primary-menu li{position:relative}
.primary-menu a{
  display:flex;
  align-items:center;
  gap:8px;
  padding:20px 15px;
  color:#fff;
  font-weight:700;
  border-radius:14px;
}
.primary-menu a:hover{background:rgba(255,255,255,.16);text-decoration:none}
.primary-menu .menu-item-has-children > a:after{content:"▾";font-size:12px;opacity:.85}
.primary-menu ul{
  position:absolute;
  left:0;
  top:100%;
  width:260px;
  background:rgba(15,15,25,.98);
  border-radius:0 0 18px 18px;
  box-shadow:0 18px 34px rgba(0,0,0,.35);
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:.2s ease;
  overflow:hidden;
}
.primary-menu li:hover > ul,
.primary-menu li:focus-within > ul{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.primary-menu ul a{padding:13px 17px;border-radius:0}

/* Mega menu mode: add class "mega-menu" to the parent menu item in Appearance > Menus */
.primary-menu li.mega-menu{position:static}
.primary-menu li.mega-menu > ul{
  left:50%;
  transform:translateX(-50%) translateY(8px);
  width:min(1180px,calc(100vw - 36px));
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:12px;
  padding:18px;
  border-radius:0 0 26px 26px;
}
.primary-menu li.mega-menu:hover > ul,
.primary-menu li.mega-menu:focus-within > ul{
  transform:translateX(-50%) translateY(0);
}
.primary-menu li.mega-menu > ul > li > a{
  min-height:96px;
  align-items:flex-end;
  border-radius:18px;
  background:
    linear-gradient(to top,rgba(0,0,0,.65),rgba(0,0,0,.15)),
    var(--swp-menu-gradient);
  background-size:cover;
  background-position:center;
  font-size:18px;
}
.primary-menu .menu-icon{
  width:24px;height:24px;border-radius:6px;object-fit:cover;
}
.swp-wrap{
  width:min(1240px,calc(100% - 36px));
  margin:34px auto;
}
.layout{
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
}
body.swp-sidebar-right .layout{grid-template-columns:minmax(0,1fr) 320px}
body.swp-sidebar-left .layout{grid-template-columns:320px minmax(0,1fr)}
body.swp-sidebar-left .content-area{order:2}
body.swp-sidebar-left .sidebar{order:1}
.content-card,
.widget,
.post-card,
.product,
.woocommerce ul.products li.product{
  background:var(--swp-card);
  border-radius:var(--swp-radius);
  box-shadow:0 12px 38px rgba(0,0,0,.08);
  border:1px solid rgba(0,0,0,.06);
}
.content-card{padding:clamp(22px,4vw,46px)}
.entry-title,.page-title{
  font-family:var(--swp-title-font);
  text-align:var(--swp-title-align);
  font-size:clamp(32px,5vw,62px);
  line-height:1.08;
  margin:0 0 24px;
}
.entry-meta,.entry-footer{color:var(--swp-muted);font-size:15px}
.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:26px}
.post-card{overflow:hidden}
.post-card-content{padding:24px}
.post-card .entry-title{font-size:30px;text-align:left}
.read-more,
.button,
button,
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button{
  display:inline-block;
  border:0;
  border-radius:999px!important;
  padding:12px 22px;
  background:linear-gradient(135deg,var(--swp-accent),var(--swp-accent-2));
  color:#fff!important;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 9px 22px rgba(124,58,237,.25);
}
.read-more:hover,.button:hover{text-decoration:none;filter:brightness(1.06)}
.sidebar{display:grid;gap:22px;align-content:start}
.widget{padding:22px}
.widget-title{font-family:var(--swp-title-font);font-size:24px;margin-top:0}
.site-footer{
  margin-top:42px;
  background:#111;
  color:#fff;
  padding:34px 18px;
  text-align:center;
}
body.swp-floating-footer .site-footer{
  position:fixed;
  left:18px;
  right:18px;
  bottom:12px;
  border-radius:22px;
  z-index:998;
  box-shadow:0 14px 40px rgba(0,0,0,.32);
  padding:14px 18px;
}
body.swp-floating-footer{padding-bottom:90px}

/* WooCommerce */
.woocommerce ul.products{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:26px;
}
.woocommerce ul.products li.product{
  width:auto!important;
  margin:0!important;
  padding:18px!important;
  overflow:hidden;
  text-align:center;
  transition:transform .2s ease, box-shadow .2s ease;
}
.woocommerce ul.products li.product:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(0,0,0,.14)}
.woocommerce ul.products li.product img{border-radius:18px;margin-bottom:14px!important}
.woocommerce-loop-product__title{font-family:var(--swp-title-font);font-size:22px!important}
.woocommerce div.product{
  background:var(--swp-card);
  padding:clamp(20px,4vw,46px);
  border-radius:var(--swp-radius);
  box-shadow:0 12px 38px rgba(0,0,0,.08);
}
.woocommerce div.product div.images img{border-radius:22px}
.woocommerce span.onsale{
  border-radius:999px;
  background:linear-gradient(135deg,var(--swp-accent),var(--swp-accent-2));
}
input,textarea,select{
  border:1px solid rgba(0,0,0,.16);
  border-radius:14px;
  padding:11px 13px;
  max-width:100%;
}
blockquote{
  border-left:6px solid var(--swp-accent);
  padding:16px 20px;
  margin:24px 0;
  background:rgba(124,58,237,.08);
  border-radius:0 18px 18px 0;
}
@media(max-width:900px){
  .menu-toggle{display:inline-block}
  .primary-menu{
    display:none;
    position:absolute;
    top:66px;
    left:18px;
    right:18px;
    background:rgba(15,15,25,.98);
    border-radius:0 0 24px 24px;
    padding:12px;
  }
  .primary-menu.is-open{display:block}
  .primary-menu li{position:relative}
  .primary-menu a{padding:14px 16px}
  .primary-menu ul,
  .primary-menu li.mega-menu > ul{
    position:static;
    width:auto;
    display:none;
    opacity:1;
    visibility:visible;
    transform:none;
    box-shadow:none;
    background:rgba(255,255,255,.08);
    border-radius:14px;
    margin-left:12px;
  }
  .primary-menu li:hover > ul,
  .primary-menu li:focus-within > ul{display:block;transform:none}
  body.swp-sidebar-right .layout,
  body.swp-sidebar-left .layout{grid-template-columns:1fr}
  body.swp-sidebar-left .content-area{order:1}
  body.swp-sidebar-left .sidebar{order:2}
}


/* V2: transparent author logo sizing */
.swp-title-logo {
  display:block;
  max-width:min(92vw, 900px);
  width:100%;
  height:auto;
  margin:0 auto 18px auto;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.22));
}

/* V2: permanently visible scrollable mobile menu */
@media(max-width:900px){
  .primary-menu.is-open{
    display:block;
    max-height:72vh;
    overflow-y:scroll;
    overflow-x:hidden;
    scrollbar-width:thin;
    scrollbar-color:#ffe66d rgba(255,255,255,.16);
    -webkit-overflow-scrolling:touch;
  }
  .primary-menu.is-open::-webkit-scrollbar{
    width:12px;
  }
  .primary-menu.is-open::-webkit-scrollbar-track{
    background:rgba(255,255,255,.16);
    border-radius:12px;
  }
  .primary-menu.is-open::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#ffe66d,#f97316);
    border-radius:12px;
    border:2px solid rgba(15,15,25,.98);
  }
  .primary-menu.is-open:after{
    content:"";
    display:block;
    height:22px;
  }
}

/* Desktop dropdowns also scroll if very tall */
.primary-menu ul{
  max-height:75vh;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:#ffe66d rgba(255,255,255,.16);
}
.primary-menu ul::-webkit-scrollbar{width:10px}
.primary-menu ul::-webkit-scrollbar-track{background:rgba(255,255,255,.16)}
.primary-menu ul::-webkit-scrollbar-thumb{background:#ffe66d;border-radius:10px}


/* V3: permanent custom menu scrollbar with top and bottom arrows */
@media(max-width:900px){
  .primary-menu.is-open{
    max-height:72vh;
    overflow-y:scroll !important;
    overflow-x:hidden;
    padding-right:30px;
    scrollbar-width:auto;
    scrollbar-color:#ffe66d rgba(20,20,30,.9);
  }

  .primary-menu.is-open::-webkit-scrollbar{
    width:18px;
    display:block;
  }

  .primary-menu.is-open::-webkit-scrollbar-track{
    background:rgba(20,20,30,.92);
    border-radius:12px;
    border:2px solid rgba(255,255,255,.18);
  }

  .primary-menu.is-open::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,#ffe66d,#f97316);
    border-radius:12px;
    border:3px solid rgba(20,20,30,.92);
  }

  .swp-mobile-menu-wrap{
    position:absolute;
    top:66px;
    left:18px;
    right:18px;
    z-index:1001;
    display:none;
  }

  .swp-mobile-menu-wrap.is-open{
    display:block;
  }

  .swp-mobile-menu-wrap .primary-menu{
    position:relative;
    top:auto;
    left:auto;
    right:auto;
    display:block;
    margin:0;
  }

  .swp-scroll-arrow{
    position:absolute;
    right:7px;
    width:34px;
    height:34px;
    border:0;
    border-radius:999px;
    background:linear-gradient(135deg,#ffe66d,#f97316);
    color:#111;
    font-size:20px;
    font-weight:900;
    line-height:34px;
    text-align:center;
    z-index:1004;
    box-shadow:0 4px 14px rgba(0,0,0,.35);
    cursor:pointer;
  }

  .swp-scroll-arrow-up{
    top:8px;
  }

  .swp-scroll-arrow-down{
    bottom:8px;
  }

  .swp-mobile-menu-wrap:before{
    content:"";
    position:absolute;
    right:13px;
    top:0;
    bottom:0;
    width:22px;
    background:rgba(15,15,25,.92);
    border-left:1px solid rgba(255,255,255,.18);
    border-radius:0 0 20px 0;
    z-index:1002;
    pointer-events:none;
  }
}

@media(min-width:901px){
  .swp-mobile-menu-wrap{display:contents}
  .swp-scroll-arrow{display:none}
}


/* V4: compact mobile menu so it stays on screen */
@media(max-width:900px){
  .swp-mobile-menu-wrap{
    top:58px;
    left:12px;
    right:12px;
    max-height:52vh;
  }

  .primary-menu.is-open{
    max-height:46vh !important;
    width:100%;
    padding:8px 26px 8px 8px !important;
    border-radius:0 0 18px 18px;
  }

  .primary-menu a{
    padding:8px 10px !important;
    font-size:15px !important;
    line-height:1.2;
    min-height:36px;
  }

  .primary-menu ul,
  .primary-menu li.mega-menu > ul{
    margin-left:6px;
    padding:6px;
    max-height:34vh;
    overflow-y:auto;
  }

  .primary-menu ul a,
  .primary-menu li.mega-menu > ul > li > a{
    padding:7px 9px !important;
    font-size:14px !important;
    min-height:34px !important;
    border-radius:10px;
  }

  .primary-menu li.mega-menu > ul{
    grid-template-columns:1fr !important;
    gap:5px;
  }

  .swp-scroll-arrow{
    right:4px;
    width:28px;
    height:28px;
    line-height:28px;
    font-size:16px;
  }

  .swp-scroll-arrow-up{
    top:5px;
  }

  .swp-scroll-arrow-down{
    bottom:5px;
  }

  .swp-mobile-menu-wrap:before{
    right:8px;
    width:18px;
  }

  .primary-menu.is-open::-webkit-scrollbar{
    width:14px;
  }

  .nav-inner{
    min-height:58px;
  }

  .menu-toggle{
    padding:8px 13px;
    font-size:15px;
  }
}


/* V4 perfect centred orange arrow buttons */
@media(max-width:900px){

  .swp-scroll-arrow,
  .scroll-arrow{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:linear-gradient(135deg,#ffe66d,#f97316) !important;
    color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    text-indent:0 !important;
    overflow:hidden !important;
    display:block !important;
    position:absolute !important;
    box-shadow:0 4px 14px rgba(0,0,0,.35) !important;
  }

  .swp-scroll-arrow::before,
  .scroll-arrow::before{
    position:absolute !important;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%,-50%) !important;
    width:100% !important;
    height:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:#111 !important;
    font-size:18px !important;
    line-height:1 !important;
    font-weight:900 !important;
    text-align:center !important;
    font-family:Arial, Helvetica, sans-serif !important;
    pointer-events:none !important;
  }

  .swp-scroll-arrow-up::before,
  .scroll-up::before{
    content:"▲" !important;
  }

  .swp-scroll-arrow-down::before,
  .scroll-down::before{
    content:"▼" !important;
  }

  .swp-scroll-arrow-up,
  .scroll-up{
    top:8px !important;
    right:4px !important;
  }

  .swp-scroll-arrow-down,
  .scroll-down{
    bottom:8px !important;
    right:4px !important;
  }

  .swp-mobile-menu-wrap:before,
  .swp-menu-panel:before{
    right:12px !important;
    width:18px !important;
  }
}


/* Center poem post titles and read more buttons */
.single-post .entry-title,
.blog .entry-title,
.archive .entry-title {
    text-align: center !important;
}

.more-link,
.read-more,
a.more-link {
    display: table !important;
    margin: 15px auto !important;
    text-align: center !important;
}



/* Keep individual poem title and date centred */
.single-post .entry-title,
.single-post h1.entry-title,
.single-post .post-title {
    text-align: center !important;
}

.single-post .entry-meta,
.single-post .posted-on,
.single-post time {
    text-align: center !important;
    display: block !important;
}

/* Mobile spacing for individual poem posts */
@media (max-width: 768px) {
    .single-post article,
    .single-post .post,
    .single-post .entry,
    .single-post .content-area article,
    .single-post main article {
        margin: 30px 20px !important;
        padding: 30px !important;
        max-width: calc(100% - 40px) !important;
    }
}


/* Make the inside spacing feel even on individual poem pages */
body.single-post .entry-title,
body.single-post h1.entry-title,
body.single-post .post-title {
    text-align: center !important;
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}

body.single-post .entry-meta,
body.single-post .posted-on,
body.single-post time {
    text-align: center !important;
    display: block !important;
    margin: 0 auto 32px auto !important;
}

/* Mobile equal spacing */
@media (max-width: 768px) {
    body.single-post .site-main,
    body.single-post main,
    body.single-post .content-area {
        padding: 26px 0 !important;
    }

    body.single-post article,
    body.single-post .post,
    body.single-post .entry,
    body.single-post .content-area article,
    body.single-post main article {
        width: calc(100% - 52px) !important;
        max-width: calc(100% - 52px) !important;
        margin: 26px auto !important;
        padding: 30px !important;
    }
}

/* Header background customizer support */
.site-header,
header.site-header,
.custom-header,
.header-area,
.main-header,
body > header {
    background-color: var(--bar-header-bg-color, transparent) !important;
    background-image: var(--bar-header-bg-image, none) !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}





/* Single poem posts: use the same spacing style as the list post cards */
body.single-post .site-main,
body.single-post main,
body.single-post .content-area {
    padding: 30px 0 !important;
    box-sizing: border-box !important;
}

body.single-post article.post,
body.single-post article,
body.single-post .post,
body.single-post .entry,
body.single-post .content-area article,
body.single-post main article {
    width: min(90%, 630px) !important;
    max-width: 90% !important;
    margin: 30px auto !important;
    padding: 40px !important;
    border-radius: 30px !important;
    box-sizing: border-box !important;
}

/* Match list post title/date alignment on single poem posts */
body.single-post .entry-title,
body.single-post h1.entry-title,
body.single-post .post-title {
    text-align: center !important;
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}

body.single-post .entry-meta,
body.single-post .posted-on,
body.single-post time {
    text-align: center !important;
    display: block !important;
    margin: 0 auto 32px auto !important;
}

/* Mobile: same proportional card spacing as list posts */
@media (max-width: 768px) {
    body.single-post .site-main,
    body.single-post main,
    body.single-post .content-area {
        padding: 30px 0 !important;
    }

    body.single-post article.post,
    body.single-post article,
    body.single-post .post,
    body.single-post .entry,
    body.single-post .content-area article,
    body.single-post main article {
        width: 90% !important;
        max-width: 90% !important;
        margin: 30px auto !important;
        padding: 30px !important;
        border-radius: 30px !important;
    }
}


/* Fine tune: move individual poem card 18px left on mobile */
@media (max-width: 768px) {
    body.single-post article.post,
    body.single-post article,
    body.single-post .post,
    body.single-post .entry,
    body.single-post .content-area article,
    body.single-post main article {
        transform: translateX(-8px) !important;
    }
}


/* Move single poem card closer to menu bar */
@media (max-width: 768px) {
    body.single-post article.post,
    body.single-post article,
    body.single-post .post,
    body.single-post .entry,
    body.single-post .content-area article,
    body.single-post main article {
        margin-top: 8px !important;
    }

    body.single-post .site-main,
    body.single-post main,
    body.single-post .content-area {
        padding-top: 8px !important;
    }
}



/* Uploaded Site Identity logo display */
.custom-logo-wrap,
.site-logo {
    text-align: center !important;
    margin: 0 auto 12px auto !important;
}

.custom-logo-link {
    display: inline-block !important;
    line-height: 0 !important;
}

.custom-logo {
    display: block !important;
    max-width: min(86vw, 640px) !important;
    width: auto !important;
    height: auto !important;
    margin: 0 auto !important;
}



/* Keep the WordPress admin-uploaded logo visible and replaceable */
.custom-logo-wrap,
.site-logo,
.custom-logo-link,
.custom-logo {
    display: block !important;
}

.custom-logo-wrap,
.site-logo {
    text-align: center !important;
    margin: 0 auto 12px auto !important;
}

.custom-logo-link {
    width: fit-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    line-height: 0 !important;
}

.custom-logo {
    max-width: min(86vw, 680px) !important;
    height: auto !important;
    margin: 0 auto !important;
}



/* Keep uploaded Site Identity logo visible */
.custom-logo-wrap,
.site-logo,
.custom-logo-link,
.custom-logo {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.custom-logo-wrap,
.site-logo {
    text-align: center !important;
    margin: 0 auto 12px auto !important;
}

.custom-logo-link {
    width: fit-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    line-height: 0 !important;
}

.custom-logo {
    max-width: min(86vw, 680px) !important;
    height: auto !important;
    margin: 0 auto !important;
}




/* Keep WordPress uploaded custom logo visible */
.site-branding .custom-logo-wrap,
.site-branding .site-logo,
.site-branding .custom-logo-link,
.site-branding .custom-logo,
.custom-logo-wrap,
.site-logo,
.custom-logo-link,
.custom-logo {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.custom-logo-wrap,
.site-logo {
    text-align: center !important;
    margin: 0 auto 14px auto !important;
}

.custom-logo-link {
    width: fit-content !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    line-height: 0 !important;
}

.custom-logo {
    max-width: min(86vw, 680px) !important;
    height: auto !important;
    margin: 0 auto !important;
}




/* Hide only the old blue text logo under the header picture */
.logo-text,
.text-logo,
.brand-title,
.header-title,
.site-branding .logo-text,
.site-branding .text-logo,
.site-branding .brand-title,
.site-branding .header-title,
.site-branding .author-pill,
.site-branding .author-badge,
.site-branding .author-button,
.author-pill,
.author-badge,
.author-button {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Keep the email/tagline visible */
.site-description,
.site-tagline,
.tagline,
.site-branding .site-description,
.site-branding .site-tagline,
.site-branding .tagline {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Keep uploaded Site Identity logo visible */
.custom-logo-wrap,
.site-logo,
.custom-logo-link,
.custom-logo {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}



/* Submenu arrow open/close fix */
.menu-item-has-children,
.page_item_has_children {
    position: relative;
}

.bar-submenu-toggle,
.submenu-toggle,
.dropdown-toggle,
.sub-menu-toggle {
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 5 !important;
}

.menu-item-has-children > ul.sub-menu,
.page_item_has_children > ul.children {
    display: none;
}

.menu-item-has-children.submenu-open > ul.sub-menu,
.page_item_has_children.submenu-open > ul.children {
    display: block !important;
}

.bar-submenu-toggle.is-open,
.submenu-toggle.is-open,
.dropdown-toggle.is-open,
.sub-menu-toggle.is-open {
    transform: rotate(180deg);
}



/* Full mobile and desktop responsive layout fix */
html,
body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

*,
*:before,
*:after {
    box-sizing: border-box !important;
}

img,
video,
iframe,
embed,
object {
    max-width: 100% !important;
    height: auto !important;
}

/* Stop header and menu from forcing the page wider than the screen */
.site,
.site-wrapper,
.page,
#page,
.site-content,
.content-area,
main,
.site-main,
.container,
.wrapper,
.header,
.site-header,
header,
.site-branding,
.menu-area,
.main-navigation,
nav {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Header logo/banner area */
.site-header,
header.site-header,
.site-branding,
.header-area,
.main-header {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
}

/* Uploaded/custom logo and header images must scale on mobile */
.custom-logo,
.site-logo img,
.site-branding img,
.header-area img,
.main-header img,
.site-header img {
    max-width: min(92vw, 900px) !important;
    width: auto !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
}

/* Main menu strip should fit the screen */
.main-navigation,
.menu-wrapper,
.menu-container,
.nav-wrapper,
.nav-area {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
}

/* Cards/pages/posts: centred and never wider than viewport */
article,
.post,
.page-content,
.entry,
.entry-content,
.content-card,
.site-main > div,
.content-area article,
main article {
    max-width: min(92vw, 900px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* Text should wrap rather than push layout sideways */
.entry-content,
.entry-content p,
article p,
.page-content p,
.post p,
h1, h2, h3, h4, h5, h6 {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
}

/* Woo/cart floating icon should not cause horizontal overflow */
.cart,
.cart-icon,
.floating-cart,
.woocommerce-cart-icon,
.site-cart,
.header-cart {
    max-width: 90px !important;
    right: 10px !important;
}

/* Mobile layout */
@media (max-width: 768px) {
    body {
        font-size: 18px !important;
        line-height: 1.55 !important;
    }

    .site-header,
    header.site-header,
    .site-branding,
    .header-area,
    .main-header {
        padding: 16px 0 !important;
    }

    .custom-logo,
    .site-logo img,
    .site-branding img,
    .header-area img,
    .main-header img,
    .site-header img {
        max-width: 86vw !important;
    }

    .site-main,
    main,
    .content-area {
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px 0 !important;
        margin: 0 auto !important;
    }

    article,
    .post,
    .page-content,
    .entry,
    .entry-content,
    .content-card,
    .content-area article,
    main article {
        width: calc(100% - 40px) !important;
        max-width: calc(100% - 40px) !important;
        margin: 20px auto !important;
        padding: 28px !important;
        border-radius: 28px !important;
    }

    h1,
    .entry-title,
    .page-title {
        font-size: clamp(2rem, 9vw, 3.2rem) !important;
        line-height: 1.08 !important;
        text-align: center !important;
    }

    h2 {
        font-size: clamp(1.7rem, 7vw, 2.5rem) !important;
        line-height: 1.12 !important;
    }

    p,
    li {
        font-size: clamp(1.05rem, 5.1vw, 1.55rem) !important;
    }

    .main-navigation ul,
    nav ul,
    .menu {
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .main-navigation a,
    nav a,
    .menu a {
        max-width: 100% !important;
        white-space: normal !important;
    }
}

/* Desktop layout */
@media (min-width: 769px) {
    .site-main,
    main,
    .content-area {
        max-width: 1100px !important;
        margin: 0 auto !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    article,
    .post,
    .page-content,
    .entry,
    .content-card,
    .content-area article,
    main article {
        max-width: 900px !important;
    }
}


/* Restore menu functionality after responsive update */
.main-navigation,
.menu-wrapper,
.menu-container,
.nav-wrapper,
.nav-area,
nav,
.primary-navigation {
    overflow: visible !important;
    pointer-events: auto !important;
    z-index: 99999 !important;
}

.main-navigation *,
.menu-wrapper *,
.menu-container *,
.nav-wrapper *,
.nav-area *,
nav *,
.primary-navigation * {
    pointer-events: auto !important;
}

.main-navigation ul,
nav ul,
.menu {
    overflow: visible !important;
}

.main-navigation .sub-menu,
nav .sub-menu,
.menu .sub-menu,
.children {
    z-index: 100000 !important;
}

.menu-toggle,
.mobile-menu-toggle,
.menu-button,
.hamburger,
#menu-toggle,
button[aria-controls],
button.menu-toggle {
    pointer-events: auto !important;
    cursor: pointer !important;
    z-index: 100001 !important;
    position: relative !important;
}

@media (max-width: 768px) {
    .main-navigation,
    .menu-wrapper,
    .menu-container,
    .nav-wrapper,
    .nav-area,
    nav,
    .primary-navigation {
        overflow: visible !important;
        max-width: 100% !important;
    }
}


/* Force menu and submenus to appear above page content */
.site-header,
header,
.header-area,
.main-header,
.menu-area,
.menu-wrapper,
.menu-container,
.nav-wrapper,
.nav-area,
.main-navigation,
.primary-navigation,
nav {
    position: relative !important;
    z-index: 2147483000 !important;
    overflow: visible !important;
}

/* Open mobile menu panel above all content */
.main-navigation.toggled,
.main-navigation.active,
.main-navigation.open,
.menu-wrapper.toggled,
.menu-wrapper.active,
.menu-wrapper.open,
.menu-container.toggled,
.menu-container.active,
.menu-container.open,
.nav-wrapper.toggled,
.nav-wrapper.active,
.nav-wrapper.open,
.nav-area.toggled,
.nav-area.active,
.nav-area.open,
.primary-navigation.toggled,
.primary-navigation.active,
.primary-navigation.open,
nav.toggled,
nav.active,
nav.open {
    position: relative !important;
    z-index: 2147483001 !important;
    overflow: visible !important;
}

/* Submenus must sit above posts/pages/cards */
.main-navigation ul,
.main-navigation li,
.main-navigation .sub-menu,
.main-navigation ul ul,
.primary-navigation ul,
.primary-navigation li,
.primary-navigation .sub-menu,
.primary-navigation ul ul,
nav ul,
nav li,
nav .sub-menu,
nav ul ul,
.menu,
.menu li,
.menu .sub-menu,
.menu ul {
    z-index: 2147483002 !important;
}

/* Prevent main content from covering dropdowns */
.site-content,
.content-area,
.site-main,
main,
article,
.post,
.page,
.entry,
.entry-content,
.content-card {
    position: relative !important;
    z-index: 1 !important;
}

/* Make menu buttons clickable above content */
.menu-toggle,
.mobile-menu-toggle,
.menu-button,
.hamburger,
#menu-toggle,
button[aria-controls],
button.menu-toggle,
.bar-submenu-toggle,
.submenu-toggle,
.dropdown-toggle,
.sub-menu-toggle {
    position: relative !important;
    z-index: 2147483003 !important;
    pointer-events: auto !important;
}

/* Mobile: dropdown panel must overlay the content below */
@media (max-width: 768px) {
    .main-navigation,
    .primary-navigation,
    nav,
    .menu-wrapper,
    .menu-container,
    .nav-wrapper,
    .nav-area {
        position: relative !important;
        z-index: 2147483001 !important;
        overflow: visible !important;
    }

    .main-navigation ul,
    .primary-navigation ul,
    nav ul,
    .menu {
        position: relative !important;
        z-index: 2147483002 !important;
        overflow: visible !important;
    }

    .main-navigation .sub-menu,
    .primary-navigation .sub-menu,
    nav .sub-menu,
    .menu .sub-menu {
        position: relative !important;
        z-index: 2147483003 !important;
        background: inherit;
    }
}