@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-latin.woff2") format("woff2-variations");
  unicode-range: U+0000-00ff, U+0131, U+0152-0153, U+02bb-02bc, U+02c6, U+02da, U+02dc, U+0304, U+0308, U+0329, U+2000-206f, U+20ac, U+2122, U+2191, U+2193, U+2212, U+2215, U+feff, U+fffd;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-112.woff2") format("woff2");
  unicode-range: U+2665,U+3160,U+4e2d,U+6587,U+65e5,U+ac12,U+ac14,U+ac16,U+ac81,U+ad34,U+ade0,U+ae54,U+aebc,U+af2c,U+afc0,U+afc8,U+b04c,U+b08c,U+b099,U+b0a9,U+b0ac,U+b0ae,U+b0b8,U+b123,U+b179,U+b2e5,U+b2f7,U+b4c0,U+b531,U+b538,U+b545,U+b550,U+b5a8,U+b6f0,U+b728,U+b73b,U+b7ad,U+b7ed,U+b809,U+b864,U+b86d,U+b871,U+b9bf,U+b9f5,U+ba40,U+ba4b,U+ba58,U+ba87,U+baac,U+bbc0,U+bc16,U+bc34,U+bd07,U+bd99,U+be59,U+bfd0,U+c058,U+c0e4,U+c0f5,U+c12d,U+c139,U+c228,U+c529,U+c5c7,U+c635,U+c637,U+c735,U+c77d,U+c787,U+c789,U+c8c4,U+c989,U+c98c,U+c9d0,U+c9d3,U+cc0c,U+cc99,U+cd0c,U+cd2c,U+cd98,U+cda4,U+ce59,U+ce60,U+ce6d,U+cea0,U+d0d0-d0d1,U+d0d5,U+d14d,U+d1a4,U+d29c,U+d2f1,U+d301,U+d39c,U+d3bc,U+d4e8,U+d540,U+d5ec,U+d640,U+d750;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-113.woff2") format("woff2");
  unicode-range: U+5e,U+25b2,U+25b6,U+314e,U+ac24,U+ace1,U+ace4,U+ae68,U+af2d,U+b0d0,U+b0e5,U+b150,U+b155,U+b193,U+b2c9,U+b2dd,U+b3c8,U+b3fc,U+b410,U+b458,U+b4dd,U+b5a0,U+b5a4,U+b5bb,U+b7b5,U+b838,U+b840,U+b86f,U+b8f9,U+b960,U+b9e5,U+bab8,U+bb50,U+bc1d,U+bc24-bc25,U+bca8,U+bcbd,U+bd04,U+bd10,U+bd24,U+be48,U+be5b,U+be68,U+c05c,U+c12c,U+c140,U+c15c,U+c168,U+c194,U+c219,U+c27d,U+c2a8,U+c2f1,U+c2f8,U+c368,U+c554-c555,U+c559,U+c564,U+c5d8,U+c5fc,U+c625,U+c65c,U+c6b1,U+c728,U+c794,U+c84c,U+c88c,U+c8e0,U+c8fd,U+c998,U+c9dd,U+cc0d,U+cc30,U+ceec,U+cf13,U+cf1c,U+cf5c,U+d050,U+d07c,U+d0a8,U+d134,U+d138,U+d154,U+d1f4,U+d2bc,U+d329,U+d32c,U+d3d0,U+d3f4,U+d3fc,U+d56b,U+d5cc,U+d600-d601,U+d639,U+d6c8,U+d754,U+d765;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-114.woff2") format("woff2");
  unicode-range: U+3c-3d,U+2026,U+24d2,U+314b,U+ac11,U+acf3,U+ad74,U+ad81,U+adf9,U+ae34,U+af43,U+afb8,U+b05d,U+b07c,U+b110,U+b118,U+b17c,U+b180,U+b18d,U+b192,U+b2cc,U+b355,U+b378,U+b4a4,U+b4ef,U+b78d,U+b799,U+b7a9,U+b7fd,U+b807,U+b80c,U+b839,U+b9b4,U+b9db,U+ba3c,U+bab0,U+bba4,U+bc94,U+be4c,U+c154,U+c1c4,U+c26c,U+c2ac,U+c2ed,U+c4f4,U+c55e,U+c561,U+c571,U+c5b5,U+c5c4,U+c654-c655,U+c695,U+c6e8,U+c6f9,U+c724,U+c751,U+c775,U+c7a0,U+c7c1,U+c874,U+c880,U+c9d5,U+c9f8,U+cabd,U+cc29,U+cc2c,U+cca8,U+ccab,U+ccd0,U+ce21,U+ce35,U+ce7c,U+ce90,U+cee8,U+cef4,U+cfe0,U+d070,U+d0b9,U+d0c1,U+d0c4,U+d0c8,U+d15c,U+d1a1,U+d2c0,U+d300,U+d314,U+d3ed,U+d478,U+d480,U+d48d,U+d508,U+d53d,U+d5e4,U+d611,U+d61c,U+d68d,U+d6a8,U+d798;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-115.woff2") format("woff2");
  unicode-range: U+23,U+25,U+5f,U+a9,U+ac08,U+ac78,U+aca8,U+ace8,U+ad70,U+adc0,U+addc,U+b137,U+b140,U+b208,U+b290,U+b2f5,U+b3c5,U+b3cc,U+b420,U+b429,U+b529,U+b530,U+b77d,U+b79c,U+b7a8,U+b7c9,U+b7f0,U+b7fc,U+b828,U+b860,U+b9ad,U+b9c1,U+b9c9,U+b9dd-b9de,U+b9e8,U+ba38-ba39,U+babb,U+bc00,U+bc8c,U+bca0,U+bca4,U+bcd1,U+bcfc,U+bd09,U+bdf0,U+be60,U+c0ad,U+c0b4,U+c0bc,U+c190,U+c1fc,U+c220,U+c288,U+c2b9,U+c2f6,U+c528,U+c545,U+c558,U+c5bc,U+c5d4,U+c600,U+c644,U+c6c0,U+c6c3,U+c721,U+c798,U+c7a1,U+c811,U+c838,U+c871,U+c904,U+c990,U+c9dc,U+cc38,U+cc44,U+cca0,U+cd1d,U+cd95,U+cda9,U+ce5c,U+cf00,U+cf58,U+d150,U+d22c,U+d305,U+d328,U+d37c,U+d3f0,U+d551,U+d5a5,U+d5c8,U+d5d8,U+d63c,U+d64d,U+d669,U+d734,U+d76c;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-116.woff2") format("woff2");
  unicode-range: U+26,U+2b,U+3e,U+40,U+7e,U+ac01,U+ac19,U+ac1d,U+aca0,U+aca9,U+acb0,U+ad8c,U+ae09,U+ae38,U+ae40,U+aed8,U+b09c,U+b0a0,U+b108,U+b204,U+b298,U+b2d8,U+b2eb-b2ec,U+b2f4,U+b313,U+b358,U+b450,U+b4e0,U+b54c,U+b610,U+b780,U+b78c,U+b791,U+b8e8,U+b958,U+b974,U+b984,U+b9b0,U+b9bc-b9bd,U+b9ce,U+ba70,U+bbfc,U+bc0f,U+bc15,U+bc1b,U+bc31,U+bc95,U+bcc0,U+bcc4,U+bd81,U+bd88,U+c0c8,U+c11d,U+c13c,U+c158,U+c18d,U+c1a1,U+c21c,U+c4f0,U+c54a,U+c560,U+c5b8,U+c5c8,U+c5f4,U+c628,U+c62c,U+c678,U+c6cc,U+c808,U+c810,U+c885,U+c88b,U+c900,U+c988,U+c99d,U+c9c8,U+cc3d-cc3e,U+cc45,U+cd08,U+ce20,U+cee4,U+d074,U+d0a4,U+d0dd,U+d2b9,U+d3b8,U+d3c9,U+d488,U+d544,U+d559,U+d56d,U+d588,U+d615,U+d648,U+d655,U+d658,U+d65c;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-117.woff2") format("woff2");
  unicode-range: U+d,U+48,U+7c,U+ac10,U+ac15,U+ac74,U+ac80,U+ac83,U+acc4,U+ad11,U+ad50,U+ad6d,U+adfc,U+ae00,U+ae08,U+ae4c,U+b0a8,U+b124,U+b144,U+b178,U+b274,U+b2a5,U+b2e8,U+b2f9,U+b354,U+b370,U+b418,U+b41c,U+b4f1,U+b514,U+b798,U+b808,U+b824-b825,U+b8cc,U+b978,U+b9d0,U+b9e4,U+baa9,U+bb3c,U+bc18,U+bc1c,U+bc30,U+bc84,U+bcf5,U+bcf8,U+bd84,U+be0c,U+be14,U+c0b0,U+c0c9,U+c0dd,U+c124,U+c2dd,U+c2e4,U+c2ec,U+c54c,U+c57c-c57d,U+c591,U+c5c5-c5c6,U+c5ed,U+c608,U+c640,U+c6b8,U+c6d4,U+c784,U+c7ac,U+c800-c801,U+c9c1,U+c9d1,U+cc28,U+cc98,U+cc9c,U+ccad,U+cd5c,U+cd94,U+cd9c,U+cde8,U+ce68,U+cf54,U+d0dc,U+d14c,U+d1a0,U+d1b5,U+d2f0,U+d30c,U+d310,U+d398,U+d45c,U+d50c,U+d53c,U+d560,U+d568,U+d589,U+d604,U+d6c4,U+d788;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-118.woff2") format("woff2");
  unicode-range: U+39,U+49,U+4d-4e,U+a0,U+ac04,U+ac1c,U+ac70,U+ac8c,U+acbd,U+acf5,U+acfc,U+ad00,U+ad6c,U+adf8,U+b098,U+b0b4,U+b294,U+b2c8,U+b300,U+b3c4,U+b3d9,U+b4dc,U+b4e4,U+b77c,U+b7ec,U+b85d,U+b97c,U+b9c8,U+b9cc,U+ba54,U+ba74,U+ba85,U+baa8,U+bb34,U+bb38,U+bbf8,U+bc14,U+bc29,U+bc88,U+bcf4,U+bd80,U+be44,U+c0c1,U+c11c,U+c120,U+c131,U+c138,U+c18c,U+c218,U+c2b5,U+c2e0,U+c544,U+c548,U+c5b4,U+c5d0,U+c5ec,U+c5f0,U+c601,U+c624,U+c694,U+c6a9,U+c6b0,U+c6b4,U+c6d0,U+c704,U+c720,U+c73c,U+c740,U+c744,U+c74c,U+c758,U+c77c,U+c785,U+c788,U+c790-c791,U+c7a5,U+c804,U+c815,U+c81c,U+c870,U+c8fc,U+c911,U+c9c4,U+ccb4,U+ce58,U+ce74,U+d06c,U+d0c0,U+d130,U+d2b8,U+d3ec,U+d504,U+d55c,U+d569,U+d574,U+d638,U+d654,U+d68c;
}

