/**
Theme Name: drmichelepelliccioni
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: drmichelepelliccioni
Template: astra
*/

section#home-hero {
    background: linear-gradient(rgba(185, 207, 57, 0.04) 1px, transparent 1px), 
    linear-gradient(90deg, rgba(185, 207, 57, 0.04) 1px, transparent 1px), 
    linear-gradient(160deg, #0e0f03 0%, #17172f 60%, #1a2010 100%);
position:relative;
}
section#home-hero:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(185,207,57,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(185,207,57,0.04) 1px, transparent 1px);
    background-size: 80px 80px;
    pointer-events: none;
}
.ast-page-builder-template .entry-header.ast-header-without-markup {
    display: none !important;
}
.treatment-card {
    background: rgba(253, 251, 248, 0.04);
    border: 1px solid rgba(188, 173, 164, 0.1);
    padding: 32px 28px;
    transition: all 0.3s;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    position: relative;
    overflow: hidden;
    margin: inherit;
    width: 32.8% !important;
    margin-bottom: 4px;
}
#treatment-sec .elementor-accordion .elementor-accordion-item {
    border: none !important;
}
.my-accordion a.elementor-accordion-title {
    text-decoration: none;
    font-size: 14px !important;
    width: 100%;
    background: none;
    border: none;
    text-align: left;
    font-family: 'DM Sans', sans-serif;
    color: #fdfbf8;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
line-height: 22px;
}
#treatment-sec .elementor-accordion .elementor-accordion-item p {
    margin-bottom: 12px;
    font-size: 13px;
    color: #bcada4 !important;
}
#treatment-sec .elementor-accordion .elementor-accordion-item .elementor-accordion-icon svg {
	fill: #B9CF39 !important
}
.treatment-card .elementor-element-populated {
    padding: 0 !important;
    background: none !important;
    border: none !important;
}
.treatment-card .card-count {
    margin-bottom: 8px !important;
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    color: #B9CF39 !important;
    opacity: 0.6;
    transition: color 0.3s !important;
}
.treatment-card .card-count span {
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    color: #B9CF39 !important;
    opacity: 0.6;
    transition: color 0.3s !important;
}
.treatment-card .name {
    margin-bottom: 0px !important;
}
.treatment-card .name h2 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 22px;
    font-weight: 400;
    color: #fdfbf8 !important;
    margin-bottom: 10px;
    transition: color 0.3s;
}
.treatment-card .description p {
    font-size: 13px;
    color: #bcada4 !important;
    line-height: 1.7;
    margin-bottom: 0px !important;
    transition: color 0.3s;
    font-family: 'DM Sans' !important;
}
.treatment-card .scorpi a {
    font-size: 11px;
    font-weight: 700 !important;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #b9cf39;
    text-decoration: none !important;
    background: transparent !important;
    padding: 0;
}
.treatment-card .scorpi a span {
    display: flex;
    flex-direction: row-reverse;
    gap: 9px;
    fill: #b9cf39;
}
.treatment-card .elementor-element-populated {
    padding: 0 !important;
}
#scroll-down {
  position: relative;
  animation: scroll 1.5s linear infinite;
cursor:pointer;
}

@keyframes scroll {
  0% {
    top: 0;
  }
  50% {
    top: 15px;
  }
  100% {
    top: 0;
  }
}

#scroll-down:hover {
  animation-play-state: paused;
}

