/* DEANNA STYLES */

/* FONTS */
/* inter-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/inter-v18-latin-regular.eot'); /* IE9 Compat Modes */
	src: url('../fonts/inter-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/inter-v18-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
		 url('../fonts/inter-v18-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
		 url('../fonts/inter-v18-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
		 url('../fonts/inter-v18-latin-regular.svg#Inter') format('svg'); /* Legacy iOS */
  }
  
  /* inter-700 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Inter';
	font-style: normal;
	font-weight: 700;
	src: url('../fonts/inter-v18-latin-700.eot'); /* IE9 Compat Modes */
	src: url('../fonts/inter-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/inter-v18-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
		 url('../fonts/inter-v18-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
		 url('../fonts/inter-v18-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
		 url('../fonts/inter-v18-latin-700.svg#Inter') format('svg'); /* Legacy iOS */
}

/* RESET */
/* Box sizing rules */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Heavy reset */
* {font:inherit;margin:0;padding:0}
/* Remove default margin */
body,
h1,
.entry-content h1,
h2,
.entry-content h2,
h3,
.entry-content h3,
h4,
.entry-content h4,
h5,
.entry-content h5,
h6,
.entry-content h6,
p,
figure,
blockquote,
dl,
dd {
	margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
	list-style: none;
}

/* Set core root defaults */
html:focus-within {
	scroll-behavior: smooth;
}

/* Set core body defaults */
body {
	min-height: 100vh;
	text-rendering: optimizeSpeed;
	line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
	text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
	max-width: 100%;
	display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
	font: inherit;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
	html:focus-within {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}




/* VARS */
:root {

	/* COLORS */
	--clr-primary:hsl(7, 93%, 62%);
	--clr-secondary:hsl(22, 91%, 66%);
	--clr-tertiary:hsl(33, 93%, 78%);
	--clr-quaternary: hsl(7, 93%, 62%);
	--clr-quaternary-80: hsla(7, 93%, 62%,.6);
	--clr-d-gradient:linear-gradient(135deg, var(--clr-primary) 0%, var(--clr-tertiary) 100%); 
	--clr-primary-black:hsl(0, 0%, 0%);
	--clr-primary-black-10:hsl(0, 0%, 10%);
	--clr-primary-black-20:hsl(0, 0%, 20%);
	--clr-primary-black-30:hsl(0, 0%, 30%);
	--clr-primary-black-40:hsl(0, 0%, 40%);
	--clr-primary-black-50:hsl(0, 0%, 50%);
	--clr-primary-black-60:hsl(0, 0%, 60%);
	--clr-primary-black-70:hsl(0, 0%, 70%);
	--clr-primary-black-80:hsl(0, 0%, 80%);
	--clr-primary-black-90:hsl(0, 0%, 90%);
	--clr-primary-white:hsl(0, 0%, 100%);
	
	/* FONT-SIZES */
	--fs-3xs: clamp(0.78rem, calc(0.77rem + 0.03vw), 0.80rem);
	--fs-2xs: clamp(0.94rem, calc(0.92rem + 0.11vw), 1.00rem);
	--fs-xs: clamp(0.913rem, calc(0.908rem + 0.22vw), 1.25rem);
	--fs-s: clamp(1.35rem, calc(1.28rem + 0.37vw), 1.56rem);
	--fs-m: clamp(1.62rem, calc(1.50rem + 0.58vw), 1.95rem);
	--fs-l: clamp(1.94rem, calc(1.77rem + 0.87vw), 2.44rem);
	--fs-xl: clamp(2.33rem, calc(2.08rem + 1.25vw), 3.05rem);
	--fs-2xl: clamp(2.4756rem, 0.4301rem + 5.2277vw, 6.3113rem);
	--fs-3xl: clamp(1.5744rem, 0.0957rem + 7.3932vw, 8.4131rem);

	--fs-primary-heading:var(--fs-xl);
	--fs-secondary-heading:calc(.8*var(--fs-2xl));
	--fs-tertiary-heading:var(--fs-xl);
	--fs-quaternary-heading:var(--fs-xs);
	--fs-quinary-heading:var(--fs-xs);
	--fs-senary-heading:var(--fs-2xs);

	/* GENERIC GAPS */
	--space-no: 0px;
	--space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem);
	--space-2xs: clamp(0.5625rem, 0.5408rem + 0.1087vw, 0.625rem);
	--space-xs: clamp(0.875rem, 0.8533rem + 0.1087vw, 0.9375rem);
	--space-s: clamp(1.125rem, 1.0815rem + 0.2174vw, 1.25rem);
	--space-m: clamp(1.6875rem, 1.6223rem + 0.3261vw, 1.875rem);
	--space-l: clamp(2.25rem, 2.163rem + 0.4348vw, 2.5rem);
	--space-xl: clamp(3.375rem, 3.2446rem + 0.6522vw, 3.75rem);
	--space-2xl: clamp(4.5rem, 4.3261rem + 0.8696vw, 5rem);
	--space-3xl: clamp(6.75rem, 6.4891rem + 1.3043vw, 7.5rem);
	/* ONE-UP PAIRS */
	--space-3xs-2xs: clamp(0.3125rem, 0.2038rem + 0.5435vw, 0.625rem);
	--space-2xs-xs: clamp(0.5625rem, 0.4321rem + 0.6522vw, 0.9375rem);
	--space-xs-s: clamp(0.875rem, 0.7446rem + 0.6522vw, 1.25rem);
	--space-s-m: clamp(1.125rem, 0.8641rem + 1.3043vw, 1.875rem);
	--space-m-l: clamp(1.6875rem, 1.4049rem + 1.413vw, 2.5rem);
	--space-l-xl: clamp(2.25rem, 1.7283rem + 2.6087vw, 3.75rem);
	--space-xl-2xl: clamp(3.375rem, 2.8098rem + 2.8261vw, 5rem);
	--space-2xl-3xl: clamp(4.5rem, 3.4565rem + 5.2174vw, 7.5rem);
	/* TWO-UP PAIRS */
	--space-3xs-xs: clamp(0.3125rem, 0.0951rem + 1.087vw, 0.9375rem);
	--space-2xs-s: clamp(0.5625rem, 0.3234rem + 1.1957vw, 1.25rem);
	--space-xs-m: clamp(0.875rem, 0.5272rem + 1.7391vw, 1.875rem);
	--space-s-l: clamp(1.125rem, 0.6467rem + 2.3913vw, 2.5rem);
	--space-m-xl: clamp(1.6875rem, 0.9701rem + 3.587vw, 3.75rem);
	--space-l-2xl: clamp(2.25rem, 1.2935rem + 4.7826vw, 5rem);
	--space-xl-3xl: clamp(3.375rem, 1.9402rem + 7.1739vw, 7.5rem);
	/* THREE-UP PAIRS */
	--space-3xs-s: clamp(0.3125rem, -0.0136rem + 1.6304vw, 1.25rem);
	--space-2xs-m: clamp(0.5625rem, 0.106rem + 2.2826vw, 1.875rem);
	--space-xs-l: clamp(0.875rem, 0.3098rem + 2.8261vw, 2.5rem);
	--space-s-xl: clamp(1.125rem, 0.212rem + 4.5652vw, 3.75rem);
	--space-m-2xl: clamp(1.6875rem, 0.5353rem + 5.7609vw, 5rem);
	--space-l-3xl: clamp(2.25rem, 0.4239rem + 9.1304vw, 7.5rem);
	/* FOUR-UP PAIRS */
	--space-3xs-m: clamp(0.3125rem, -0.231rem + 2.7174vw, 1.875rem);
	--space-2xs-l: clamp(0.5625rem, -0.1114rem + 3.3696vw, 2.5rem);
	--space-xs-xl: clamp(0.875rem, -0.125rem + 5vw, 3.75rem);
	--space-s-2xl: clamp(1.125rem, -0.2228rem + 6.7391vw, 5rem);
	--space-m-3xl: clamp(1.6875rem, -0.3342rem + 10.1087vw, 7.5rem);
	/* FIVE-UP PAIRS */
	--space-3xs-l: clamp(0.3125rem, -0.4484rem + 3.8043vw, 2.5rem);
	--space-2xs-xl: clamp(0.5625rem, -0.5462rem + 5.5435vw, 3.75rem);
	--space-xs-2xl: clamp(0.875rem, -0.5598rem + 7.1739vw, 5rem);
	--space-s-3xl: clamp(1.125rem, -1.0924rem + 11.087vw, 7.5rem);
	/* SIX-UP PAIRS */
	--space-3xs-xl: clamp(0.3125rem, -0.8832rem + 5.9783vw, 3.75rem);
	--space-2xs-2xl: clamp(0.5625rem, -0.981rem + 7.7174vw, 5rem);
	--space-xs-3xl: clamp(0.875rem, -1.4293rem + 11.5217vw, 7.5rem);
	/* SEVEN-UP PAIRS */
	--space-3xs-2xl: clamp(0.3125rem, -1.3179rem + 8.1522vw, 5rem);
	--space-2xs-3xl: clamp(0.5625rem, -1.8505rem + 12.0652vw, 7.5rem);
	/* EIGHT-UP PAIRS */
	--space-3xs-3xl: clamp(0.3125rem, -2.1875rem + 12.5vw, 7.5rem);
	/* INVERSE */
	--space-3xl-2xl: clamp(5rem, 7.3587rem + -3.0435vi, 6.75rem);
	--space-3xl-xl: clamp(3.75rem, 7.7935rem + -5.2174vi, 6.75rem);
	--space-3xl-l: clamp(2.5rem, 8.2283rem + -7.3913vi, 6.75rem);
	--space-3xl-m: clamp(1.875rem, 8.4457rem + -8.4783vi, 6.75rem);
	--space-3xl-s: clamp(1.25rem, 8.663rem + -9.5652vi, 6.75rem);
	--space-3xl-xs: clamp(0.9375rem, 8.7717rem + -10.1087vi, 6.75rem);
	--space-3xl-2xs: clamp(0.625rem, 8.8804rem + -10.6522vi, 6.75rem);
	--space-3xl-3xs: clamp(0.3125rem, 8.9891rem + -11.1957vi, 6.75rem);
	--space-2xl-xl: clamp(3.75rem, 4.7609rem + -1.3043vi, 4.5rem);
	--space-2xl-l: clamp(2.5rem, 5.1957rem + -3.4783vi, 4.5rem);
	--space-2xl-m: clamp(1.875rem, 5.413rem + -4.5652vi, 4.5rem);
	--space-2xl-s: clamp(1.25rem, 5.6304rem + -5.6522vi, 4.5rem);
	--space-2xl-xs: clamp(0.9375rem, 5.7391rem + -6.1957vi, 4.5rem);
	--space-2xl-2xs: clamp(0.625rem, 5.8478rem + -6.7391vi, 4.5rem);
	--space-2xl-3xs: clamp(0.3125rem, 5.9565rem + -7.2826vi, 4.5rem);
	--space-xl-l: clamp(2.5rem, 3.6793rem + -1.5217vi, 3.375rem);
	--space-xl-m: clamp(1.875rem, 3.8967rem + -2.6087vi, 3.375rem);
	--space-xl-s: clamp(1.25rem, 4.1141rem + -3.6957vi, 3.375rem);
	--space-xl-xs: clamp(0.9375rem, 4.2228rem + -4.2391vi, 3.375rem);
	--space-xl-2xs: clamp(0.625rem, 4.3315rem + -4.7826vi, 3.375rem);
	--space-xl-3xs: clamp(0.3125rem, 4.4402rem + -5.3261vi, 3.375rem);
	--space-l-m: clamp(1.875rem, 2.3804rem + -0.6522vi, 2.25rem);
	--space-l-s: clamp(1.25rem, 2.5978rem + -1.7391vi, 2.25rem);
	--space-l-xs: clamp(0.9375rem, 2.7065rem + -2.2826vi, 2.25rem);
	--space-l-2xs: clamp(0.625rem, 2.8152rem + -2.8261vi, 2.25rem);
	--space-l-3xs: clamp(0.3125rem, 2.9239rem + -3.3696vi, 2.25rem);
	--space-m-s: clamp(1.25rem, 1.8397rem + -0.7609vi, 1.6875rem);
	--space-m-xs: clamp(0.9375rem, 1.9484rem + -1.3043vi, 1.6875rem);
	--space-m-2xs: clamp(0.625rem, 2.0571rem + -1.8478vi, 1.6875rem);
	--space-m-3xs: clamp(0.3125rem, 2.1658rem + -2.3913vi, 1.6875rem);
	--space-s-xs: clamp(0.9375rem, 1.1902rem + -0.3261vi, 1.125rem);
	--space-s-2xs: clamp(0.625rem, 1.2989rem + -0.8696vi, 1.125rem);
	--space-s-3xs: clamp(0.3125rem, 1.4076rem + -1.413vi, 1.125rem);
	--space-xs-2xs: clamp(0.625rem, 0.962rem + -0.4348vi, 0.875rem);
	--space-xs-3xs: clamp(0.3125rem, 1.0707rem + -0.9783vi, 0.875rem);
	--space-2xs-3xs: clamp(0.3125rem, 0.6495rem + -0.4348vi, 0.5625rem);

	/* LINE-HEIHTS */
	--lh-100:1;
	--lh-200:1.2;
	--lh-300:1.4;
	--lh-400:1.6;
	--lh-500:1.8;
	--lh-600:2;
	--lh-700:2.5;
	--lh-800:3;
	--lh-900:3.5;

	/* LETTER SPACINGS */
	--ls-100:.01rem;
	--ls-200:.02rem;
	--ls-300:.03rem;
	--ls-400:.04rem;
	--ls-500:.05rem;
	--ls-600:.06rem;
	--ls-700:.07rem;
	--ls-800:.08rem;
	--ls-900:.09rem;

	/* FONT-FAMILIES */
	--ff-primary: 'Inter';
	--ff-body:var(--ff-primary);
	--ff-primary-heading:var(--ff-primary);
	--ff-secondary-heading:var(--ff-primary);
	--ff-tertiary-heading:var(--ff-primary);
	--ff-quaternary-heading:var(--ff-primary);
	--ff-quinary-heading:var(--ff-primary);
	--ff-senary-heading:var(--ff-primary);

	/* FONT-WEIGHTS */
	--fw-regular:400;
	--fw-bold:700;
	--fw-body:var(--fw-regular);
	--fw-primary-heading:var(--fw-bold);
	--fw-secondary-heading:var(--fw-bold);
	--fw-tertiary-heading:var(--fw-bold);
	--fw-quaternary-heading:var(--fw-regular);
	--fw-quinary-heading:var(--fw-bold);
	--fw-senary-heading:var(--fw-bold);

	/* MAX-WIDTHS */
	--mw-100: 26ch;
	--mw-200: 32ch;
	--mw-300: 29.375rem;
	--mw-400: 47.5rem;
	--mw-500: 67.9375rem;
	--mw-600: 78.75rem;
	--mw-700: 90rem;
	--mw-800: 100rem;
	--mw-900: 118.75rem;
	--mw-100-p-xs: min(var(--mw-100),100% - (var(--space-xs) * 2));
	--mw-200-p-xs: min(var(--mw-200),100% - (var(--space-xs) * 2));
	--mw-300-p-xs: min(var(--mw-300),100% - (var(--space-xs) * 2));
	--mw-400-p-xs: min(var(--mw-400),100% - (var(--space-xs) * 2));
	--mw-500-p-xs: min(var(--mw-500),100% - (var(--space-xs) * 2));
	--mw-600-p-xs: min(var(--mw-600),100% - (var(--space-xs) * 2));
	--mw-700-p-xs: min(var(--mw-700),100% - (var(--space-xs) * 2));
	--mw-800-p-xs: min(var(--mw-800),100% - (var(--space-xs) * 2));
	--mw-900-p-xs: min(var(--mw-900),100% - (var(--space-xs) * 2));

	/* BOX-SHADOWS */
	--bs-100: 0 1px 2px var(--clr-primary-black-10);
	--bs-200: 0 2px 3px var(--clr-primary-black-80);
	--bs-300: 0 3px 5px var(--clr-primary-black-60);
	--bs-400: 0 3px 5px var(--clr-primary-black-40);
	--bs-500: 0 5px 8px var(--clr-primary-black-40);
	--bs-600: 0 3px 6px var(--clr-primary-black-60);
	--bs-700: 0 3px 6px var(--clr-primary-black-80);
	--bs-800: 0 5px 8px var(--clr-primary-black-80);
	--bs-900: 0 5px 10px var(--clr-primary-black);

	/* BORDER-RADIUS */
	--br-000: 0;
	--br-100: 3px;
	--br-200: 5px;
	--br-300: 8px;
	--br-400: 10px;
	--br-500: 16px;
	--br-600: 32px;
	--br-700: 64px;
	--br-800: 72px;
	--br-900: 50vmax;
}

/* UTILITY CLASSES */
/* MAX WIDTHS */
.mw-100 > .wrap {margin-inline:auto;width:min(var(--mw-100),100% - (var(--space-m) * 2))}
.mw-200 > .wrap {margin-inline:auto;width:min(var(--mw-200),100% - (var(--space-m) * 2))}
.mw-300 > .wrap {margin-inline:auto;width:min(var(--mw-300),100% - (var(--space-m) * 2))}
.mw-400 > .wrap {margin-inline:auto;width:min(var(--mw-400),100% - (var(--space-m) * 2))}
.mw-500 > .wrap {margin-inline:auto;width:min(var(--mw-500),100% - (var(--space-m) * 2))}
.mw-600 > .wrap {margin-inline:auto;width:min(var(--mw-600),100% - (var(--space-m) * 2))}
.mw-700 > .wrap {margin-inline:auto;width:min(var(--mw-700),100% - (var(--space-m) * 2))}
.mw-800 > .wrap {margin-inline:auto;width:min(var(--mw-800),100% - (var(--space-m) * 2))}
.mw-900 > .wrap {margin-inline:auto;width:min(var(--mw-900),100% - (var(--space-m) * 2))}




/* GENERAL */
body {
	font-family:var(--ff-primary);
	margin:0;
}

body.home,
body.login {
	background:url(../images/bg_circle.png) no-repeat center var(--space-3xl);
	background-size:clamp(36rem,60vw,64rem);
}

strong {
 font-weight:var(--fw-bold);
}

h1 {
	font-weight:var(--fw-primary-heading);
	margin-block:0;
}

h2 {
	font-size:var(--fs-secondary-heading);
	font-weight:var(--fw-secondary-heading);
	line-height:var(--lh-200);
}

h3 {
	font-size:var(--fs-tertiary-heading);
	font-weight:var(--fw-tertiary-heading);
	line-height:var(--lh-200);
}

h4 {
	font-size:var(--fs-quaternary-heading)
}

p {
	font-size:var(--fs-xs)
}

a:hover {
	opacity:.6;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
form input {
	font-family:var(--ff-primary);
}

.d_gradient {
	background-image:var(--clr-d-gradient);
	color: transparent;
	background-clip: text;
}

h5 a {
	color:var(--clr-primary-black-50);
	font-weight:var(--fw-regular);
}

.d_sec {
	margin-block:var(--space-3xl);
}

.two_cols > .wrap {
	display:grid;
	column-gap:var(--space-3xl);
	grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
	row-gap:var(--space-m)
}

.d_reverse > .wrap {
	transform:scaleX(-1);
}

.d_reverse > .wrap > * {
	transform:scaleX(-1);
}

.d_image {
	display:flex;
	align-items:center;
	margin-inline: auto;
	max-width:100%;
}

.d_text {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.d_text p {
	margin-bottom:var(--space-s-m)
}

.d_span {
	grid-column:1 / -1
}

.d_neg {
	color:var(--clr-primary-white)
}

.ta-center {
	text-align:center
}



/* BUTTONS */
.d_btn {
	border-radius:var(--br-400);
	display:inline-block;
	padding:var(--space-2xs) var(--space-xs);
	text-decoration:none;
	width:fit-content;
}

.d_btn:hover,
.social-icons a:hover {
	box-shadow:var(--bs-300);
}

.d_btn_orange_fill {
	background-color:var(--clr-primary);
}

.main_menu ul li a.d_btn_gradient_fill,
.d_btn_gradient_fill {
	background:var(--clr-d-gradient);
}

.d_btn_orange_fill,
.d_btn_gradient_fill,
.main_menu ul li a.d_btn_gradient_fill {
	color:var(--clr-primary-white);
}

.d_btn_orange_fill:hover,
.d_btn_gradient_fill:hover,
.main_menu ul li a.d_btn_gradient_fill:hover {
	opacity:1;
}

.bg-gradient {
	background-image:var(--clr-d-gradient);
}

button[type=submit] {
	border:0;
}

input[type=checkbox] {
	margin:0 var(--space-3xs) 0 0;
	outline:0;
}


.dark-header header > .wrap {
	box-shadow:0 5px 10px var(--clr-primary-black-40);
}

.responsive-menu .main_menu ul {
	gap: var(--space-s);
}

.responsive-menu .search-container {
	margin-bottom:0;
	margin-inline:auto var(--space-s-l);
	max-width: 505px;
	position: relative;
	width: clamp(10rem,30vw,36rem);
}

/* Borde degradado */
.search-container::before {
	--border-width:-3px;
    content: '';
    position: absolute;
    top: var(--border-width);
    left: var(--border-width);
    right: var(--border-width);
    bottom: var(--border-width);
    border-radius: calc(1.3*var(--br-400));
    background: var(--clr-d-gradient);
    z-index: 0;
}

.responsive-menu .main_menu {
	flex-flow:wrap;
	justify-content:flex-end;
}

.responsive-menu .menu-toggle {
	display: none;
}

.responsive-menu .menu-icon {
	display: none;
	cursor: pointer;
	padding: 10px;
	color: #fff;
	text-align: center;
}

.responsive-menu .bar {
	display: block;
	width: 25px;
	height: 3px;
	background:var(--clr-primary-black);
	margin: 5px auto;
	transition: 0.3s;
}

.responsive-menu .nav-menu li {
	margin: 0;
}

.responsive-menu .nav-menu a {
	display: block;
	padding: 15px;
	text-decoration: none;
	text-align: center;
}

.responsive-menu .nav-menu a:hover {
	opacity:.6;
}

.responsive-menu .search-container.d_mobile {
	display:none;
}

@media (max-width: 60rem) {
	.responsive-menu header > .wrap {
		align-items:flex-start;
		padding-block: var(--space-xs) var(--space-3xs-xs);
	}

	.responsive-menu .main_menu {
		margin-top:calc(-1*clamp(2.5rem,5.5vw,6rem));
		width:100%;
	}
	
	.responsive-menu header > .wrap h1 {
		flex:1 100%;
	}

	.responsive-menu .menu-icon {
		display: block;
	}

	.responsive-menu .nav-menu {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		transition: max-height 0.3s ease, opacity 0.3s ease;
	}

	.responsive-menu .nav-menu {
		flex: 1 100%;
	}

	.responsive-menu .nav-menu li {
		justify-content:flex-end;
		margin: 0;
	}

	.responsive-menu .nav-menu a {
		padding: 10px;
	}

	.responsive-menu .menu-toggle:checked + .menu-icon + .nav-menu {
		max-height: 500px; /* Ajusta según el contenido del menú */
		opacity: 1;
	}

	.responsive-menu .search-container.d_desktop {
		display:none;
	}

	.responsive-menu .search-container.d_mobile {
		display:inline-block;
		align-self:flex-end;
		margin-bottom:var(--space-m);
		margin-inline:auto;
		width:96%;
	}
}


/* HEADER */
header {
	display:flex;
	justify-content:center;
	position: relative;
	z-index:100;
}

header > .wrap {
	align-items:center;
	background-color:var(--clr-primary-white);
	border-radius:var(--br-500);
	box-shadow:0 5px 10px var(--clr-primary-black-80);
	display:flex;
	flex-flow:wrap;
	justify-content:space-between;
	margin-top:var(--space-s);
	padding-block:var(--space-2xs);
	padding-inline:var(--space-2xs);
	width:var(--mw-600-p-xs);
}

.main_menu {
	align-items:center;
	display:flex;
	position:relative;
}
header > .wrap h1 {
	display:flex;
}
header > .wrap h1 img {
	width:clamp(7rem,18vw,11rem);
}
.main_menu ul {
	display:flex;
	gap:var(--space-s-xl)
}
.main_menu ul li {
	align-items:center;
	display:flex;
	list-style-type:none
}
.main_menu ul li a {
	color:var(--clr-primary-black-30);
	font-size:var(--fs-2xs);
	text-decoration:none
}

.main_menu ul li a:hover {
	opacity:.6;
}

.fixed-header header {
	display: flex;
	justify-content: center;
}

.fixed-header header > .wrap {
	position:fixed;
	margin-top:var(--space-s)
}

/* HEADER IMAGES */
.header_img {
	background-repeat:no-repeat;
	background-size:cover;
	display: grid;
	align-items:flex-end;
	color:var(--clr-primary-white);
	padding-bottom:var(--space-l)
}

.header_img::before {
	background-color:var(--clr-primary);
	background:var(--clr-d-gradient);
	content:'';
	display:block;
	left:0;
	mix-blend-mode:multiply;
	position:absolute;
	top:0;
	width:100%;
}

.header_icons {
	bottom:var(--space-3xs);
	position:absolute;
	right:var(--space-xs);
}

.header_img .header_icons .icons {
	display: flex;
	gap:var(--space-3xs);
	list-style-type:none;
}

.header_img .icon {
	--size:24px;
	align-items:center;
	display:flex;
	height:var(--size);
	justify-content:center;
	width:var(--size);
}

.header_img .icon:hover {
	opacity:.6;
}

.header_img,
.header_img::before {
	height: clamp(17rem,20vw,22rem);
}

.header_img > .wrap {
	position: relative;
	z-index:10;
}

@media (max-width: 60rem) {
	.header_icons {display:none;}
}


/* INSTANT */

#instant {
	text-align: center;
}

#instant > .wrap {
	padding-block:var(--space-l-3xl) calc(3.5*var(--space-l-3xl));
}

.search-container {
	margin-bottom:var(--space-m);
	margin-inline:auto;
	max-width:614px;
	position: relative;
	width:96%;
}

.search-container form {
		background-color:var(--clr-primary-white);
		border-radius:var(--br-400);
		display:flex;
		gap:var(--space-s);
		justify-content:space-around;
		position:relative;
}

.search-container form input {
	border: 0;
	background: transparent;
	background-clip: text;  
	background-image:var(--clr-d-gradient);
	color: transparent;
	outline:1px solid transparent;
	padding-left:var(--space-2xs);
	width: 80%;
}

input:focus::placeholder {
	color: transparent;
}

.search-container button {
	padding: 10px;
	font-size: 16px;
	color: var(--clr-primary-black-50);
	background-color:transparent;
	border: none;
	border-radius: 0 4px 4px 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.search-container button:hover {
   opacity:.6;
}

.search-container .fa-search {
	font-size: 18px;
}

/* SIGN UP */
#sign_up {
	margin-bottom:0;
	margin-inline:auto;
	max-width:var(--mw-700);
}

.sign_up > .wrap {
	column-gap:var(--space-s);
	grid-template-columns:1fr 1fr;
	padding-block:var(--space-2xl);
}

.sign_up_form_container {
	background-color:var(--clr-primary-white);
	border-radius:var(--br-400);
	display:flex;
	flex-direction:column;
	margin-inline:auto;
	max-width:320px;
	width:100%;
	padding:var(--space-l) var(--space-s);
}

.sign_up input[type=text] {
	margin-bottom: var(--space-m);
	border:0;
	border-radius: var(--br-300);
	border-color: var(--clr-primary);
	margin-top:var(--space-2xs);
	outline:2px solid var(--clr-secondary);
	padding:var(--space-3xs);
}

.sign_up button {
	width:100%
}

.social-icons {
	display:flex;
	gap:var(--space-2xs);
	margin-block:var(--space-2xs) var(--space-s);
}

.social-icons a {
	--size:40px;
	align-items:center;
	background-color:var(--clr-primary);
	border-radius:var(--br-300);
	color:var(--clr-primary-white);
	display:flex;
	font-size:22px;
	height:var(--size);
	justify-content:center;
	text-decoration:none;
	width:var(--size);
}

.terms_link {
	color:var(--clr-primary-black-50);
	display:block;
	margin-bottom:var(--space-m);
	margin-left:calc(1.1*var(--space-s));
}

@media (max-width:48.125rem) {
	.sign_up_form_container {
		grid-column: 1 / -1;
	}
	.sign_up .d_image {
		display: none;
	}
}


/* FOOTER */
footer > .wrap {
	margin-inline:auto;
	padding-block:var(--space-xs);
	width:var(--mw-600-p-xs);
}

footer nav {
	margin-left:var(--space-xl);
}

footer nav li {
	list-style-type:none;
	margin-block:var(--space-xs)
}

footer nav li a {
	color:var(--clr-primary-black);
	font-size:var(--fs-3xs);
	text-decoration:none;
}

.dark-footer footer {
	background-color:var(--clr-primary);
	background:var(--clr-d-gradient);
}

@media (min-width:48.125rem) {
	footer > .wrap {
		display:flex;
		justify-content:space-between;
		padding-block:var(--space-2xs);
		padding-inline: var(--space-s);
	}
	footer nav {
		align-items:center;
		display:flex;
		gap:var(--space-s)
	}
}

/* HOME */
.home h2 {
	margin-bottom:var(--space-xl)
}

.home h3 {
	margin-bottom:var(--space-s)
}


/* LOGIN */
#login_overlay {
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	background: var(--clr-quaternary-80);
	border: 1px solid rgba(255, 255, 255, 0.3);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	display:grid;
	grid-template-columns: minmax(max-content,320px);
	height: 100vh;
	left: 0;
	padding-block:var(--space-l);
	place-content:center;
	position: fixed;
	top: 0;
	width: 100vw;
	z-index:1;
}

#login_overlay button {
	margin-bottom:var(--space-2xs)
}

@media(max-height:50rem) {
	#login_overlay {
		padding-top:var(--space-3xl)
	}
}



/* SEARCH RESULTS */
.header_search_results {
	background-image: url(../images/header_bg_search_results.jpg);
}

.header_search_results h3 {
	padding-top:var(--space-xs-m)
}

.results > .wrap {
	margin-inline:auto;
	max-width:var(--mw-600-p-xs);
	padding-block:calc(2*var(--space-3xl));
	position: relative;
}

.header_search_results .author {
	color:var(--clr-primary-white);
	display: grid;
	column-gap:var(--space-2xs);
	grid-template-columns: 40px 1fr;
	margin-top:var(--space-xs-m)
}

.name {
	font-weight:var(--fw-bold);
}

.photo {
	grid-row:1 / span 2;
}

.photo img {
	border-radius:var(--br-900);
}

.filters_icons {
	align-items: center;
	color:var(--clr-primary-black-50);
	display: flex;
	top:var(--space-s);
	position:absolute;
	left:var(--space-xs);
}

.filters_icons .icons {
	display: flex;
	gap:var(--space-3xs);
	list-style-type:none;
	margin-left:var(--space-2xs)
}

.filters_icons .icon {
	--size:24px;
	align-items:center;
	display:flex;
	height:var(--size);
	justify-content:center;
	width:var(--size);
}

.filters_icons .icon:hover {
	opacity:.6;
}

@media(max-width:60rem) {
	.filters_icons {
		display: none;
	}
}

/* MY ALBUMS */
.header_my_albums {
	background-image: url(../images/header_bg_my_albums.jpg);
}

.my_albums > .wrap {
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(306px,1fr));
	gap:var(--space-m) var(--space-s);
	margin-inline:auto;
	padding-block:var(--space-xl);
	width:var(--mw-600-p-xs)
}