@font-face {
  font-family: "Team Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("fonts/team-sans-kr-119.woff2") format("woff2");
  unicode-range: U+20-22,U+27-2a,U+2c-38,U+3a-3b,U+3f,U+41-47,U+4a-4c,U+4f-5d,U+61-7b,U+7d,U+a1,U+ab,U+ae,U+b7,U+bb,U+bf,U+2013-2014,U+201c-201d,U+2122,U+ac00,U+ace0,U+ae30,U+b2e4,U+b85c,U+b9ac,U+c0ac,U+c2a4,U+c2dc,U+c774,U+c778,U+c9c0,U+d558;
}


:root {
  color-scheme: dark;
  --surface-primary: #000000;
  --surface-secondary: #111113;
  --surface-elevated: #202024;
  --surface-office: #383838;
  --surface-light: #f5f5f7;
  --text-primary: #ffffff;
  --text-secondary: #b7b7bd;
  --text-muted: #8d8d93;
  --text-on-light: #212124;
  --border-default: #29292e;
  --accent-primary: #a829c8;
  --accent-hover: #c33de0;
  --accent-blue: #1769d4;
  --accent-purple: #7424ff;
  --accent-pink: #ff0a78;
  --accent-red: #ff3154;
  --action-pink: #c40068;
  --accent-orange: #ff9c19;
  --focus-ring: #ffffff;
  --text-display: clamp(2.5rem, 8vw, 5.5rem);
  --text-h1: clamp(2rem, 5vw, 3rem);
  --text-h2: clamp(1.5rem, 3vw, 2.25rem);
  --text-h3: 1.25rem;
  --text-body-lg: 1.125rem;
  --text-body: 1rem;
  --text-body-sm: 0.875rem;
  --text-caption: 0.75rem;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --motion-micro: 140ms;
  --motion-standard: 240ms;
  --shadow-subtle: 0 1px 2px rgba(0, 0, 0, 0.25);
  --shadow-default: 0 16px 48px rgba(0, 0, 0, 0.32);
  --shadow-hero: 0 28px 45px rgba(0, 0, 0, 0.34);
  --content-width: 1160px;
  --reading-width: 860px;
  --page-gutter: clamp(var(--space-5), 4vw, var(--space-12));
  --font-sans: "Team Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", Arial, sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  color: var(--text-secondary);
  background: var(--surface-primary);
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea {
  font: inherit;
}

:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: var(--space-3);
  left: var(--space-3);
  padding: var(--space-2) var(--space-4);
  color: var(--surface-primary);
  background: var(--text-primary);
  border-radius: 999px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-160%);
  transition: opacity var(--motion-micro) ease-out, transform var(--motion-micro) ease-out;
}