.elementor-103 .elementor-element.elementor-element-2f799dc .elementor-icon-box-title {
    margin-bottom: 10px;
}
#select .overflow-items {
    max-height: 0;
    overflow: hidden;
	transition: all 0.3s;
}
#select .select-body-part-card {
    min-height: 350px;
}
#select .select-body-part-card:hover .overflow-items {
    max-height: 100%;
    overflow: hidden;
	transition: all 0.3s;
	padding-top: 20px;
}
.select-body-part-card .badge {
    position: absolute;
    top: 20px;
}
#select .title {
	margin-bottom: 0;
}
section#center {
    min-height: 100%;
}
section#center .elementor-container.elementor-column-gap-default {
    min-height: 100% !important;
}
.about-photo {
    width: 100%;
    aspect-ratio: 3/4;
    background: linear-gradient(160deg,#17172f 0%,#2a3520 100%);
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.about-photo-svg {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.12;
}
.about-photo-label {
    font-size: 40px;
    font-style: italic;
    color: rgba(253,251,248,0.1);
    text-align: center;
}
.about-photo-svg svg {
    width: 55%;
    height: 55%;
    color: var(--taupe);
}
.wp-block-icb-image-compare .icbImageCompare .icb-comparison-wrapper .icb-image-wrapper>img {
    height: 160px !important;
}
.wp-block-icb-image-compare .icbImageCompare .icb-comparison-wrapper {
    height: 160px !important;
}
.icbImageCompare {
    width: 100% !important;
}
.icb-label, .elementor-tab-title.elementor-tab-mobile-title {
    display: none;
}
.wp-block-icb-image-compare .icbImageCompare .icb-comparison-wrapper .icb-comparison-slider-handle .icb-default-icon {
    background: #B9CF39 !important;
    border: 3px solid #B9CF39 !important;
    height: 10px !important;
    width: 10px !important;
}
.icb-comparison-slider-handle::before {
	background: #B9CF39 !important
}
.elementor-element-0423265 .elementor-tab-title.elementor-active {
    background: #b9cf39;
    padding: 7px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.elementor-element-0423265 .elementor-widget-tabs .elementor-tabs-wrapper {
    overflow-x: auto;
    display: flex;
    gap: 10px;
}
.elementor-element-0423265 .elementor-tab-title {
    padding: 7px 18px;
    border: 1px solid rgba(188, 173, 164, 0.2) !important;
	height: fit-content !important;
}
.elementor-element-0423265 .elementor-tab-title:hover {
	background: #b9cf39;
	color: white !important;
}
#drop .elementor-tab-title.elementor-tab-mobile-title.elementor-active {
    display: none;
}
.icb-comparison-slider-handle::after {
	background: #b9cf39 !important;
}
 #drop .elementor-tab-content.elementor-clearfix.elementor-active {
    padding: 40px 0 0 0 !important;
}
#drop .elementor-clearfix.elementor-active .elementor-column-gap-default>.elementor-column>.elementor-element-populated {
    padding: 0 !important;
}
section.elementor-section.elementor-inner-section.elementor-element.elementor-element-a48fada {
    position: sticky;
    top: 32px;
	background-color: #17172F;
	z-index:1;
}
#drop .badge {
    display: inline-block;
    padding: 2px 8px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 6px;
    width: fit-content;
    background: #b9cf39;
    margin: 0 20px;
	margin-bottom: 5px !important;
}
#drop .badge h6 {
    font-family: 'DM Sans';
    font-size: 9px !important;
    font-weight: 700 !important;
    padding: 2px 0;
color: #0e0f03 !important;
}
#drop .title h2 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 17px !important;
    margin-bottom: 3px;
    color: #fdfbf8;
}
#drop .title {
    margin:0 20px !important;
}
#drop .text p {
    font-size: 11px;
    font-family: 'DM Sans';
    color: #bcada4;
}
#drop .text {
	margin: 0 20px;
    margin-bottom: 20px;
}

#drop .elementor-column.elementor-col-25 .elementor-widget-wrap.elementor-element-populated:hover {
     border-color: rgba(185, 207, 57, 0.5) !important;
	transition: all 0.2s;
}
#drop .elementor-column.elementor-col-25 .elementor-widget-wrap.elementor-element-populated {
    margin: 3px !important;
	border: 1px solid rgba(188,173,164,0.08) !important;
}
.treatment-card:before {
    content: '';
    position: absolute;
    inset: 0;
    background: #b9cf39;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 0;
}
.treatment-card:hover::before {
    transform: scaleX(1);
}

