/*
 * Section: Inner Page Header
 *
 * Full-width hero banner rendered above the stats bar on inner pages.
 * Driven by ACF fields via template-parts/sections/inner-page-header.php.
 *
 * Figma nodes: 431:2023 | 432:1187 | 432:1567 | 441:255 | 432:2532 | 488:3589
 *
 * Design tokens scoped here override nothing in style.css — they extend
 * the existing :root token system without modification.
 */

/* ── Section-scoped tokens ────────────────────────────────────────────────── */

:root {
	--azuri-iph-min-height:        380px;
	--azuri-iph-min-height-tall:   420px;
	--azuri-iph-pad-top:           64px;
	--azuri-iph-pad-bottom:        64px;
	--azuri-iph-container-max:     var(--azuri-container-max, 1100px);
	--azuri-iph-h1-size:           42px;
	--azuri-iph-h1-weight:         300;
	--azuri-iph-h1-lh:             1.18;
	--azuri-iph-h1-ls:             -0.43px;
	--azuri-iph-breadcrumb-size:   11px;
	--azuri-iph-breadcrumb-ls:     1.56px;
	--azuri-iph-desc-size:         15px;
	--azuri-iph-desc-lh:           1.8;
	--azuri-iph-desc-ls:           -0.23px;
	--azuri-iph-pill-size:         11px;
	--azuri-iph-pill-h:            34.5px;
	--azuri-iph-card-radius:       14px;
	--azuri-iph-card-pad:          32px;
	--azuri-iph-btn-radius:        10px;
	--azuri-iph-btn-h:             45px;
	--azuri-iph-btn-h-sec:         48px;
	--azuri-iph-note-radius:       10px;
	--azuri-iph-play-size:         79px;
}

/* ── Base section ─────────────────────────────────────────────────────────── */

.azuri-iph {
	box-sizing:  border-box;
	color:       var(--azuri-color-white);
	display:     block;
	margin:      0;
	max-width:   none;
	min-height:  var(--azuri-iph-min-height);
	overflow:    hidden;
	position:    relative;
	width:       100%;
}

.azuri-iph--text_image,
.azuri-iph--text_card {
	min-height: 100%;
}

/* ── Container — wider than the global default ────────────────────────────── */

.azuri-iph .azuri-iph__container {
	box-sizing:     border-box;
	padding-bottom: 0;
	padding-top:    var(--azuri-iph-pad-top);
}
section.azuri-iph.azuri-iph--text_card .azuri-container.azuri-iph__container {
    padding-top: 0;
}
section.azuri-iph.azuri-iph--text_card .azuri-iph__card {
    margin-top: 0;
}
/* ── Row — stretch columns to equal height ────────────────────────────────── */