.skip-link:focus {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.shell {
  width: min(100% - (var(--page-gutter) * 2), var(--content-width));
  margin-inline: auto;
}

.site-header {
  position: relative;
  z-index: 20;
  min-height: 88px;
  border-bottom: 1px solid var(--border-default);
  background: var(--surface-primary);
}

.site-header__inner {
  display: flex;
  min-height: 88px;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

.brand-mark {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 44px;
}

.brand-mark img {
  width: 108px;
  height: auto;
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(var(--space-4), 2.4vw, var(--space-8));
}

.site-nav a,
.footer-nav a {
  color: var(--text-secondary);
  font-size: var(--text-body-sm);
  font-weight: 700;
  letter-spacing: 0.03em;
  transition: color var(--motion-micro) ease-out;
}

.site-nav a:hover,
.footer-nav a:hover {
  color: var(--text-primary);
}

.header-actions,
.button-cluster,
.store-links,
.social-links {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-5);
  border: 0;
  border-radius: 999px;
  color: var(--text-primary);
  background: var(--accent-primary);
  box-shadow: var(--shadow-subtle);
  font-size: var(--text-body-sm);
  font-weight: 750;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: transform var(--motion-micro) ease-out, filter var(--motion-micro) ease-out, background-color var(--motion-micro) ease-out;
}

.button:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

.button:active {
  transform: translateY(1px);
}

.button--blue {
  background: var(--accent-blue);
}

.button--pink {
  background: var(--action-pink);
}

.button--quiet {
  border: 1px solid var(--border-default);
  background: var(--surface-secondary);
}

.eyebrow {
  margin: 0 0 var(--space-3);
  color: var(--text-primary);
  font-size: var(--text-caption);
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.hero {
  position: relative;
  isolation: isolate;
  min-height: min(760px, calc(100svh - 88px));
  overflow: hidden;
  background: linear-gradient(130deg, var(--accent-purple) 0%, var(--accent-pink) 38%, var(--accent-red) 70%, var(--accent-orange) 100%);
}

.hero::after {
  position: absolute;
  z-index: -1;
  inset: auto -12% -42% 34%;
  width: 68%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--accent-orange);
  filter: blur(120px);
  content: "";
  opacity: 0.3;
}

.hero__inner {
  display: grid;
  min-height: inherit;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.72fr);
  align-items: center;
  gap: var(--space-12);
  padding-block: var(--space-16);
}