.treatment-card:hover .description .elementor-heading-title, .treatment-card:hover .name .elementor-heading-title, .treatment-card:hover .scorpi a, .treatment-card:hover .card-count span {
	color: #0e0f03 !important;
}
.treatment-card:hover .scorpi a span {
	fill: #0e0f03 !important;
}
#treatment-sec .elementor-tabs-wrapper {
    border-bottom: 1px solid rgba(188, 173, 164, 0.18);
}
#treatment-sec .elementor-active:before {
    content: "";
    background: #B9CF39;
    width: 100%;
    z-index: 9;
    height: 2px !important;
    left: 1px;
}
#treatment-sec .elementor-tabs .my-accordion .elementor-tab-content.elementor-clearfix.elementor-active {
    padding: 0 !important;
}
.my-accordion .elementor-accordion-item .elementor-tab-title {
    padding: 13px 0 !important;
    border-top: 1px solid rgba(188, 173, 164, 0.08) !important;
    text-transform: capitalize !important;
    color: white !important;
}
.my-accordion .elementor-accordion-item .elementor-tab-title a {
   
    color: #fdfbf8 !important;
}
#treatment-sec .elementor-accordion-item .elementor-tab-content {
    border: none !important;
}
#treatment-sec .elementor-tabs .elementor-tab-content.elementor-clearfix.elementor-active {
    padding: 30px 0  0 0;
}
.treat-row:hover .elementor-container.elementor-column-gap-default {
    transform: translate(20px) !important;
	transition: all 0.3s;
    
}
.treat-row .elementor-container.elementor-column-gap-default {
    transform: translate(0);
	cursor: pointer;
	transition: all 0.3s;
}
.treat-row.highlighted .elementor-container.elementor-column-gap-default {
	transform: translate(20px) !important;
	transition: all 0.3s;
}
.treat-row.highlighted:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: #b9cf39;
	transition: all 0.3s;

}

.highlighted {
    background: rgba(185,207,57,0.06) !important;
	position: relative;
}
#right-col {
  position: sticky;
  top: 58px;
  height: calc(100vh - 58px);
  background: linear-gradient(160deg, #0e0f03 0%, #17172f 60%, #1a2010 100%);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
/* Subtle grid */
#right-col::before {
  content: '';
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(185,207,57,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(185,207,57,0.03) 1px, transparent 1px);
  background-size: 60px 60px; pointer-events: none;
}

.face-wrap {
    position: relative;
    width: 90%;
    max-width: 550px;
}
.face-photo {
  width: 100%; aspect-ratio: 3/4;
/*   background: linear-gradient(160deg, #1a1a2e, #17172f); */
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; position: relative;
}
.face-photo {
    width: 100%;
    min-height: 600px;
/*     background-image: url('https://www.drmichelepelliccioni.it/wp-content/uploads/2026/05/Screenshot-2026-05-18-at-10.05.37.png') !important; */
    background-size: cover !important;
    background-position: 5px;
    background-repeat: no-repeat !important;
    transform: scale(1.5);
}
.face-photo-placeholder {
  font-family: 'Cormorant Garamond', serif; font-size: 18px; font-style: italic;
  color: rgba(253,251,248,0.1); text-align: center; line-height: 1.6;
}

