/* pro2.css — upgraded premium restyle for aged-domain restores. Goal: a designed, branded feel
   (real font pairing, full-bleed sticky glass header, gradient hero, elevated cards, styled
   footer, micro-interactions) — NOT a plain centered-column template. Keeps all the dead-artifact
   hide rules. Fonts overridable per-site via --font-head/--font-body + a matching <link>. */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --accent:#0e7490; --accent-2:#0891b2; --accent-dark:#0c4a5e;
  --fg:#1e2733; --muted:#5b6875; --bg:#ffffff; --soft:#f4f7fb; --soft-2:#eef3f9;
  --line:#e4eaf1; --card:#ffffff; --ink:#0d1622;
  --font-head:'Sora',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --maxw:1120px; --radius:16px;
  --shadow-s:0 1px 2px rgba(13,22,34,.05),0 1px 3px rgba(13,22,34,.04);
  --shadow-m:0 6px 18px rgba(13,22,34,.07),0 2px 6px rgba(13,22,34,.05);
  --shadow-l:0 18px 48px rgba(13,22,34,.12);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; overflow-x:hidden; scroll-behavior:smooth}
body{margin:0 auto!important; max-width:var(--maxw)!important; padding:0 22px 0!important; float:none!important;
  background:var(--bg); color:var(--fg); font-family:var(--font-body);
  font-size:17px; line-height:1.72; -webkit-font-smoothing:antialiased; letter-spacing:-.003em; word-wrap:break-word}
img,svg,video,iframe{max-width:100%; height:auto}
a{color:var(--accent); text-decoration:none; transition:color .15s}
a:hover{color:var(--accent-dark)}

h1,h2,h3,h4{font-family:var(--font-head); line-height:1.15; color:var(--ink);
  margin:1.4em 0 .5em; font-weight:750; letter-spacing:-.022em}
h1{font-size:2.55rem} h2{font-size:1.9rem} h3{font-size:1.3rem}
p,ul,ol,blockquote,figure,table{margin:0 0 1.15em}
blockquote{border-left:3px solid var(--accent); padding:.5em 1.2em; margin:1.4em 0; color:var(--muted);
  background:linear-gradient(90deg,var(--soft),transparent); border-radius:0 10px 10px 0; font-style:italic}
hr{border:0; height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); margin:2.4em 0}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; background:var(--soft-2); border-radius:8px}
code{padding:.13em .4em; font-size:.88em; color:var(--accent-dark)}
pre{padding:1.1em; overflow:auto; border:1px solid var(--line)}
table{border-collapse:collapse; width:100%; font-size:.96em}
th,td{border:1px solid var(--line); padding:.6em .85em; text-align:left} th{background:var(--soft); font-family:var(--font-head)}

/* full-bleed helper */
.pro-band{width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw)}

/* ---- sticky glass header (the primary nav, tagged by pro.js) ---- */
.pro-nav{position:sticky; top:0; z-index:200; width:100vw; margin-left:calc(50% - 50vw);
  display:flex!important; flex-wrap:wrap; gap:2px 4px; align-items:center; justify-content:center;
  list-style:none!important; margin-top:0!important; margin-bottom:0!important; padding:13px 24px!important; float:none!important;
  background:rgba(255,255,255,.82); backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line); box-shadow:0 2px 20px rgba(13,22,34,.05)}
.pro-nav li{list-style:none!important; margin:0!important; float:none!important; display:inline-block!important}
.pro-nav a{display:inline-block; padding:9px 16px; border-radius:10px; color:#33404d!important; font-family:var(--font-head);
  font-weight:600; font-size:.94rem; letter-spacing:-.01em; white-space:nowrap; text-decoration:none!important; transition:all .16s}
.pro-nav a:hover{background:var(--soft); color:var(--accent-dark)!important; transform:translateY(-1px)}
.pro-nav ul{display:none!important}

/* brand line (injected on interior pages) */
.pro-brand{text-align:center; font-family:var(--font-head); font-size:1.35rem; font-weight:800; letter-spacing:-.03em;
  color:var(--ink); padding:26px 0 2px}

/* ---- buttons / CTAs ---- */
a.button,.button,input[type=submit],.wp-block-button__link,.et_pb_button,.btn,.elementor-button,.sppb-btn{
  display:inline-block; background:linear-gradient(135deg,var(--accent-2),var(--accent)); color:#fff!important;
  padding:13px 26px; border-radius:12px; font-family:var(--font-head); font-weight:650; font-size:.98rem; border:0; cursor:pointer;
  text-decoration:none!important; box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 32%,transparent),var(--shadow-s); transition:transform .16s,box-shadow .16s}