.azuri-iph__row {
	align-items: stretch;
}
/* Tables */
table.table {
    text-align: left;
	font-size: var(--azuri-font-size-sm, 14px);
}
table.table th {
    color: var(--azuri-color-teal, #2aadb5);
	text-transform:uppercase;
	font-weight:normal;
}

/* ── Left column — content ────────────────────────────────────────────────── */

.azuri-iph__content {
	display:         flex;
	flex-direction:  column;
	gap:             0;
	justify-content: center;
	padding-right:   var(--azuri-space-8);
}
/* Logo (sub-brand, e.g. Cosmetics) */
.azuri-iph__logo {
	margin-bottom: 30px;
}

.azuri-iph__logo-img {
	display:   block;
	height:    80px;
	max-width: none;
	width:     auto;
}

/* Breadcrumb — wraps rank_math_the_breadcrumbs() output */
.azuri-iph__breadcrumb {
	margin: 0 0 var(--azuri-space-3);
}

/* Rank Math outputs a <nav> or a bare list of <span>/<a> — normalise both */
.azuri-iph__breadcrumb,
.azuri-iph__breadcrumb .rank-math-breadcrumb,
.azuri-iph__breadcrumb .rank-math-breadcrumb p {
	color:          rgba(255, 255, 255, 0.35);
	font-family:    var(--azuri-font-family-base);
	font-size:      var(--azuri-iph-breadcrumb-size);
	font-weight:    var(--azuri-font-weight-regular);
	letter-spacing: var(--azuri-iph-breadcrumb-ls);
	line-height:    1.5;
	margin:         0;
	text-transform: uppercase;
}

.azuri-iph__breadcrumb a,
.azuri-iph__breadcrumb .rank-math-breadcrumb a {
	color:           rgba(255, 255, 255, 0.35);
	text-decoration: none;
	transition:      color 0.15s ease;
}

.azuri-iph__breadcrumb a:hover,
.azuri-iph__breadcrumb a:focus-visible,
.azuri-iph__breadcrumb .rank-math-breadcrumb a:hover,
.azuri-iph__breadcrumb .rank-math-breadcrumb a:focus-visible {
	color:          rgba(255, 255, 255, 0.7);
	text-decoration: none;
	outline:         none;
}

/* Separator (›) inherits the same muted colour */
.azuri-iph__breadcrumb .rank-math-breadcrumb .separator {
	color:   rgba(255, 255, 255, 0.2);
	padding: 0 4px;
}

/* H1 */
.azuri-iph__heading {
	color:          var(--azuri-color-white);
	font-family:    var(--azuri-font-family-base);
	font-size:      var(--azuri-iph-h1-size);
	font-style:     normal;
	font-weight:    var(--azuri-iph-h1-weight);
	letter-spacing: -2.8px;
	line-height:    var(--azuri-iph-h1-lh);
	margin:         0 0 var(--azuri-space-4);
}

.azuri-iph__heading-plain {
	font-style: normal;
}

.azuri-iph__heading-italic {
	font-style: italic;
}

.azuri-iph__heading-italic--teal {
	color: var(--azuri-color-teal);
}

.azuri-iph__heading-italic--pink {
	color: var(--azuri-color-pink);
}

/* Description */
.azuri-iph__description {
	color:          rgba(255, 255, 255, 0.6);
	font-family:    var(--azuri-font-family-base);
	font-size:      var(--azuri-iph-desc-size);
	font-weight:    var(--azuri-font-weight-regular);
	letter-spacing: var(--azuri-iph-desc-ls);
	line-height:    var(--azuri-iph-desc-lh);
	margin:         var(--azuri-space-1) 0 0;
	max-width:      480px;
}

/* ── Pills / Tags ─────────────────────────────────────────────────────────── */

.azuri-iph__pills {
	display:    flex;
	flex-wrap:  wrap;
	gap:        var(--azuri-space-2);
	margin-top: var(--azuri-space-5);
}

.azuri-iph__pill {
	border:         1px solid transparent;
	border-radius:  var(--azuri-iph-pill-size) * 100; /* pill */
	border-radius:  999px;
	box-sizing:     border-box;
	display:        inline-flex;
	align-items:    center;
	font-family:    var(--azuri-font-family-base);
	font-size:      var(--azuri-iph-pill-size);
	font-weight:    var(--azuri-font-weight-regular);
	letter-spacing: 0.06px;
	line-height:    1.5;
	min-height:     var(--azuri-iph-pill-h);
	padding:        0 12px;
	white-space:    nowrap;
}

/* Teal accent pills (text_card — GP/Medical) */
.azuri-iph__pill--accent-teal {
	background:   rgba(42, 173, 181, 0.1);
	border-color: var(--azuri-color-teal);
	color:        var(--azuri-color-teal);
}

/* Pink accent pills (text_card — Cosmetic) */
.azuri-iph__pill--accent-pink {
	background:   rgba(212, 120, 154, 0.1);
	border-color: var(--azuri-color-pink);
	color:        var(--azuri-color-pink);
}

/* ── Centred eyebrow ──────────────────────────────────────────────────────── */
.azuri-iph__eyebrow--centered {
	color:           var(--azuri-color-teal);
	font-family:     var(--azuri-font-family-base);
	font-size:       12px;
	font-weight:     var(--azuri-font-weight-semibold);
	letter-spacing:  3px;
	line-height:     1;
	margin:          0 0 var(--azuri-space-3);
	text-transform:  uppercase;
}

/* ── Centred description ──────────────────────────────────────────────────── */
.azuri-iph__description--centered {
	color:       rgba(199, 217, 227, 1);
	font-size:   16px;
	line-height: 26px;
	margin:      var(--azuri-space-4) auto 0;
	max-width:   720px;
	text-align:  center;
}
.azuri-iph--cosmetic .azuri-iph__heading-italic--pink {
    color: white !important;
}
/* Light-bordered pills (centred layout) */
.azuri-iph__pills--light {
	justify-content: center;
	margin-top:      var(--azuri-space-6);
}

/* Dark frosted-glass pills (Fees page centred layout) */
.azuri-iph__pills--dark {
	display:         flex;
	flex-wrap:       wrap;
	gap:             var(--azuri-space-2);
	justify-content: center;
	margin-top:      var(--azuri-space-6);
}

.azuri-iph__pill--dark {
	background:   rgba(255, 255, 255, 0.08);
	border:       1px solid rgba(255, 255, 255, 0.18);
	color:        var(--azuri-color-white);
	font-size:    12px;
	line-height:  18px;
	min-height:   36px;
}

.azuri-iph__pill--light {
	border-color: rgba(255, 255, 255, 0.3);
	color:        var(--azuri-color-white);
	font-size:    12px;
	line-height:  18px;
	min-height:   36px;
}

/* Clickable pill link */
a.azuri-iph__pill--link {
	cursor:          pointer;
	text-decoration: none;
	transition:      border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
}

a.azuri-iph__pill--link:hover,
a.azuri-iph__pill--link:focus-visible {
	background:  rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.6);
	color:        var(--azuri-color-white);
	outline:      none;
}