.hero__copy {
  max-width: 660px;
  color: var(--text-primary);
}

.hero h1 {
  margin: 0;
  max-width: 9ch;
  font-size: var(--text-display);
  font-weight: 850;
  letter-spacing: -0.055em;
  line-height: 1.02;
}

.hero__lead {
  max-width: 34rem;
  margin: var(--space-5) 0 var(--space-8);
  color: var(--text-primary);
  font-size: var(--text-body-lg);
}

.hero__visual {
  align-self: end;
  justify-self: center;
}

.hero__visual img {
  width: min(400px, 34vw);
  filter: drop-shadow(var(--shadow-hero));
}

.section {
  padding-block: var(--space-24);
}

.section__heading {
  display: grid;
  max-width: 740px;
  gap: var(--space-3);
  margin-bottom: var(--space-12);
}

.section__heading h2,
.cta-card h2,
.product-card h1,
.legal-document h1,
.contact-card h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-h1);
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.section__heading p,
.cta-card p {
  margin: 0;
  font-size: var(--text-body-lg);
}

.media-grid,
.feature-grid,
.office-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
}

.media-card,
.feature-card,
.office-card {
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: var(--space-5);
  background: var(--surface-secondary);
  box-shadow: var(--shadow-default);
}

.media-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.media-card__body,
.feature-card__body,
.office-card__body {
  padding: var(--space-6);
}