a.button:hover,.button:hover,.wp-block-button__link:hover,.btn:hover,.elementor-button:hover{transform:translateY(-2px); box-shadow:0 10px 26px color-mix(in srgb,var(--accent) 40%,transparent)}
input[type=text],input[type=search],input[type=email],input[type=tel],textarea,select{
  padding:12px 14px; border:1px solid var(--line); border-radius:12px; font:inherit; max-width:100%; background:var(--soft); transition:border .15s,box-shadow .15s}
input:focus,textarea:focus,select:focus{outline:0; border-color:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 14%,transparent)}

/* ---- hero (recreated landing pages) — full-bleed gradient band ---- */
.hero{width:100vw; margin-left:calc(50% - 50vw); text-align:center; padding:78px 22px 66px; margin-top:0; margin-bottom:44px;
  background:
    radial-gradient(1100px 500px at 50% -10%, color-mix(in srgb,var(--accent) 14%,transparent), transparent 60%),
    linear-gradient(180deg,var(--soft) 0%,#fff 100%);
  border-bottom:1px solid var(--line)}
.hero > *{max-width:var(--maxw); margin-left:auto; margin-right:auto}
.hero h1{font-size:3rem; margin:.12em auto .32em; max-width:14ch}
.hero .lead{font-size:1.24rem; color:var(--muted); max-width:640px; margin:0 auto 1.7em; letter-spacing:-.01em}
.hero .eyebrow{display:inline-block; text-transform:uppercase; letter-spacing:.16em; font-size:.78rem; font-weight:700;
  font-family:var(--font-head); color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,transparent);
  padding:6px 14px; border-radius:999px; margin-bottom:16px}

/* sections + cards */
.pro-section{margin:52px 0}
.pro-section > h2{text-align:center; margin-bottom:.15em}
.pro-section > .pro-sub{text-align:center; color:var(--muted); margin:0 auto 1.8em; max-width:560px}
.pro-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px}
.pro-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:28px 26px;
  box-shadow:var(--shadow-s); position:relative; overflow:hidden; transition:transform .2s,box-shadow .2s,border-color .2s}
.pro-card::before{content:''; position:absolute; inset:0 0 auto 0; height:3px; background:linear-gradient(90deg,var(--accent-2),var(--accent)); opacity:0; transition:opacity .2s}
.pro-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-l); border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
.pro-card:hover::before{opacity:1}
.pro-card h3{margin:0 0 .5em; font-size:1.2rem; color:var(--ink)}
.pro-card p{margin:0; color:var(--muted)}
.pro-center{text-align:center}
.pro-contact{background:linear-gradient(135deg,var(--soft),var(--soft-2)); border:1px solid var(--line); border-radius:var(--radius); padding:36px 28px; text-align:center}
.pro-contact a{font-weight:650}

/* article / post / forum content cards */
.post,.entry,article,.hentry,.type-post,.blog-post,.sppb-article,.item-page{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:26px 30px; margin:0 0 24px; box-shadow:var(--shadow-s)}
article h1,article h2,.post h2,.entry h2{margin-top:.2em}

/* ---- footer — full-bleed dark band ---- */
footer,.site-footer,#footer,.footer{width:100vw; margin-left:calc(50% - 50vw); margin-top:56px; padding:40px 22px;
  background:var(--ink); color:#aeb9c6; font-size:.92rem; text-align:center; border-top:0}
footer a,.site-footer a,#footer a{color:#dfe7f0}