/* ── Centred layout overrides ─────────────────────────────────────────────── */

/* Make the section itself a flex column so the container fills full height */
.azuri-iph--centered {
	align-items:    center;
	display:        flex;
	flex-direction: column;
	justify-content: center;
}

.azuri-iph--centered .azuri-iph__container {
	padding-bottom: var(--azuri-iph-pad-bottom);
	padding-top:    var(--azuri-iph-pad-top);
	width:          100%;
}

/* Equal-height row fills the container height so inner flex centering works */
.azuri-iph--centered .azuri-iph__row--centered {
	align-items: center;
	min-height:  100%;
}

.azuri-iph__content--centered {
	align-items: center;
	text-align:  center;
}

.azuri-iph__heading--centered {
	font-size: 44px;
	margin:    0;
}

/* ── Left column — CTA buttons (text_image layout) ───────────────────────── */

.azuri-iph__cta-buttons {
	display:    flex;
	flex-wrap:  wrap;
	gap:        var(--azuri-space-3);
	margin-top: var(--azuri-space-6);
}

.azuri-iph__cta-btn {
	border-radius:   999px;
	box-sizing:      border-box;
	cursor:          pointer;
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	font-family:     var(--azuri-font-family-base);
	font-size:       15px;
	font-weight:     var(--azuri-font-weight-medium);
	letter-spacing:  -0.15px;
	line-height:     1.5;
	min-height:      48px;
	padding:         12px 28px;
	text-align:      center;
	text-decoration: none;
	transition:      background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
	white-space:     nowrap;
}

/* Primary — solid teal */
.azuri-iph__cta-btn--primary {
	background: var(--azuri-color-teal);
	border:     1.5px solid var(--azuri-color-teal);
	color:      var(--azuri-color-white);
}

.azuri-iph__cta-btn--primary:hover,
.azuri-iph__cta-btn--primary:focus-visible {
	background:     var(--azuri-color-teal-700);
	border-color:   var(--azuri-color-teal-700);
	outline:        2px solid var(--azuri-color-teal);
	outline-offset: 2px;
}

/* Ghost — dark navy with subtle border */
.azuri-iph__cta-btn--ghost {
	background:  rgba(255, 255, 255, 0.05);
	border:      1.5px solid rgba(255, 255, 255, 0.25);
	color:       var(--azuri-color-white);
}

.azuri-iph__cta-btn--ghost:hover,
.azuri-iph__cta-btn--ghost:focus-visible {
	background:   rgba(255, 255, 255, 0.12);
	border-color: rgba(255, 255, 255, 0.55);
	outline:      none;
}

@media (max-width: 480px) {
	.azuri-iph__cta-buttons {
		flex-direction: column;
	}

	.azuri-iph__cta-btn {
		width: 100%;
	}
}

/* ── Right column — shared ────────────────────────────────────────────────── */

.azuri-iph__right-col {
	padding-top: 0;
}

.azuri-iph__right {
	align-items:     flex-start;
	display:         flex;
	flex-direction:  column;
	height:          100%;
	justify-content: flex-start;
}