.media-card h3,
.feature-card h3,
.office-card h2 {
  margin: 0 0 var(--space-2);
  color: var(--text-primary);
  font-size: var(--text-h3);
  line-height: 1.35;
}

.media-card p,
.feature-card p,
.office-card p {
  margin: 0;
}

.product-showcase {
  position: relative;
  overflow: hidden;
  color: var(--text-on-light);
  background: var(--surface-light);
}

.product-showcase__inner {
  display: grid;
  min-height: 720px;
  grid-template-columns: 0.92fr 1.08fr;
  align-items: center;
  gap: var(--space-16);
}

.product-showcase__visual img {
  width: min(760px, 58vw);
  margin-inline: auto;
}

.product-showcase__copy h2 {
  margin: 0 0 var(--space-4);
  color: var(--text-on-light);
  font-size: var(--text-h1);
  letter-spacing: -0.035em;
  line-height: 1.12;
}

.product-showcase .eyebrow {
  color: var(--text-on-light);
}

.product-showcase__copy p {
  margin: 0;
  font-size: var(--text-body-lg);
}

.feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.feature-card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.review-panel {
  overflow: hidden;
  border-radius: var(--space-5);
  background: var(--surface-light);
  box-shadow: var(--shadow-default);
}

.review-panel img {
  width: 100%;
}

.cta-card {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--space-8);
  padding: clamp(var(--space-8), 6vw, var(--space-16));
  border: 1px solid var(--border-default);
  border-radius: var(--space-5);
  background: var(--surface-elevated);
  box-shadow: var(--shadow-default);
}

.cta-card__copy {
  display: grid;
  gap: var(--space-2);
}

.store-badge {
  display: block;
  border-radius: var(--space-2);
  transition: transform var(--motion-micro) ease-out, filter var(--motion-micro) ease-out;
}

.store-badge:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.store-badge img {
  width: 168px;
}

.page-hero {
  padding: var(--space-16) 0 var(--space-8);
}

.page-hero h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-h1);
  letter-spacing: -0.035em;
}

.legal-document,
.contact-card,
.product-card {
  width: min(100% - (var(--page-gutter) * 2), var(--reading-width));
  margin-inline: auto;
}

.legal-document {
  padding-block: var(--space-16) var(--space-24);
}

.legal-document h1 {
  margin-bottom: var(--space-10);
}

.legal-document p,
.legal-document li {
  overflow-wrap: anywhere;
}

.legal-document p {
  margin: 0 0 var(--space-5);
}

.legal-document ol,
.legal-document ul {
  display: grid;
  gap: var(--space-3);
  margin: 0 0 var(--space-8);
  padding-left: var(--space-6);
}

.legal-document a,
.contact-email {
  color: var(--text-primary);
  text-decoration: underline;
  text-decoration-color: var(--accent-primary);
  text-underline-offset: var(--space-1);
}

.delete-steps {
  display: grid;
  gap: var(--space-10);
  margin-top: var(--space-8);
  padding: 0;
  list-style: none;
  counter-reset: step;
}

.delete-step {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: var(--space-5);
  counter-increment: step;
}

.delete-step::before {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  color: var(--text-primary);
  background: var(--accent-primary);
  font-weight: 800;
  content: counter(step);
}

.delete-step__content p {
  margin-top: var(--space-2);
  word-break: keep-all;
  overflow-wrap: break-word;
}

.keep-together {
  white-space: nowrap;
}

.delete-step__images {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-5);
}

.delete-step__images img {
  width: min(100%, 350px);
  border-radius: var(--space-3);
}

.contact-card {
  padding-block: var(--space-16) var(--space-24);
}

.contact-card__intro {
  margin: var(--space-4) 0 var(--space-10);
  font-size: var(--text-body-lg);
}

.email-form {
  display: grid;
  gap: var(--space-6);
  padding: clamp(var(--space-6), 5vw, var(--space-10));
  border: 1px solid var(--border-default);
  border-radius: var(--space-5);
  background: var(--surface-secondary);
  box-shadow: var(--shadow-default);
}

.field {
  display: grid;
  gap: var(--space-2);
}

.field label {
  color: var(--text-primary);
  font-size: var(--text-body-sm);
  font-weight: 700;
}

.field input,
.field textarea {
  width: 100%;
  min-height: 48px;
  padding: var(--space-3) 0;
  border: 0;
  border-bottom: 1px solid var(--accent-primary);
  border-radius: 0;
  color: var(--text-primary);
  background: transparent;
  outline: 0;
}