@media(max-width:20.625rem) {
	.my_albums > .wrap {
		grid-template-columns:1fr;
	}
}

.header_my_albums .photo {
	padding-top:var(--space-3xs)
}

.header_my_albums h3 {
	line-height:var(--lh-100);
}

@media(max-width:25rem) {
	.header_my_albums h3 {
		font-size:var(--fs-m);
		margin-block:var(--space-xs)
	}
}

.header_my_albums .author {
	column-gap: var(--space-2xs);
	display:grid;
	grid-template-columns:40px 1fr;
}

.card {
	border-radius:var(--br-500);
	box-shadow:var(--bs-200);
	display:grid;
	max-width: 465px;
	overflow: hidden;
}

.card h2 {
	font-size:var(--fs-s);
}

.card_images {
	--borders:3px solid var(--clr-primary-black-80);
	display:grid;
	grid-template-columns:2.6fr 1.6fr;
	position: relative;
}

.card_img_big {
	border-right: var(--borders);
	grid-row:1 / span 2;
	height:100%;
	object-fit:cover;
	width:100%;
}

.card_img_small {
	height:100%;
	object-fit:cover;
	width:100%;
}

.card_images > img:nth-child(2) {
	border-bottom: var(--borders);
}

.profile_img {
	border-radius:var(--br-900);
	bottom:var(--space-s);
	left:var(--space-s);
	position: absolute;
	
}