/* ── HOTSPOTS ── */
.hspot {
  position: absolute;
  width: 13px; height: 13px;
  border-radius: 50%;
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: transform 0.2s;
  z-index: 30;
}
.hspot[data-type="med"]  { background: #b9cf39;  animation: pMed  2.5s infinite; }
.hspot[data-type="chir"] { background: #bcada4; animation: pChir 2.5s infinite; }
@keyframes pMed  { 0%{box-shadow:0 0 0 0 rgba(185,207,57,0.7)} 70%{box-shadow:0 0 0 8px rgba(185,207,57,0)} 100%{box-shadow:0 0 0 0 rgba(185,207,57,0)} }
@keyframes pChir { 0%{box-shadow:0 0 0 0 rgba(188,173,164,0.6)} 70%{box-shadow:0 0 0 8px rgba(188,173,164,0)} 100%{box-shadow:0 0 0 0 rgba(188,173,164,0)} }
.hspot:hover { transform: translate(-50%,-50%) scale(1.5); animation: none; }
.hspot.active { transform: translate(-50%,-50%) scale(1.5); animation: none; background: #fdfbf8 !important; }
.hspot[data-type="med"].active  { box-shadow: 0 0 0 4px rgba(185,207,57,0.6); }
.hspot[data-type="chir"].active { box-shadow: 0 0 0 4px rgba(188,173,164,0.5); }

/* Dot number tooltip (small, always visible on hover) */
.hspot-label {
  position: absolute; top: -20px; left: 50%; transform: translateX(-50%);
  font-size: 9px; font-weight: 700; color: #0e0f03; background: #b9cf39;
  padding: 1px 5px; border-radius: 2px; white-space: nowrap;
  opacity: 0; transition: opacity 0.15s; pointer-events: none;
}
.hspot:hover .hspot-label, .hspot.active .hspot-label { opacity: 1; }

#popup {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%) translateX(100%);
  width: 340px;
  max-height: calc(90vh - 50px);
  background: #17172f;
  border-left: 3px solid #b9cf39;
  border-top: 1px solid rgba(185,207,57,0.2);
  border-bottom: 1px solid rgba(185,207,57,0.2);
  box-shadow: -8px 0 40px rgba(0,0,0,0.5);
  z-index: 100;
  overflow-y: auto;
  transition: transform 0.4s cubic-bezier(0.16,1,0.3,1);
  display: flex; flex-direction: column;
}
#popup.visible { transform: translateY(-50%) translateX(0); }

/* Close btn */
.popup-close {
  position: absolute; top: 14px; right: 14px;
  width: 28px; height: 28px; background: rgba(253,251,248,0.08); border: none;
  color: #bcada4; font-size: 16px; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all 0.2s; flex-shrink: 0; z-index: 5; border-radius: 0 !important;
}
.popup-close:hover { background: #b9cf39; color: #0e0f03; }

/* Popup header */
.popup-header { padding: 24px 24px 16px; border-bottom: 1px solid rgba(188,173,164,0.1); flex-shrink: 0; }
.popup-zone-num { font-size: 10px; letter-spacing: 0.35em; text-transform: uppercase; color: #b9cf39; margin-bottom: 6px; }
.popup-title { font-family: 'Cormorant Garamond', serif; font-size: 26px; font-weight: 300; color: #fdfbf8; line-height: 1.1; }
.popup-type-badges { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.popup-badge {
  font-size: 9px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 3px 9px;
}
.popup-badge.med  { background: #b9cf39; color: #0e0f03; }
.popup-badge.chir { background: rgba(253,251,248,0.12); color: #fdfbf8; border: 1px solid rgba(253,251,248,0.2); }

/* Popup body */
.popup-body { padding: 0 24px 24px; flex: 1; }

/* Each treatment block inside popup */
.popup-treatment { padding: 16px 0; border-bottom: 1px solid rgba(188,173,164,0.08); }
.popup-treatment:last-child { border-bottom: none; }
.pt-name {
  font-size: 13px; font-weight: 700; color: #fdfbf8;
  letter-spacing: 0.05em; margin-bottom: 6px;
  display: flex; align-items: center; gap: 7px;
}
.pt-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.pt-dot.med  { background: #b9cf39; }
.pt-dot.chir { background: #bcada4; }
.pt-desc { font-size: 12px; color: #bcada4; line-height: 1.7; margin-bottom: 10px; }

/* Before/after mini inside popup */
.pt-ba {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin-bottom: 8px;
  position: relative;
}
.pt-ba-img {
  aspect-ratio: 3/2; display: flex; align-items: center; justify-content: center;
  font-size: 9px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
}
.pt-ba-img.before { background: linear-gradient(135deg,#1a1a1a,#2a2a20); color: #555; }
.pt-ba-img.after  { background: linear-gradient(135deg,#1a2010,#2a3015); color: #b9cf39; }
.pt-ba-div {
  position: absolute; left: 50%; top: 0; bottom: 0; width: 2px;
  background: #b9cf39; transform: translateX(-50%); z-index: 2;
}
.pt-ba-div::after { content: '◆'; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #b9cf39; font-size: 9px; }
.pt-ba-caption { font-size: 10px; color: var(--t2); text-align: center; margin-top: 4px; }

/* Popup CTA */
.popup-cta {
  display: block; width: 100%; background: #b9cf39; color: #0e0f03;
  padding: 13px 20px; font-size: 11px; font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase; text-decoration: none; text-align: center;
  margin: 16px 24px 24px; width: calc(100% - 48px);
  transition: all 0.2s;
}
.popup-cta:hover { background: #fdfbf8; }
.elementor-element.elementor-element-2ea76f2.elementor-widget.elementor-widget-html {
    position: fixed;
    width: 50%;
    height: 140vh;
}
header.scrolled a.elementor-item.menu-link {
	color: #0E0F03 !important;
}
#black-menu .elementor-element.elementor-element-dc9730c {
    margin-bottom: 0;
}
header.scrolled .elementor-element-a8debb3 {
    background-color: black !important;
}
@media screen and (min-width: 1024px) {
#select section#center #center-card {
    min-height: 704px;
}
div#hamburger-menu {
    margin-bottom: 0;
}

}
@media screen and (max-width: 992px) {
#hero-title br {
    display: none;
}
#drop .elementor-active .elementor-column.elementor-col-25 {
    width: 48.5%;
}
#select #center .select-body-part-card {
    min-height: 707px;
}
}
@media screen and (max-width: 767px) {
#select #center .select-body-part-card {
    min-height: 350px;
}
#black-logo.Visible-logo img {
    display: block;
    width: 60% !important;
	margin: auto;
}
/* 	#drop .elementor-tabs .elementor-tabs-wrapper {
		display: block !important;
	} */
#green-logo.Visible-logo {
    padding-bottom: 8px;
}
#drop .elementor-active .elementor-column.elementor-col-25 {
    width: 100%;
}
#drop .elementor-element-0423265 .elementor-widget-tabs .elementor-tabs-wrapper {
    overflow: scroll !important;
    display: flex;
    gap: 5px;
}
#drop .elementor-element.elementor-element-fbd80d6.elementor-tabs-view-horizontal.elementor-widget.elementor-widget-tabs {
    overflow: hidden;
}
#drop .elementor-element-0423265 .elementor-widget-tabs .elementor-tabs-wrapper .elementor-tab-desktop-title {
    width: fit-content !important;
    min-width: max-content;
}
.popup-close {
/*     top: 160px; */
}
#popup.visible {
    transform: translateY(-36%) translateX(0);
}
#popup {
    top: 370px;
}
.elementor-element.elementor-element-2ea76f2.elementor-widget.elementor-widget-html {
    position: relative;
    width: 100%;
    height: fit-content;
}
.face-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
}
#popup {
    max-height: calc(80vh - 50px);
}
#right-col {
    height: fit-content;
}
	.treatment-card {
		width: 100% !important;
	}
.elementor-accordion .elementor-tab-title .elementor-accordion-icon.elementor-accordion-icon-right {
    float: right;
    text-align: right;
    position: absolute;
    right: 0;
    margin-top: 5px;
}
#drop .elementor-widget-tabs .elementor-tabs-wrapper {
    overflow-x: scroll !important;
}
.elementor-column.elementor-col-50.elementor-inner-column.elementor-element.elementor-element-89c2417 {
    margin-top: 10px;
}
	#treatment-sec .elementor-tabs-wrapper {
		display: block !important;
	}
#treatment-sec .elementor-tabs-wrapper .elementor-tab-title {
    line-height: 17px;
    font-size: 10px;
    padding: 8px;
    text-align: center;
}

}