/* ── Image panel ──────────────────────────────────────────────────────────── */

.azuri-iph__image-panel {
	border-radius: var(--azuri-iph-card-radius) var(--azuri-iph-card-radius) 0 0;
	height:        calc(100% + var(--azuri-iph-pad-top));
	margin-top:    0;
	min-height:    310px;
	overflow:      hidden;
	position:      relative;
	width:         100%;
}

.azuri-iph__image {
	display:       block;
	height:        100%;
	left:          0;
	max-width:     none;
	object-fit:    cover;
	position:      absolute;
	top:           0;
	width:         100%;
}

/* Video play button */
/* Video play button */
.azuri-iph__play-btn {
	align-items:      center;
	background:       rgba(255, 255, 255, 0.9);
	border:           none;
	border-radius:    50%;
	cursor:           pointer;
	display:          flex;
	height:           var(--azuri-iph-play-size);
	justify-content:  center;
	left:             50%;
	padding:          0;
	position:         absolute;
	top:              50%;
	transform:        translate(-50%, -50%);
	transition:       background-color 0.2s ease, transform 0.2s ease;
	width:            var(--azuri-iph-play-size);
}

.azuri-iph__play-btn:hover,
.azuri-iph__play-btn:focus-visible {
	background: var(--azuri-color-white);
	outline:    2px solid var(--azuri-color-teal);
	outline-offset: 2px;
	transform:  translate(-50%, -50%) scale(1.06);
}

.azuri-iph__play-icon {
	align-items:     center;
	display:         flex;
	justify-content: center;
	position:        relative;
}

/* Ellipse SVG is redundant — the button itself is the circle */
.azuri-iph__play-ellipse {
	display: none;
}

/* Polygon SVG: triangle points up by default — rotate to point right */
.azuri-iph__play-polygon {
	display:   block;
	height:    auto;
	transform: rotate(-90deg) scaleY(-1);
	width:     27px;
}

/* ── Booking card ─────────────────────────────────────────────────────────── */

.azuri-iph__card {
	background:     var(--azuri-color-white);
	border-radius:  var(--azuri-iph-card-radius) var(--azuri-iph-card-radius) 0 0;
	box-sizing:     border-box;
	color:          var(--azuri-color-ink);
	display:        flex;
	flex-direction: column;
	height:         calc(100% + var(--azuri-iph-pad-top));
	margin-top:     calc( var(--azuri-iph-pad-top) * -1 );
	min-height:     320px;
	padding:        var(--azuri-iph-card-pad);
	width:          100%;
}

/* Card label (eyebrow) */
.azuri-iph__card-label {
	font-family:    var(--azuri-font-family-base);
	font-size:      11px;
	font-weight:    var(--azuri-font-weight-medium);
	letter-spacing: 2.06px;
	line-height:    1.5;
	margin:         0 0 var(--azuri-space-4);
	text-transform: uppercase;
}

.azuri-iph__card-label--teal { color: var(--azuri-color-teal); }
.azuri-iph__card-label--pink { color: var(--azuri-color-pink); }

/* Card title */
.azuri-iph__card-title {
	color:          var(--azuri-color-ink);
	font-family:    var(--azuri-font-family-base);
	font-size:      20px;
	font-weight:    var(--azuri-font-weight-medium);
	letter-spacing: -0.45px;
	line-height:    1.5;
	margin:         0 0 var(--azuri-space-6);
}

/* Card button group */
.azuri-iph__card-actions {
	display:        flex;
	flex-direction: column;
	gap:            var(--azuri-space-3);
	margin-bottom:  var(--azuri-space-5);
}

.azuri-iph__btn {
	border-radius:   var(--azuri-iph-btn-radius);
	box-sizing:      border-box;
	cursor:          pointer;
	display:         flex;
	align-items:     center;
	justify-content: center;
	font-family:     var(--azuri-font-family-base);
	font-size:       14px;
	font-weight:     var(--azuri-font-weight-medium);
	letter-spacing:  -0.15px;
	line-height:     1.5;
	min-height:      var(--azuri-iph-btn-h);
	padding:         10px 20px;
	text-align:      center;
	text-decoration: none;
	transition:      background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
	width:           100%;
}

