/* 00-tokens.css */

:root {
	/* Colors */
	--ms-color-bg: #ffffff;
	--ms-color-navy: #1b2d41;
	--ms-color-navy-light: #2c3b4b;
	--ms-color-slate: #5a6d82;
	--ms-color-beige: #f6f4ec;
	--ms-color-beige-border: #e7e4d3;
	--ms-color-border-muted: #cccccc;
	--ms-color-red: #cd4a26;
	--ms-color-red-dark: #a33b1e;
	--ms-color-text-primary: var(--ms-color-navy);
	--ms-color-text-secondary: var(--ms-color-slate);

	/* Borders */
	--ms-border: 1px solid #ccc; /* Borders/border */
	--ms-border-quiet: 1px solid #e8eaec; /* Borders/border-quiet */
	--ms-border-navy: 1px solid var(--ms-color-navy);
	--ms-border-strong: 2px solid var(--ms-color-slate); /* 2px solid slate */
	--ms-border-dashed: 1px dashed var(--ms-color-slate);

	/* Spacing */
	--ms-space-1: 0.5rem; /* 8px */
	--ms-space-2: 0.75rem; /* 12px */
	--ms-space-3: 1rem; /* 16px */
	--ms-space-4: 1.75rem; /* 28px */
	--ms-space-5: 2rem; /* 32px */
	--ms-space-6: 2.5rem; /* 40px */
	--ms-space-7: 3rem; /* 48px */
	--ms-space-8: 3.5rem; /* 56px */
	--ms-space-9: 4rem; /* 64px */

	/* Typography */
	--ms-font-sans: 'DM Sans', Arial, Helvetica, ui-sans-serif, system-ui,
		sans-serif;
	--ms-font-serif-display: 'Terza Display', Georgia, Times, 'Times New Roman',
		serif;
	--ms-font-serif-reader: 'Terza Reader', Georgia, Times, 'Times New Roman',
		serif;

	/* Font sizes */
	--ms-text-xs: 0.75rem; /* 12px */
	--ms-text-sm: 0.875rem; /* 14px */
	--ms-text-base: 1rem; /* 16px */
	--ms-text-lg: 1.125rem; /* 18px */
	--ms-text-xl: 1.25rem; /* 20px */
	--ms-text-2xl: 1.5rem; /* 24px */
	--ms-text-3xl: 1.875rem; /* 30px */
	--ms-text-4xl: 2.25rem; /* 36px */
	--ms-text-5xl: 2.5rem; /* 40px */
	--ms-text-6xl: 3rem; /* 48px */

	/* Line heights */
	--ms-leading-tight: 1.25;
	--ms-leading-normal: 1.5;
	--ms-leading-relaxed: 1.625;
	--ms-leading-loose: 2;

	/* Layout */
	--ms-container-max-width: 90rem;
	--ms-container-width: clamp(400px, 90vw, var(--ms-container-max-width));

	--ms-form-max-width: 40.625rem;
	--ms-border-radius: 0;
	--ms-border-radius-lg: 0.5rem; /* 8px */

	/* Shadows */
	--ms-shadow-sm: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.05);
	--ms-shadow: 0 0.0625rem 0.1875rem 0 rgba(0, 0, 0, 0.1),
		0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.06);
	--ms-shadow-md: 0 0.25rem 0.375rem -0.0625rem rgba(0, 0, 0, 0.1),
		0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.06);

	/* Transitions */
	--ms-transition-fast: 0.15s ease-in-out;
	--ms-transition-base: 0.2s ease-in-out;
	--ms-transition-slow: 0.3s ease-in-out;

	/* Typography – Figma-exact tokens */
	--ms-body-size: 1rem;
	--ms-body-line-height: 1.875rem;
	--ms-h1-size: 3.4375rem;
	--ms-h1-line-height: 3.125rem;
	--ms-h1-letter-spacing: 0.1875rem;
	--ms-serif-small-size: 1.5625rem;
	--ms-serif-small-line-height: 1.25rem;
	--ms-condensed-size: 1.5625rem;
	--ms-condensed-line-height: 1.375rem;
	--ms-mono-size: 0.875rem;
	--ms-mono-line-height: 1rem;
	--ms-tracking-050: 0.03125rem;
	--ms-tracking-100: 0.0625rem;
	--ms-h1-md-size: 2.8125rem;
	--ms-h1-sm-size: 2.1875rem;
	--ms-body-small-size: 1rem;
	--ms-body-small-line-height: 1.375rem;

	/* Extra spacing tokens for exact Figma gaps */
	--ms-space-10: 0.625rem; /* 10px */
	--ms-space-60: 3.75rem; /* 60px */
	--ms-space-100: 6.25rem; /* 100px */
}

