/*
Theme Name: Enfold Child
Description: Child theme for Enfold — Skintattoo (skintattoo.cru2.net). Replicates tristero look.
Version: 1.1
Template: enfold
*/

/* ===================== Design tokens (from original) ===================== */
:root {
  --st-body-font: 'Roboto', Helvetica, Arial, sans-serif;
  --st-head-font: 'Roboto Slab', Georgia, serif;
  --st-text: #353535;
  --st-ink: #000000;
  --st-white: #ffffff;
  --st-dark-bg: #000000;
  --st-accent: #e8552d;     /* orange "originali" accent */
  --st-pink: #f2a9a0;       /* "area riservata" band */
}

/* ===================== Base typography ===================== */
body,
.responsive #top .av_textblock_section,
#top .av-special-heading-tag,
#top p {
  font-family: var(--st-body-font);
  color: var(--st-text);
}
#top body { font-size: 15px; line-height: 1.7; }

/* Headings — Roboto Slab, bold, uppercase, tracked (matches H2/H4 tokens) */
#top h1, #top h2, #top h3, #top h4, #top h5, #top h6,
#top .av-special-heading-tag,
.html_elegant-blog #top .av-special-heading .av-special-heading-tag {
  font-family: var(--st-head-font);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--st-ink);
}
#top h2, #top .av-special-heading-tag { letter-spacing: 8px; }
#top h4 { letter-spacing: 4px; }

/* Links/buttons baseline (square, brand) */
#top .avia-button,
#top .av-woo-add-to-cart-button,
#top .single_add_to_cart_button,
#top .button {
  border-radius: 0;
  font-family: var(--st-head-font);
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: 700;
}

/* Dark section helper — apply class 'st-dark' to an av_section */
#top .st-dark,
#top .st-dark .av-special-heading-tag,
#top .st-dark p,
#top .st-dark h1, #top .st-dark h2, #top .st-dark h3, #top .st-dark h4 {
  color: var(--st-white);
}
#top .st-dark { background-color: var(--st-dark-bg); }

/* ===================== Full-bleed page layout ===================== */
body.st-fullbleed #top #main .container_wrap { padding: 0 !important; }
body.st-fullbleed #top #main .container { max-width: none !important; width: 100% !important; padding: 0 !important; }
body.st-fullbleed #top #main .content.template-page,
body.st-fullbleed #top #main .container .content {
  width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
body.st-fullbleed #top #main .sidebar { display: none !important; }
body.st-fullbleed #top .title_container,
body.st-fullbleed #top .stretch_full.title_container { display: none !important; }
body.st-fullbleed #top #main .entry-content-wrapper { padding: 0 !important; margin: 0 !important; }
body.st-fullbleed #top .av-content-small,
body.st-fullbleed #top .av-content-full { max-width: none !important; width: 100% !important; }

/* ===================== Skintattoo homepage ===================== */
/* st-home itself breaks out to the full viewport and becomes the clip context,
   so sections are simple full-width children (no per-section breakout to mis-centre). */
.st-home { font-family: var(--st-body-font);
  width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  overflow-x: hidden; }
.st-home p { font-size: 15px; line-height: 1.75; }

.st-sec { position: relative; width: 100%;
  padding: 90px 0; background-size: cover; background-position: center; }
/* full-screen-width content to match the original (was capped at 1300px) */
.st-wrap { max-width: none; width: 100%; margin: 0 auto; padding: 0 50px; position: relative; z-index: 2; }
/* boxed sections (features, area-riservata, contacts) — not full bleed in the original */
.st-wrap--boxed { max-width: 1200px; }
/* keep forms readable, not stretched edge-to-edge */
.st-contactbody__form, .st-contacts__form { max-width: 1100px; }

/* Hero = original RevSlider, full-bleed, no padding */
.st-hero-rev { padding: 0; }
.st-hero-rev .rev_slider_wrapper, .st-hero-rev rs-module-wrap { margin: 0 !important; }

