:root {
  color-scheme: light;
  --ink: #15223a;
  --muted: #5d6880;
  --night: #071a35;
  --paper: #f4f6fb;
  --white: #fff;
  --line: #dfe5ef;
  --blue: #168cf3;
  --purple: #7667ee;
  --mint: #54d7b1;
  --yellow: #ffd166;
  --coral: #ff8a9b;
  --shadow: 0 24px 65px rgba(24, 39, 70, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 16px/1.7 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
.skip-link {
  position: fixed; top: 8px; left: 8px; z-index: 100;
  padding: 9px 15px; border-radius: 8px; background: #fff; color: var(--night);
  font-weight: 800; transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

.header-inner, .section-inner, .footer-inner, .legal-hero-inner, .legal-layout {
  width: min(1180px, calc(100% - 48px)); margin-inline: auto;
}
.site-header {
  position: absolute; inset: 0 0 auto; z-index: 20;
  border-bottom: 1px solid rgba(255,255,255,.2); color: #fff;
  background: linear-gradient(rgba(3,31,74,.68), rgba(3,31,74,.12));
}
.header-inner {
  min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 850; text-decoration: none; letter-spacing: -.025em; }
.brand-mark {
  width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px;
  background: linear-gradient(145deg, #9c8fff, #6957e4); color: #fff; box-shadow: inset 0 -4px 0 rgba(0,0,0,.12);
  font-size: 19px; transform: rotate(-4deg);
}
.site-nav { display: flex; align-items: center; gap: 5px; }
.site-nav a { padding: 8px 12px; border-radius: 10px; color: rgba(255,255,255,.82); font-size: 14px; font-weight: 700; text-decoration: none; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav .active { background: rgba(255,255,255,.14); color: #fff; outline: none; }
.site-nav .nav-cta { margin-left: 5px; padding-inline: 17px; background: #fff; color: #0758a6; }
.site-nav .nav-cta:hover, .site-nav .nav-cta:focus-visible { background: var(--yellow); color: var(--night); }

.image-hero { position: relative; overflow: hidden; background: #159cf4; }
.image-hero > img {
  width: 100%; height: auto; display: block;
  aspect-ratio: 1983 / 793; object-fit: contain; object-position: center;
}
.image-hero-shade {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(3,31,74,.26) 0%, transparent 35%, rgba(4,20,54,.08) 65%, rgba(4,20,54,.75) 100%);
}
.hero-message {
  position: absolute; right: 24px; bottom: 34px; left: 24px; z-index: 2;
  width: min(1180px, calc(100% - 48px)); margin: auto; color: #fff;
  text-shadow: 0 2px 18px rgba(3,31,74,.35);
}
.hero-message p { margin: 0 0 7px; font-size: 12px; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.hero-message h1 { max-width: 760px; margin: 0; font-size: clamp(34px, 5vw, 67px); line-height: 1.02; letter-spacing: -.06em; }
.hero-message a { display: inline-flex; gap: 10px; margin-top: 19px; font-size: 14px; font-weight: 750; text-decoration: none; }
.intro-strip { background: var(--night); color: #fff; }
.intro-strip-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.intro-strip p { margin: 0; color: rgba(255,255,255,.68); font-size: 15px; }
.intro-strip strong { color: #fff; }
.intro-strip span { color: var(--yellow); font-size: 24px; }

.section { padding: 112px 0; }
.about-section { background: #fff; }
.about-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 95px; }
.section-label { margin: 0 0 22px; color: #5c4ed1; font-size: 11px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.section h2, .next-adventure h2 {
  margin: 0; font-size: clamp(42px, 5.2vw, 67px); font-weight: 850; line-height: 1.03; letter-spacing: -.06em;
}
.section h2 span, .next-adventure h2 span {
  color: var(--purple); font-family: Georgia, "Times New Roman", serif; font-style: italic; font-weight: 400;
}
.about-copy { padding-top: 42px; color: var(--muted); }
.about-copy p { max-width: 610px; margin: 0 0 19px; }
.about-copy .lead-copy { color: var(--ink); font-size: 20px; font-weight: 590; }
.about-note {
  width: fit-content; margin-top: 31px; display: flex; align-items: center; gap: 13px;
  padding: 15px 18px; border: 1px solid #e5e0ff; border-radius: 15px; background: #f4f1ff;
}
.about-note > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: var(--purple); color: #fff; }
.about-note p { margin: 0; font-size: 13px; line-height: 1.4; }
.about-note strong { color: var(--ink); }

.creations-section { background: #f2f4f9; }
.section-heading { margin-bottom: 50px; display: grid; grid-template-columns: 1fr .55fr; align-items: end; gap: 75px; }
.section-heading > p { margin: 0 0 4px; color: var(--muted); font-size: 17px; }
.creation-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.creation-card {
  --card-color: var(--purple); position: relative; min-height: 325px; overflow: hidden;
  padding: 35px; border: 1px solid rgba(21,34,58,.08); border-radius: 24px; background: #fff;
  transition: transform .2s ease, box-shadow .2s ease;
}
.creation-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.creation-card::after {
  position: absolute; right: -85px; bottom: -105px; width: 245px; height: 245px;
  border-radius: 50%; background: var(--card-color); content: ""; opacity: .14;
}
.card-mint { --card-color: var(--mint); } .card-yellow { --card-color: var(--yellow); } .card-blue { --card-color: #6ab8ff; }
.card-number { position: absolute; top: 29px; right: 31px; color: #9aa5b7; font: 750 11px ui-monospace, monospace; letter-spacing: .13em; }
.card-icon {
  width: 74px; height: 74px; display: grid; place-items: center; margin-bottom: 45px;
  border-radius: 21px; background: color-mix(in srgb, var(--card-color) 24%, white); transform: rotate(-3deg);
}
.card-icon svg { width: 42px; height: 42px; fill: none; stroke: var(--ink); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.creation-card h3 { position: relative; z-index: 1; margin: 0 0 10px; font-size: 25px; letter-spacing: -.035em; }
.creation-card p { position: relative; z-index: 1; max-width: 450px; margin: 0; color: var(--muted); }

.philosophy-section { position: relative; overflow: hidden; padding: 120px 0; background: var(--night); color: #fff; }
.philosophy-section::before {
  position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.1) 1px, transparent 1px);
  background-size: 26px 26px; content: ""; opacity: .25;
}
.philosophy-glow { position: absolute; top: -260px; right: -180px; width: 600px; height: 600px; border-radius: 50%; background: var(--blue); filter: blur(130px); opacity: .22; }
.philosophy-inner { position: relative; z-index: 1; }
.section-label-light { color: var(--mint); }
.philosophy-headline { margin-bottom: 75px; display: grid; grid-template-columns: 1fr .72fr; align-items: end; gap: 95px; }
.philosophy-headline h2 { margin: 0; font-size: clamp(54px, 7vw, 90px); line-height: .95; letter-spacing: -.065em; }
.philosophy-headline h2 em { color: #9a8fff; font-family: Georgia, serif; font-weight: 400; letter-spacing: -.04em; }
.philosophy-headline p { margin: 0 0 8px; color: rgba(255,255,255,.64); font-size: 17px; }
.principles { margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.15); list-style: none; }
.principles li { display: grid; grid-template-columns: 70px 1fr; align-items: center; padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.15); }
.principles span { color: rgba(255,255,255,.35); font: 750 11px ui-monospace, monospace; }
.principles strong { font-size: clamp(18px, 2.2vw, 27px); font-weight: 620; letter-spacing: -.025em; }

.contact-section { background: #fff; }
.contact-card { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.2fr .8fr; border-radius: 32px; background: #f1efff; }
.contact-card::before { position: absolute; top: -180px; right: -150px; width: 500px; height: 500px; border-radius: 50%; background: #dcd5ff; content: ""; }
.contact-copy { position: relative; z-index: 2; padding: 70px; }
.contact-copy h2 { font-size: clamp(42px, 5vw, 64px); }
.contact-copy > p:not(.section-label):not(.response-time) { max-width: 570px; margin: 23px 0 30px; color: var(--muted); font-size: 17px; }
.email-link { width: fit-content; display: flex; align-items: center; gap: 15px; padding-bottom: 5px; border-bottom: 2px solid var(--ink); font-size: clamp(18px, 2.5vw, 27px); font-weight: 800; letter-spacing: -.035em; text-decoration: none; }
.email-link i { font-style: normal; }
.response-time { display: flex; align-items: center; gap: 8px; margin: 21px 0 0; color: #717c91; font-size: 13px; }
.response-time span { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 4px rgba(84,215,177,.18); }
.contact-graphic { position: relative; z-index: 1; min-height: 475px; display: grid; place-items: center; }
.mail-card { position: relative; width: 205px; height: 150px; display: grid; place-items: center; border-radius: 20px; background: var(--purple); box-shadow: 0 30px 65px rgba(88,71,218,.28); transform: rotate(7deg); }
.mail-card::before, .mail-card::after { position: absolute; inset: auto 0 0; height: 100px; border-radius: 0 0 18px 18px; background: linear-gradient(32deg, #6958e2 49%, transparent 50%); content: ""; }
.mail-card::after { background: linear-gradient(-32deg, #7361eb 49%, transparent 50%); }
.mail-flap { position: absolute; z-index: 3; top: 0; width: 100%; height: 95px; background: linear-gradient(34deg, transparent 49%, #8c7cf8 50%), linear-gradient(-34deg, transparent 49%, #8c7cf8 50%); }
.mail-card span { position: relative; z-index: 5; width: 45px; height: 45px; display: grid; place-items: center; border-radius: 50%; background: var(--yellow); color: var(--ink); transform: translateY(16px); }
.contact-star { position: absolute; font-weight: 900; }
.star-a { top: 20%; right: 18%; color: var(--yellow); font-size: 30px; } .star-b { bottom: 22%; left: 14%; color: var(--purple); font-size: 34px; } .star-c { top: 32%; left: 17%; color: var(--coral); }

.next-adventure { padding: 100px 0 110px; background: #f2f4f9; text-align: center; }
.adventure-inner { max-width: 920px; }
.next-adventure > div > p:not(.section-label):not(.sign-off) { max-width: 660px; margin: 27px auto 0; color: var(--muted); font-size: 17px; }
.sign-off { margin: 37px 0 0; color: var(--muted); font-size: 14px; } .sign-off span { color: var(--coral); } .sign-off strong { color: var(--ink); }
.site-footer { padding: 31px 0; background: #06152c; color: rgba(255,255,255,.52); font-size: 12px; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.footer-inner p { margin: 0; }
.footer-brand { color: #fff; font-size: 14px; }
.footer-brand .brand-mark { width: 28px; height: 28px; border-radius: 8px; font-size: 15px; }
.footer-inner nav { display: flex; gap: 19px; }
.footer-inner nav a { text-decoration: none; }
.footer-inner nav a:hover { color: #fff; }

/* Legal pages */
.legal-page { background: #f4f6fa; }
.legal-site-header { background: rgba(4,28,62,.72); backdrop-filter: blur(12px); }
.legal-hero { padding: 150px 0 68px; background: radial-gradient(circle at 82% -30%, rgba(22,140,243,.65), transparent 37%), var(--night); color: #fff; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 20px; color: var(--mint); font-size: 11px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 5px rgba(84,215,177,.15); }
.legal-hero h1 { margin: 0; font-size: clamp(46px, 6vw, 74px); line-height: 1; letter-spacing: -.06em; }
.legal-hero > div > p:last-child { max-width: 650px; margin: 21px 0 0; color: rgba(255,255,255,.66); font-size: 17px; }
.legal-layout { display: grid; grid-template-columns: 225px minmax(0,1fr); align-items: start; gap: 40px; padding-block: 60px 95px; }
.legal-aside { position: sticky; top: 28px; padding: 21px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.78); }
.legal-aside > p { margin: 0 0 12px; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.legal-aside ol { margin: 0; padding: 0; list-style: none; }
.legal-aside a { display: block; padding: 5px 0; color: var(--muted); font-size: 12px; line-height: 1.4; text-decoration: none; }
.legal-aside a:hover { color: #5546cf; }
.legal-document { padding: clamp(29px, 5.5vw, 68px); border: 1px solid var(--line); border-radius: 24px; background: #fff; box-shadow: 0 18px 50px rgba(22,33,57,.06); }
.legal-intro { margin: 0 0 45px; padding: 22px 24px; border-left: 4px solid var(--purple); border-radius: 0 13px 13px 0; background: #f4f2ff; color: #35435c; font-size: 17px; }
.legal-document section { scroll-margin-top: 30px; }
.legal-document section + section { margin-top: 45px; padding-top: 43px; border-top: 1px solid var(--line); }
.legal-document h2 { margin: 0 0 18px; font-size: clamp(24px, 3vw, 31px); line-height: 1.25; letter-spacing: -.035em; }
.legal-document h2 span { display: block; margin-bottom: 7px; color: #5c4ed1; font: 800 10px ui-monospace, monospace; letter-spacing: .14em; }
.legal-document p { margin: 0 0 17px; color: #4e5c72; }
.legal-document ul { margin: 17px 0 0; padding: 0; list-style: none; }
.legal-document li { position: relative; padding: 12px 0 12px 28px; border-bottom: 1px solid #edf0f5; color: #4e5c72; }
.legal-document li:first-child { border-top: 1px solid #edf0f5; }
.legal-document li::before { position: absolute; top: 20px; left: 4px; width: 7px; height: 7px; border-radius: 2px; background: var(--purple); content: ""; transform: rotate(45deg); }
.legal-document strong { color: var(--ink); }
.legal-document a { color: #5546cf; font-weight: 700; }
.legal-notice { padding: 23px 25px; border: 1px solid #e5dfff; border-radius: 15px; background: #f5f2ff; }
.legal-notice p { margin: 0; color: #35435c; font-size: 13px; font-weight: 760; letter-spacing: .02em; }
.legal-notice p + p { margin-top: 13px; }
.legal-contact { margin-top: 22px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 23px; border-radius: 15px; background: var(--night); color: #fff; }
.legal-contact a { color: var(--mint); text-decoration: none; }

@media (max-width: 900px) {
  .about-grid, .section-heading, .philosophy-headline { grid-template-columns: 1fr; gap: 28px; }
  .about-copy { padding-top: 0; }
  .section-heading > p, .philosophy-headline p { max-width: 620px; }
  .contact-card { grid-template-columns: 1fr; }
  .contact-graphic { min-height: 320px; }
  .legal-layout { grid-template-columns: 1fr; }
  .legal-aside { position: static; }
  .legal-aside ol { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px 17px; }
}

@media (max-width: 700px) {
  .header-inner, .section-inner, .footer-inner, .legal-hero-inner, .legal-layout { width: min(100% - 28px,1180px); }
  .header-inner { min-height: 66px; }
  .brand { font-size: 14px; } .brand-mark { width: 30px; height: 30px; border-radius: 8px; font-size: 17px; }
  .home-header .site-nav a:not(.nav-cta) { display: none; }
  .site-nav .nav-cta { margin: 0; padding: 7px 12px; }
  .legal-site-header .site-nav a { display: none; } .legal-site-header .site-nav .active { display: block; }
  .image-hero, .image-hero > img { min-height: 0; height: auto; }
  .image-hero > img { object-position: center; }
  .image-hero-shade { display: none; }
  .hero-message {
    position: static; width: 100%; margin: 0; padding: 32px 14px 40px;
    background: var(--night); text-shadow: none;
  }
  .hero-message h1 { font-size: 39px; }
  .intro-strip-inner { min-height: 90px; }
  .section { padding: 78px 0; }
  .about-grid { gap: 40px; }
  .creation-grid { grid-template-columns: 1fr; }
  .creation-card { min-height: 300px; padding: 29px; }
  .philosophy-section { padding: 85px 0; }
  .philosophy-headline { margin-bottom: 50px; }
  .philosophy-headline h2 { font-size: clamp(51px,16vw,70px); }
  .principles li { grid-template-columns: 44px 1fr; }
  .contact-card { border-radius: 22px; }
  .contact-copy { padding: 43px 24px; }
  .contact-graphic { min-height: 280px; }
  .email-link { overflow-wrap: anywhere; }
  .next-adventure { padding: 78px 0; }
  .footer-inner { flex-direction: column; text-align: center; }
  .legal-hero { padding: 124px 0 55px; }
  .legal-layout { gap: 22px; padding-block: 28px 58px; }
  .legal-aside ol { grid-template-columns: repeat(2,1fr); }
  .legal-document { border-radius: 18px; }
  .legal-document section + section { margin-top: 36px; padding-top: 34px; }
  .legal-contact { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}