.card .title {
	margin-bottom:var(--space-2xs);
	max-width:90%;
}

.card .title a {
	color:var(--clr-primary-black);
}

.card .description {
	color:var(--clr-primary-black-50);
	margin-bottom:var(--space-s);
}

.card_texts {
	display:flex;
	flex-flow: column;
	justify-content:space-between;
	padding:var(--space-xs) var(--space-xs) var(--space-s);
	position: relative;
}

.share {
	position: absolute;
	top:var(--space-xs);
	right:var(--space-xs);
}

.card .icon {
	align-items:center;
	color:var(--clr-primary-black-50);
	display:flex;
}

.card a {
	text-decoration: none;
}

.card a:hover {
	opacity:.6;
}

.icon_views {
	margin-right:var(--space-2xs)
}

.card_footer {
	display:flex;
	justify-content: space-between
}

.card_footer p {
	color:var(--clr-primary-black-50);
	font-size:var(--fs-2xs)
}

.card_footer a {
	color:var(--clr-primary-black-50);
}



/* PRICING */
.toggle-container {
	--toggle-radius:var(--br-300);
	grid-column:1 / -1;
	margin-block:var(--space-m);
	margin-inline:auto;
	position: relative;
}

.toggle-checkbox {
	display: none;
}

.toggle-label {
	align-items: center;
	border-radius: var(--toggle-radius);
	cursor: pointer;
	display: flex;
	height: 40px;
	position: relative;
	transition: background-color 0.3s;
	width: 200px;
}