/* Primary buttons */
.azuri-iph__btn--primary {
	color: var(--azuri-color-white);
}

.azuri-iph__btn--primary.azuri-iph__btn--teal {
	background: var(--azuri-color-teal);
}

.azuri-iph__btn--primary.azuri-iph__btn--teal:hover,
.azuri-iph__btn--primary.azuri-iph__btn--teal:focus-visible {
	background:     var(--azuri-color-teal-700);
	outline:        2px solid var(--azuri-color-teal);
	outline-offset: 2px;
	color: #fff;
}

.azuri-iph__btn--primary.azuri-iph__btn--pink {
	background: var(--azuri-color-pink);
}

.azuri-iph__btn--primary.azuri-iph__btn--pink:hover,
.azuri-iph__btn--primary.azuri-iph__btn--pink:focus-visible {
	background:     var(--azuri-color-pink-700);
	outline:        2px solid var(--azuri-color-pink);
	outline-offset: 2px;
	color: #fff;
}

/* Secondary button */
.azuri-iph__btn--secondary {
	border:      1.5px solid #deeaec;
	color:       var(--azuri-color-ink);
	min-height:  var(--azuri-iph-btn-h-sec);
}

.azuri-iph__btn--secondary:hover,
.azuri-iph__btn--secondary:focus-visible {
	border-color: var(--azuri-color-teal);
	color:        var(--azuri-color-teal);
	outline:      none;
}

/* Billing note */
.azuri-iph__card-note {
	border-left:   3px solid transparent;
	border-radius: var(--azuri-iph-note-radius);
	box-sizing:    border-box;
	margin-top:    auto; /* pushes to bottom of card */
	padding:       var(--azuri-space-4) var(--azuri-space-4) var(--azuri-space-4) 19px;
	display: none;
}

.azuri-iph__card-note--teal {
	background:   rgba(42, 173, 181, 0.04);
	border-color: var(--azuri-color-teal);
}

.azuri-iph__card-note--pink {
	background:   rgba(212, 120, 154, 0.04);
	border-color: var(--azuri-color-pink);
}

.azuri-iph__card-note-text {
	color:          var(--azuri-color-ink);
	font-family:    var(--azuri-font-family-base);
	font-size:      13px;
	font-weight:    var(--azuri-font-weight-regular);
	letter-spacing: -0.08px;
	line-height:    1.65;
	margin:         0;
}

section.azuri-iph.azuri-iph--text_card {
    padding-top: 70px;
}
section.azuri-iph.azuri-iph--text_card .azuri-iph__card {
    width: 400px;
    margin-left: auto;
}
.azuri_inner.azuri-iph__content {
    padding-right: 0;
    padding-bottom: 60px;
}
@media only screen and ( min-width:240px) and (max-width:1023px) {

}
/* ── Responsive — tablet ────────────────────────────────────────────────────
   At ≤ 900px keep two columns but scale down font sizes
   ─────────────────────────────────────────────────────────────────────────── */

@media (max-width: 900px) {
	:root {
		--azuri-iph-h1-size:  32px;
		--azuri-iph-pad-top:  48px;
		--azuri-iph-pad-bottom: 48px;
	}

	.azuri-iph__description {
		font-size: 14px;
	}

	.azuri-iph__heading--centered {
		font-size: 36px;
	}

	.azuri-iph__description--centered {
		font-size: 15px;
	}
}

/* ── Responsive — mobile ────────────────────────────────────────────────────
   Single-column stacking: text on top, right panel below.
   ─────────────────────────────────────────────────────────────────────────── */