/* Trust badges row (white) */
.st-badges { background: #ffffff; padding: 50px 0; }
.st-badges__row { display: flex; justify-content: center; align-items: center; gap: 60px; flex-wrap: wrap; }
.st-badges__row img { height: 110px; width: auto; }

/* SkinPop reseller logo */
.st-reseller__logo { display: block; margin: 0 auto 24px; max-height: 90px; width: auto; }
.st-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.55); z-index: 1; }
.st-overlay--dark { background: rgba(0,0,0,.7); }

.st-h2 { font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 8px; font-size: 38px; color: var(--st-ink); margin: 0 0 36px; text-align: center; }
.st-h2--light { color: #fff; }
.st-h2--xl { font-size: 48px; }

/* Buttons */
.st-btn { display: inline-block; font-family: var(--st-head-font); font-weight: 700;
  text-transform: uppercase; letter-spacing: 2px; font-size: 13px; padding: 16px 34px;
  border-radius: 0; text-decoration: none; transition: .2s; border: 2px solid transparent; line-height: 1; }
.st-btn--accent { background: var(--st-accent); color: #fff; }
.st-btn--accent:hover { background: #fff; color: var(--st-accent); }
.st-btn--dark { background: #000; color: #fff; }
.st-btn--dark:hover { background: #fff; color: #000; }

/* Hero */
.st-hero { padding: 130px 0; }
.st-hero__grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 40px; }
.st-hero__title { font-family: var(--st-head-font); font-weight: 900; text-transform: uppercase;
  color: #fff; font-size: 78px; line-height: .95; letter-spacing: 4px; margin: 0 0 18px; }
.st-hero__sub { color: #e6e6e6; font-size: 18px; margin: 0 0 30px; max-width: 460px; }
.st-hero__media img { max-width: 100%; height: auto; display: block; margin: 0 auto;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,.6)); }

/* Features */
.st-features { background: #fff; padding: 80px 0; }
.st-features__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 50px; }
.st-feature { text-align: center; }
.st-feature img { width: 92px; height: auto; margin: 0 auto 18px; display: block; }
.st-feature h4 { font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 4px; font-size: 20px; color: #000; margin: 0 0 14px; }
.st-feature p { color: #555; font-size: 14px; }

/* Category + product grids: style Woo output as square tiles */
.st-cats { background: #f5f5f5; }
.st-cats ul.products, .st-products ul.products { display: grid !important;
  grid-template-columns: repeat(5,1fr); gap: 14px; margin: 0; list-style: none; }
.st-cats ul.products li, .st-products ul.products li { width: auto !important; margin: 0 !important;
  float: none !important; background: #fff; text-align: center; padding: 14px; }
.st-cats ul.products li a img, .st-products ul.products li img { width: 100%; height: auto; margin: 0 0 10px; }
.st-cats ul.products li h2, .st-cats ul.products li .woocommerce-loop-category__title,
.st-products ul.products li h2, .st-products ul.products li .woocommerce-loop-product__title {
  font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 2px; font-size: 12px; color: #000; padding: 6px 0; }
.st-products ul.products li .price { color: #000; font-weight: 700; display: block; margin: 4px 0; }
.st-products ul.products li .button { background: transparent; color: #000; border: 1px solid #000;
  border-radius: 0; font-size: 11px; }

/* Marquee band — white bg, scrolling (matches original) */
.st-marquee { background: #ffffff; padding: 26px 0; overflow: hidden;
  border-top: 1px solid #ececec; border-bottom: 1px solid #ececec; }
.st-marquee__track { display: flex; width: max-content; animation: st-scroll 28s linear infinite; }
.st-marquee__item { font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 6px; font-size: 30px; color: #141414; white-space: nowrap; padding-right: 36px; }
.st-marquee__item em { color: var(--st-accent); font-style: normal; }
.st-marquee__item i { color: var(--st-accent); font-style: normal; margin: 0 16px; }
@keyframes st-scroll { from { transform: translateX(0); } to { transform: translateX(-33.333%); } }

/* Split (piercings / merch) */
.st-split { background-color: #000; }
.st-split__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.st-split__col { text-align: center; color: #ddd; }
.st-split__col .st-h2 { margin-bottom: 18px; }
.st-split__col p { color: #cfcfcf; margin: 0 0 26px; }

/* Reseller */
.st-reseller { background-color: #000; text-align: center; }
.st-reseller__regions { font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 6px; color: #fff; font-size: 18px; margin: 0 0 30px; }
.st-reseller__regions span { color: var(--st-accent); margin: 0 10px; }

/* Area riservata / B2B */
.st-b2b { background-color: var(--st-pink); background-position: center right; background-size: cover;
  background-repeat: no-repeat; padding: 130px 0; min-height: 560px; display: flex; align-items: center; }
.st-b2b__inner { display: flex; width: 100%; }
.st-b2b__copy { max-width: 560px; }
.st-b2b__copy .st-h2 { text-align: left; }
.st-b2b__copy p { color: #1d1d1d; font-size: 16px; margin: 0 0 28px; }

/* Contacts */
.st-contacts { background: #fff; }
.st-contacts__form { max-width: 820px; margin: 0 auto; }

/* ===================== Chi Siamo + shared page blocks ===================== */
.st-center { text-align: center; margin-top: 30px; }
.st-hero--page { padding: 130px 0 100px; text-align: center; position: relative;
  background-image: url('https://skintattoo.cru2.net/wp-content/uploads/2020/04/landing-bottom-bck.jpg');
  background-size: cover; background-position: center; }
.st-hero--page::before { content: ''; position: absolute; inset: 0; background: rgba(8,8,8,.72); z-index: 1; }
.st-hero--page .st-wrap { position: relative; z-index: 2; }
.st-hero__title--page { font-size: 46px; line-height: 1.15; letter-spacing: 3px;
  max-width: 1000px; margin: 0 auto; color: #fff; }
.st-hero__sub2 { display: block; font-size: 24px; letter-spacing: 4px; margin-top: 10px; opacity: .92; }

/* Mission / Reason / Vision — orange | dark | purple band */
.st-mv { background: #1a1a1a; padding: 0; }
.st-mv__grid { display: grid; grid-template-columns: 1fr 1fr 1fr; max-width: none; padding: 0; }
.st-mv__col { padding: 70px 46px; }
.st-mv__col p { font-size: 15px; line-height: 1.75; }
.st-mv__col--mission { background: var(--st-accent); color: #fff; }
.st-mv__col--mission p { color: #fff; }
.st-mv__col--mission .st-h2 { text-align: left; }
.st-mv__col--reason { background: transparent; color: #fff; }
.st-mv__col--reason h3 { font-family: var(--st-head-font); text-transform: uppercase;
  letter-spacing: 3px; font-size: 22px; color: #fff; margin: 0 0 18px; }
.st-mv__col--vision { background: #7a2a82; color: #fff; }
.st-mv__col--vision p { color: #fff; }
.st-mv__col--vision .st-h2 { text-align: left; }

/* Team */
.st-team { background: #fff; }
.st-team__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
.st-team__member { margin: 0; }
.st-team__member img { width: 100%; height: auto; display: block; filter: grayscale(1); }

/* Values (dark) */
.st-values { background-color: #000; }
.st-values__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.st-value { text-align: center; }
.st-value img { width: 100%; height: auto; display: block; filter: grayscale(1); margin: 0 0 18px; }
.st-value h3 { font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 4px; font-size: 22px; color: #fff; margin: 0 0 10px; }
.st-value__hl { color: #fff; background: #7a2a82; display: inline-block; padding: 4px 16px; }
.st-value p { color: #bbb; font-size: 14px; }

/* ===================== Contatti ===================== */
.st-h2--left { text-align: left; }
.st-eyebrow { font-family: var(--st-head-font); text-transform: uppercase; letter-spacing: 3px;
  font-size: 12px; color: var(--st-accent); margin: 0 0 6px; }
.st-contactbody { background: #fff; }
.st-contactbody__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
.st-contact-list { list-style: none; margin: 18px 0 40px; padding: 0; }
.st-contact-list li { padding: 10px 0; border-bottom: 1px solid #eee; font-size: 15px; }
.st-contact-list strong { font-family: var(--st-head-font); text-transform: uppercase;
  letter-spacing: 1px; font-size: 13px; color: #000; margin-right: 6px; }
.st-contactbody__form .wpcf7 input[type=text],
.st-contactbody__form .wpcf7 input[type=email],
.st-contactbody__form .wpcf7 textarea { width: 100%; border: 1px solid #ddd; padding: 12px;
  margin: 6px 0 14px; border-radius: 0; font-family: var(--st-body-font); }
.st-contactbody__form .wpcf7 input[type=submit] { background: var(--st-accent); color: #fff;
  border: 0; border-radius: 0; font-family: var(--st-head-font); text-transform: uppercase;
  letter-spacing: 2px; padding: 14px 34px; cursor: pointer; }

.st-bullets { margin: 20px 0 0; padding: 0 0 0 0; list-style: none; }
.st-bullets li { padding: 8px 0 8px 22px; position: relative; font-size: 15px; }
.st-bullets li::before { content: "–"; position: absolute; left: 0; color: var(--st-accent); font-weight: 700; }

/* ===================== Light-text overrides on dark/coloured sections =====================
   Base rules #top h1..h4 / #top p / Enfold #top a all have specificity (1,0,1) and were
   overriding single-class section rules (0,1,0). Prefixing #top here gives (1,2,0)+ so light
   text wins wherever the background is dark or coloured. */
#top .st-hero--page .st-hero__title--page,
#top .st-hero--page .st-hero__sub2,
#top .st-dark h1, #top .st-dark h2, #top .st-dark h3, #top .st-dark h4, #top .st-dark p,
#top .st-h2--light,
#top .st-split .st-h2--light,
#top .st-reseller .st-h2--light, #top .st-reseller .st-reseller__regions,
#top .st-mv__col--mission h2, #top .st-mv__col--mission h3, #top .st-mv__col--mission p,
#top .st-mv__col--vision h2, #top .st-mv__col--vision h3, #top .st-mv__col--vision p,
#top .st-mv__col--reason h3, #top .st-mv__col--reason p,
#top .st-values h2, #top .st-values .st-value p,
#top .st-b2b__copy .st-h2 { color: #ffffff !important; }

#top .st-b2b__copy .st-h2 { text-shadow: 0 2px 10px rgba(0,0,0,.45); }
#top .st-split .st-split__col p { color: #cfcfcf !important; }
#top .st-reseller__regions span { color: var(--st-accent) !important; }

/* Values labels = coloured bars (ascolto orange, confronto white/black, crescita purple) */
#top .st-values__grid .st-value h3 { display: inline-block; padding: 7px 22px; margin: 0 0 12px; letter-spacing: 4px; }
#top .st-values__grid .st-value:nth-child(1) h3 { background: var(--st-accent) !important; color: #fff !important; }
#top .st-values__grid .st-value:nth-child(2) h3 { background: #ffffff !important; color: #000 !important; }
#top .st-values__grid .st-value:nth-child(3) h3 { background: #7a2a82 !important; color: #fff !important; }

/* buttons: beat Enfold #top a link colour */
#top a.st-btn--accent, #top .st-btn--accent { color: #ffffff !important; }
#top a.st-btn--dark, #top .st-btn--dark { color: #ffffff !important; }
#top a.st-btn--accent:hover { color: var(--st-accent) !important; }
#top a.st-btn--dark:hover { color: #000000 !important; }

/* footer / socket text light */
#top #socket, #top #socket p, #top #socket a, #top #socket .copyright,
#top #footer .copyright, #top #footer .copyright a { color: #aaaaaa !important; }

/* ===================== Header (dark, brand) ===================== */
#top #wrap_all #header { background-color: #111111 !important; box-shadow: none; }
#top #header .header_bg, #top .header_bg { background-color: #111111 !important; border: 0 !important; }
#top #header_meta, #top .av_header_top { background-color: #111111 !important; border: 0 !important; }
/* ---- Divided header: centred logo as middle menu item (desktop) ---- */
@media only screen and (min-width: 990px) {
  #top #header .logo { display: none !important; }
  #top #header #header_main .container { min-height: 88px; }
  #top #header .main_menu { position: static !important; float: none !important; width: 100% !important; }
  #top #header .av-main-nav { display: flex !important; justify-content: center !important;
    align-items: center !important; float: none !important; width: 100%; }
  #top #header .av-main-nav > li { background: transparent !important; }
  #top #header .av-main-nav > li > a { height: 88px !important; line-height: 88px !important; padding: 0 18px !important; }
  #top #header .av-main-nav > li.av-logo-menu-item { margin: 0 18px; }
  #top #header .av-main-nav > li.av-logo-menu-item > a {
    width: 92px; padding: 0 !important;
    background: url('https://skintattoo.cru2.net/wp-content/uploads/2023/01/logo2.png') center center / contain no-repeat; }
  #top #header .av-main-nav > li.av-logo-menu-item > a .avia-menu-text,
  #top #header .av-main-nav > li.av-logo-menu-item > a::after { display: none !important; }
}
/* mobile: keep default logo, hide the logo menu-item from the list */
@media only screen and (max-width: 989px) {
  #top #header .av-logo-menu-item { display: none !important; }
}
#top #header_main, #top #header_main_alternate,
#top .av_header_transparency #header_main { background-color: transparent !important; border-bottom: 0 !important; }
#top #header .av-main-nav > li > a,
#top #header .av-main-nav > li > a .avia-menu-text { color: #ffffff !important;
  font-family: var(--st-head-font); font-weight: 700; text-transform: uppercase;
  letter-spacing: 2px; font-size: 13px; }
#top #header .av-main-nav > li > a:hover .avia-menu-text,
#top #header .av-main-nav > li.current-menu-item > a .avia-menu-text,
#top #header .av-main-nav > li.current_page_item > a .avia-menu-text { color: var(--st-accent) !important; }
#top .logo img, #top .logo a img { max-height: 60px; width: auto; }
#top #header .av-main-nav .cart_dropdown_link, #top #header .avia-menu-fx,
#top #header_main .avia_mega_div, #top #header a.cart_dropdown_first { color: #fff; }
#top #header .shopping_cart_inner, #top #header_meta a { color: #fff !important; }
.html_header_sticky_disabled #header { position: relative; }
/* keep menu items vertically centred with 60px logo */
#top .av_logo_right #menu-item-search, #top #header .av-main-nav > li { display: inline-block; }

/* ===================== Footer (dark, brand) ===================== */
#top #footer { background-color: #111111 !important; color: #bbb; }
#top #footer .widgettitle { color: #fff; font-family: var(--st-head-font);
  text-transform: uppercase; letter-spacing: 2px; font-size: 15px; }
#top #footer a { color: #ccc; }
#top #footer a:hover { color: var(--st-accent); }
#top #socket { background-color: #0a0a0a !important; color: #888; }

/* Responsive */
@media (max-width: 989px) {
  .st-hero__grid, .st-split__grid { grid-template-columns: 1fr; }
  .st-features__grid { grid-template-columns: 1fr; gap: 30px; }
  .st-cats ul.products, .st-products ul.products { grid-template-columns: repeat(2,1fr) !important; }
  .st-hero__title { font-size: 52px; }
}