.toggle-text {
	color:var(--clr-primary-black);
	line-height: 40px;
	position: absolute;
	text-align: center;
	transition: opacity 0.3s;
	width: 50%;
}

.toggle-text:nth-child(1) {
	color:var(--clr-primary-white);
	left: 0;
	z-index:1;
}

.toggle-text:nth-child(2) {
	right: 0;
}

.toggle-slider {
	background-color:var(--clr-primary);
	background:var(--clr-d-gradient);
	border-radius: var(--toggle-radius);
	color:var(--clr-primary-white);
	height: 100%;
	position: absolute;
	transition: transform 0.3s;
	width: 50%;
}

.toggle-checkbox:checked + .toggle-label .toggle-slider {
	transform: translateX(100%);
}

.toggle-checkbox:checked + .toggle-label {
	/* border:1px solid blue */
}

.toggle-checkbox:checked + .toggle-label .toggle-text:nth-child(1) {
	color: var(--clr-primary-black);
	opacity: 1;
}

.toggle-checkbox:checked + .toggle-label .toggle-text:nth-child(2) {
	opacity: 1;
	color: white;
	z-index: 10;
}

.toggle-text.active {
	opacity: 1;
	z-index: 10;
}

.pricing > .wrap {
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(306px,1fr));
	gap:var(--space-m) var(--space-2xl);
	margin-inline:auto;
	padding-block:var(--space-xl);
	width:var(--mw-600-p-xs)
}

.price_card {
	border-radius:var(--br-500);
	box-shadow:var(--bs-200);
	display:grid;
	max-width: 465px;
	overflow: hidden;
	padding:var(--space-m) var(--space-l);
}

.price_card h2 {
	font-size:calc(.75*var(--fs-secondary-heading));
}

.price_card h3 {
	font-size:calc(.6*var(--fs-tertiary-heading));
	margin-bottom:var(--space-2xs);
}

.price_card .price {
	margin-bottom:var(--space-2xs)
}

.price .cycle {
	font-size:var(--fs-2xs);
	font-weight:var(--fw-body);
}

.price_card ul {
	color:var(--clr-primary-black-50);
	margin-left:var(--space-m)
}

.price_card ul li {
	margin-bottom:var(--space-2xs)
}

.price_texts {
	display: flex;
	flex-flow: column;
	justify-content: space-between;
}

.pricing .sign_up {
	width:100%;
}

.pricing .sign_up button {
	margin-top:var(--space-xs);
}