/* 01-reset.css */

/* Use a more-intuitive box-sizing model */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Remove default margin */
* {
	margin: 0;
}

body {
	/* Add accessible line-height */
	line-height: 1.5;
	/* Improve text rendering */
	-webkit-font-smoothing: antialiased;
}

/* Improve media defaults */
img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
}

/* Inherit fonts for form controls */
input,
button,
textarea,
select {
	font: inherit;
}

/*
    Create a root stacking context
  */
#root,
#__next {
	isolation: isolate;
}
/* remove list styles */
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* 02-base.css */

body {
	background-color: var(--ms-color-bg);
	font-size: var(--ms-body-size);
	line-height: var(--ms-body-line-height);
	font-family: var(--ms-font-sans);
	color: var(--ms-color-text-primary);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

a {
	color: var(--ms-color-red);
	transition: color var(--ms-transition-fast);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-thickness: 0.0625rem;
	text-underline-offset: 0.125rem;
	&:focus {
		outline: var(--ms-border-dashed);
		outline-offset: 0;
	}
	&:hover {
		color: var(--ms-color-red-dark);
	}
}
p {
	line-height: var(--ms-leading-relaxed);
}
h1,
h2,
h3,
h4,
h5,
h6 {
	overflow-wrap: break-word;
	text-wrap: balance;
	font-weight: 400;
	color: var(--ms-color-text-primary);

	> a {
		font-weight: 400 !important;
	}
}
input[type='text'],
input[type='email'],
input[type='password'],
input[type='number'],
input[type='tel'],
input[type='date'],
input[type='time'],
textarea,
select {
	background-color: var(--ms-color-beige);
	display: block;
	max-width: 100%;
	width: 100%;
	border: none;
	border-radius: none;
	padding: var(--ms-space-2);
	font-size: var(--ms-text-base);
	line-height: var(--ms-leading-normal);
}
input[type='text']:focus,
input[type='email']:focus,
input[type='password']:focus,
input[type='number']:focus,
input[type='tel']:focus,
input[type='date']:focus,
input[type='time']:focus,
textarea:focus,
select:focus {
	outline: var(--ms-border-dashed);
	outline-offset: 0;
	border-color: var(--ms-color-slate);
}
button,
input[type='submit'] {
	font-family: var(--ms-font-sans);
	text-shadow: none;
	background-image: none;
	background-color: var(--ms-color-red);
	color: var(--ms-color-bg);
	border: none;
	border-radius: var(--ms-border-radius);
	padding: var(--ms-space-2);
	font-size: var(--ms-text-base);
	line-height: var(--ms-leading-normal);
	cursor: pointer;
	font-weight: 700;
	transition: background-color var(--ms-transition-fast);
}
button:hover,
input[type='submit']:hover {
	background-color: var(--ms-color-red-dark);
	border: none;
	background-image: none;
	color: var(--ms-color-bg);
}
input[type='submit'] {
	margin-top: var(--ms-space-4);
}

.container {
	top: 0 !important;
	width: 100%;
	margin: 0;
	padding: var(--ms-space-6) 0;
}
.register__img {
    margin: 0 auto;
    max-width: 50rem;
    margin-bottom: var(--ms-space-4);
}
.giftloc {
    width: var(--ms-container-width);
    max-width: 90%;
    margin: 2rem auto;
    text-align: center;
}
#content4 > .section-head {
    width: var(--ms-container-width);
    max-width: 90%;
    margin: 0 auto;
}
#content4 {
    margin: 0 auto;
}
.register-landing__location-price-info {
    display: inline-block;
}
.register__form-columns {
    gap: var(--ms-space-4);
}
.container {
    padding: var(--ms-space-6) 0 0;
}
@media (max-width: 768px) {
    div#name-row,
    .passwords {
        gap: 0px;
    }
}