@media (max-width: 768px) {

	:root {
		--azuri-iph-h1-size:    28px;
		--azuri-iph-pad-top:    36px;
		--azuri-iph-pad-bottom: 0px;
		--azuri-iph-card-pad:   24px;
	}

	.azuri-iph {
		min-height: 0;
	}

	.azuri-iph--text_image,
	.azuri-iph--text_card {
		min-height: 0;
	}

	/* Stack right column below left */
	.azuri-iph__row {
		flex-direction: column;
	}

	.azuri-iph__content {
		padding-bottom: var(--azuri-space-8);
		padding-right:  0;
	}

	.azuri-iph__right-col {
		width: 100% !important;
	}

	/* Image panel: fixed height, no negative margin */
	.azuri-iph__image-panel {
		border-radius: var(--azuri-iph-card-radius) var(--azuri-iph-card-radius) 0 0;
		height:        240px;
		margin-top:    0;
		min-height:    0;
	}

	/* Card: remove negative top margin, square bottom corners */
	.azuri-iph__card {
		border-radius:  0;
		height:         auto;
		margin-top:     0;
		min-height:     0;
		padding-bottom: var(--azuri-space-8);
	}

	/* Centred layout on mobile */
	.azuri-iph--centered .azuri-iph__container {
		padding-top:    40px;
		padding-bottom: 40px;
	}

	.azuri-iph__heading--centered {
		font-size: 26px;
	}

	.azuri-iph__pills--light {
		flex-direction: column;
		align-items:    center;
	}

	.azuri-iph__pill--light {
		white-space: normal;
		text-align:  center;
	}

	/* Play button — slightly smaller */
	:root {
		--azuri-iph-play-size: 60px;
	}
}
section.azuri-iph.azuri-iph--centered .azuri_inner.azuri-iph__content.azuri-iph__content--centered {
    padding-bottom: 0;
}
section.azuri-iph.azuri-iph--centered {
    min-height: 300px !important;
}
@media (max-width: 480px) {
	:root {
		--azuri-iph-h1-size: 24px;
	}

	.azuri-iph__description {
		max-width: 100%;
	}

	.azuri-iph__pill {
		white-space: normal;
		text-align:  center;
	}
}
@media only screen and ( min-width:240px) and (max-width:380px) {
    .azuri-stats__label {
        font-size: 6px !important;
    }
}
@media only screen and ( min-width:240px) and (max-width:1023px) {
    section.azuri-iph.azuri-iph--centered {
		padding-top: 100px;
	}
	section.azuri-iph.azuri-iph--text_card {
		padding-top: 130px;
	}
	.azuri-iph--text_image, .azuri-iph--text_card {
        padding-top: 100px;
    }
	h1.azuri-iph__heading {
		font-size: 35px;
	}
    .azuri_inner.azuri-iph__content {
        padding-bottom: 40px;
    }
    section.azuri-iph.azuri-iph--text_card .azuri-iph__card.azuri-iph__card--teal {
        width: 100%;
    }
    .azuri-iph__card {
        padding: 15px;
    }
    .azuri-iph__card-label {
        margin-bottom: 0;
    }
	section.azuri-iph.azuri-iph--text_card .azuri-iph__card {
		width: 100%;
	}
}

/* ── Video Modal ──────────────────────────────────────────────────────────── */

.azuri-video-modal {
	align-items:      center;
	background:       rgba(0, 0, 0, 0.85);
	bottom:           0;
	display:          flex;
	justify-content:  center;
	left:             0;
	position:         fixed;
	right:            0;
	top:              0;
	z-index:          var(--azuri-z-modal, 9999);
	animation:        azuri-modal-fade-in 0.2s ease;
}

@keyframes azuri-modal-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

.azuri-video-modal__inner {
	max-height: 90vh;
	max-width:  960px;
	position:   relative;
	width:      90vw;
}

.azuri-video-modal__iframe,
.azuri-video-modal__video {
	aspect-ratio: 16 / 9;
	border:       none;
	border-radius: var(--azuri-radius-md, 8px);
	display:      block;
	height:       auto;
	width:        100%;
}

.azuri-video-modal__close {
	align-items:      center;
	background:       rgba(255, 255, 255, 0.15);
	border:           1px solid rgba(255, 255, 255, 0.3);
	border-radius:    50%;
	color:            var(--azuri-color-white);
	cursor:           pointer;
	display:          flex;
	font-size:        22px;
	height:           36px;
	justify-content:  center;
	line-height:      1;
	padding:          0;
	position:         absolute;
	right:            -12px;
	top:              -12px;
	transition:       background 0.2s ease;
	width:            36px;
	z-index:          1;
}

.azuri-video-modal__close:hover,
.azuri-video-modal__close:focus-visible {
	background:  rgba(255, 255, 255, 0.3);
	outline:     2px solid var(--azuri-color-white);
	outline-offset: 2px;
}

body.azuri-video-modal--open {
	overflow: hidden;
}

@media (max-width: 480px) {
	.azuri-video-modal__close {
		right: 0;
		top:   -40px;
	}
}