/* ===== dead static-restore chrome / duplicate artifacts — hide ===== */
.pro-hide{display:none!important}
.skip-link,.skip-to-content,.screen-reader-text,.sr-only,.menu-toggle,.mobile-nav,.mobile-menu,.et_mobile_menu,
.hamburger,.nav-toggle,.wp-block-navigation__responsive-container-open,.wp-block-navigation__responsive-container-close,
.et_pb_menu__search,.searchbox-toggle{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sub-menu,.children{position:static!important}
.wp-block-search,form.searchform,.search-form,form[role="search"],.et_pb_search,.widget_search,#searchform,.searchbox,.nav-search{display:none!important}
a.button:empty,.button:empty,.elementor-button:empty,.et_pb_button:empty,.wp-block-button__link:empty,
.elementor-widget-empty,.elementor-element:empty,.et_pb_module:empty,.widget:empty{display:none!important}
.mm-toggler,.mm-toggler-link,.navbar-toggler,.menu-toggle,.mobile-toggle,button.navbar-toggle,button:empty,
button[class*="toggle"],button[class*="toggler"],.caret,.dropdown-toggle::after,[class*="hamburger"],
.et_pb_menu__wrap .et_pb_menu__search-button,.btn-menu-mobile,.btn-menu-only,.tf-close,.tf-icon-search,.tf-icon-menu,
.close-menu-panel-style-default,.elementor-menu-toggle,.mobile_menu_button,.mobile-menu-icon,.burger-menu,.mfp-close{display:none!important}
/* hide Elementor Theme-Builder header ONLY where a clean nav was injected (privee interiors,
   marked by .pro-brand) — other Elementor sites keep their header nav */
body:has(.pro-brand) .elementor-location-header{display:none!important}
[class*="n2-ss"],[class*="n2-section"],[id*="n2-ss"],.n2-ss-slider,.smart-slider,[data-ssid],.nextend-smartslider,.n2-section-smartslider,.sp-slider,.slider-container:empty{display:none!important}
.sharethis-sticky-share-buttons,.st-sticky-share-buttons,#sharethis,.addtoany_share_save_container,.a2a_floating_style,.sharethis-inline-share-buttons{display:none!important}
.chaty-widget,#chaty-widget-0,.wp-chat,.tawk-min-container,[id*="tawkchat"],.fb_dialog{display:none!important}
/* empty social-icon nav bars (icons don't render on static restore -> ugly empty colored band) */
.social-navigation,nav.social-navigation,.menu-social-container,.social-links-menu,ul.social-menu:empty,.site-top .menu-social-container{display:none!important}
/* Woodmart isotope filter/sort controls (dead on static restore) -> hide */
.iso-filter,.filter-bg-decoration,.filter-categories,.filter-extras,[class*="iso-filter"]{display:none!important}
/* Woodmart post cards: the dark title-overlay shows as a grey box when the thumbnail image is
   missing (common on a static restore) -> paint it an accent gradient banner instead */
.post-entry-content,.blog-shortcode .post-thumbnail,[class*="blog-masonry"] .post-thumbnail{
  background:linear-gradient(135deg,var(--accent-2),var(--accent))!important;
  background-image:linear-gradient(135deg,var(--accent-2),var(--accent))!important}
.blog-shortcode .post-thumbnail-rollover,[class*="blog-masonry"] .post-thumbnail-rollover{display:none!important}
img[src*="data:image/gif"],img[src*="placeholder"]:not([srcset]){opacity:0}
/* Joomla EasyBlog: force module grids full-width (were trapped in a ~360px column), hide empty
   blog notices + system-alert close buttons */
.mod-grid,[class*="mod-grid"],.mod-item,.eb-mod-context,.eb-mod-title,.eb-mod{width:100%!important;max-width:100%!important;grid-template-columns:1fr!important;float:none!important}
.eb-empty,.easyblog-empty,.eb-blog-empty,.mod-empty,.eb-image-popup,.eb-popup,.eb-modal{display:none!important}
.joomla-alert,.joomla-alert__close,.alert .close,button.close,.close[data-dismiss],#system-message-container .close{display:none!important}
/* MyBB forum board tables -> modern rounded card list with gradient category headers */
table.forum_main,table.tborder,table.tborder2{border:1px solid var(--line)!important;border-radius:var(--radius)!important;
  overflow:hidden;box-shadow:var(--shadow-s)!important;margin:0 0 22px!important;border-collapse:separate!important;border-spacing:0;background:#fff!important}
table.forum_main td,table.tborder td,table.tborder2 td,.trow1,.trow2{border:0!important;border-bottom:1px solid var(--line)!important;padding:15px 18px!important;vertical-align:middle}
.thead,td.thead,.tcat,td.tcat,thead td.thead,.thead2_main,.thead_wrap,.thead2_left,.thead2_right2,.thead_title,[class*="thead2"]{
  background:linear-gradient(135deg,var(--accent-2),var(--accent))!important;
  color:#fff!important;font-family:var(--font-head)!important;font-weight:700;letter-spacing:-.01em}
.thead a,.tcat a,td.thead a,td.tcat a,.thead strong,.tcat strong,.thead_title,.thead2_main a,[class*="thead2"] a,[class*="thead"] strong{color:#fff!important}
tr:hover td.trow1,tr:hover td.trow2{background:var(--soft)!important}
.pro-injhero{margin-top:0}

@media (max-width:640px){
  body{font-size:16px; padding:0 15px!important}
  h1{font-size:1.9rem} h2{font-size:1.5rem} .hero h1{font-size:2.1rem} .hero{padding:54px 18px 44px}
  .pro-nav{padding:10px 12px!important} .pro-nav a{padding:8px 12px; font-size:.9rem}
}