.field textarea {
  min-height: 128px;
  resize: vertical;
}

.field input:focus,
.field textarea:focus {
  border-bottom-color: var(--accent-hover);
}

.form-note {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--text-body-sm);
}

.office-grid {
  width: min(100% - (var(--page-gutter) * 2), var(--content-width));
  margin-inline: auto;
  padding-block: var(--space-16) var(--space-24);
}

.office-card {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) 1fr;
  align-items: center;
}

.office-card > img {
  width: 100%;
}

.office-card .store-links,
.product-card .store-links {
  flex-wrap: wrap;
  margin-top: var(--space-5);
}

.product-card {
  display: grid;
  justify-items: center;
  gap: var(--space-5);
  padding-block: var(--space-20) var(--space-24);
  text-align: center;
}

.product-card__icon {
  width: min(280px, 64vw);
  border-radius: var(--space-6);
}

.office-page {
  display: grid;
  min-height: 100dvh;
  place-items: center;
}

.office-page .product-card {
  padding: clamp(var(--space-6), 5vw, var(--space-12));
  border-radius: var(--space-5);
  background: var(--surface-office);
}

.office-page .office-grid {
  padding-block: var(--space-6);
}

.office-page .office-card {
  background: var(--surface-office);
}

.office-card > .office-product-icon {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.office-store-link {
  display: block;
  flex: 1 1 220px;
  border-radius: var(--space-2);
}

.office-store-link img {
  width: 100%;
}

.site-footer {
  border-top: 1px solid var(--border-default);
  background: var(--surface-primary);
}

.site-footer__inner {
  display: grid;
  justify-items: center;
  gap: var(--space-4);
  padding-block: var(--space-12);
  text-align: center;
}

.social-links a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding-inline: var(--space-2);
  color: var(--text-primary);
  font-size: var(--text-body-sm);
  font-weight: 700;
}

.footer-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-3) var(--space-5);
}

.site-footer small {
  color: var(--text-muted);
}

@media (max-width: 1023px) {
  .site-header__inner {
    flex-wrap: wrap;
    padding-block: var(--space-3);
  }

  .site-nav {
    order: 3;
    width: 100%;
    justify-content: center;
  }

  .hero__inner,
  .product-showcase__inner {
    grid-template-columns: 1fr 0.82fr;
  }

  .feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .office-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  html {
    scroll-padding-top: 120px;
  }

  .site-header,
  .site-header__inner {
    min-height: 76px;
  }

  .brand-mark img {
    width: 78px;
  }

  .header-actions {
    gap: var(--space-2);
  }

  .header-actions .button {
    min-height: 40px;
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-caption);
  }

  .header-actions .button__desktop-label {
    display: none;
  }

  .site-nav {
    gap: var(--space-4);
  }

  .site-nav a {
    font-size: var(--text-caption);
  }

  .hero {
    min-height: auto;
  }

  .hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-8);
    padding-top: var(--space-16);
    padding-bottom: 0;
    text-align: center;
  }

  .hero h1 {
    max-width: none;
  }

  .hero__lead {
    margin-inline: auto;
  }

  .hero .button-cluster {
    justify-content: center;
  }

  .hero__visual {
    align-self: auto;
  }

  .hero__visual img {
    width: min(360px, 88vw);
    margin-inline: auto;
  }

  .section {
    padding-block: var(--space-16);
  }

  .section__heading {
    margin-bottom: var(--space-8);
  }

  .media-grid,
  .feature-grid,
  .office-grid,
  .product-showcase__inner,
  .cta-card {
    grid-template-columns: 1fr;
  }

  .product-showcase__inner {
    min-height: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-8);
    padding-block: var(--space-16);
  }

  .product-showcase__copy {
    order: -1;
    text-align: center;
  }

  .product-showcase__visual img {
    width: min(620px, 110vw);
    max-width: none;
    margin-left: 50%;
    transform: translateX(-50%);
  }

  .cta-card {
    text-align: center;
  }

  .cta-card .store-links {
    justify-content: center;
    flex-wrap: wrap;
  }

  .delete-step {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: var(--space-3);
  }

  .delete-step::before {
    width: 32px;
    height: 32px;
  }

  .delete-step__images {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  .header-actions .button--pink {
    display: none;
  }

  .button-cluster {
    flex-direction: column;
    align-items: stretch;
  }

  .store-badge img {
    width: 150px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}