:root {
  color-scheme: light;
  --ink: #171410;
  --ink-soft: #4f493f;
  --muted: #7a7164;
  --paper: #f3ecdf;
  --paper-2: #e8dfcf;
  --card: rgba(255, 252, 244, 0.78);
  --white: #fffaf1;
  --green: #173f35;
  --green-2: #2e6f60;
  --gold: #c7973f;
  --coral: #d9795c;
  --sage: #dce5d9;
  --blue: #dbe5e8;
  --section-warm: #f7f0e4;
  --section-cool: #edf2ed;
  --line: rgba(35, 29, 21, 0.12);
  --line-strong: rgba(35, 29, 21, 0.2);
  --shadow: 0 24px 70px rgba(35, 29, 21, 0.16);
  --max: 1160px;
  --radius: 8px;
}

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  scroll-behavior: smooth;
}

body {
  position: relative;
  margin: 0;
  background:
    linear-gradient(180deg, rgba(243, 236, 223, 0.94), rgba(247, 241, 231, 0.86) 46%, rgba(236, 226, 212, 0.94)),
    radial-gradient(circle at 18% 0%, rgba(199, 151, 63, 0.12), transparent 31%),
    radial-gradient(circle at 86% 34%, rgba(46, 111, 96, 0.1), transparent 28%),
    image-set(
      url("assets/hero-germany-campus-1200.webp") type("image/webp"),
      url("assets/hero-germany-campus-1200.jpg") type("image/jpeg")
    ) right 580px / min(880px, 62vw) auto no-repeat,
    linear-gradient(180deg, var(--paper), #f7f1e7 48%, #ece2d4);
  color: var(--ink);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
}

@supports (overflow: clip) {
  html,
  body {
    overflow-x: clip;
  }
}

body.is-modal-open {
  overflow: hidden;
}

img,
svg {
  display: block;
  max-width: 100%;
}

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

button,
input,
select,
textarea {
  font: inherit;
  touch-action: manipulation;
}

button:disabled {
  cursor: wait;
  opacity: 0.66;
}

.intro-loader {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  background:
    radial-gradient(circle at 50% 42%, rgba(199, 151, 63, 0.15), transparent 22%),
    linear-gradient(180deg, #fbf5ea, var(--paper));
  color: var(--green);
  transition:
    opacity 760ms ease,
    visibility 760ms ease;
}

.loader-mark {
  position: relative;
  display: grid;
  width: 142px;
  height: 142px;
  place-items: center;
  animation: loaderLift 920ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.loader-mark::before {
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: 50%;
  content: "";
  animation: loaderPulse 1500ms ease-in-out 320ms both;
}

.loader-mark img {
  width: 112px;
  height: 112px;
  border: 1px solid rgba(23, 63, 53, 0.18);
  border-radius: 50%;
  background-color: var(--white);
  object-fit: cover;
  box-shadow: 0 24px 54px rgba(23, 63, 53, 0.17);
}

.loader-mark span {
  position: absolute;
  inset: 0;
  border: 1px solid transparent;
  border-top-color: rgba(199, 151, 63, 0.72);
  border-right-color: rgba(46, 111, 96, 0.42);
  border-radius: 50%;
  animation: loaderOrbit 1700ms cubic-bezier(0.62, 0, 0.25, 1) both;
}

.intro-loader strong {
  font-size: 22px;
  font-weight: 760;
  line-height: 1.22;
  animation: loaderTextIn 760ms ease 420ms both;
}

.intro-loader small {
  color: rgba(23, 63, 53, 0.74);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  animation: loaderTextIn 760ms ease 620ms both;
}

.loader-track {
  width: 176px;
  height: 3px;
  margin-top: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.1);
  animation: loaderTextIn 620ms ease 760ms both;
}

.loader-track span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--gold));
  transform-origin: left;
  animation: loaderTrack 1120ms cubic-bezier(0.2, 0.8, 0.2, 1) 820ms both;
}

.intro-loader.is-hidden {
  visibility: hidden;
  opacity: 0;
}

.skip-link {
  position: fixed;
  left: 16px;
  top: 16px;
  z-index: 101;
  transform: translateY(-140%);
  background: var(--green);
  color: white;
  padding: 10px 14px;
  border-radius: var(--radius);
}

.skip-link:focus {
  transform: translateY(0);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.site-header {
  position: fixed;
  z-index: 60;
  top: 18px;
  left: 50%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  width: min(calc(100% - 32px), 1180px);
  min-height: 66px;
  padding: 8px 10px 8px 14px;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.44);
  backdrop-filter: blur(18px);
  transition:
    background 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease;
}

.site-header.is-scrolled,
.site-header.is-open {
  border-color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 250, 241, 0.84);
  box-shadow: 0 16px 48px rgba(35, 29, 21, 0.12);
}

.brand {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.brand-avatar {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(23, 63, 53, 0.2);
  border-radius: 50%;
  background-color: var(--white);
  object-fit: cover;
  box-shadow: 0 8px 20px rgba(35, 29, 21, 0.12);
}

.brand strong {
  display: block;
  font-size: 15px;
  line-height: 1.12;
}

.brand small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.site-nav {
  display: flex;
  justify-content: center;
  gap: 10px;
  color: rgba(23, 20, 16, 0.72);
  font-size: 14px;
}

.site-nav a {
  position: relative;
  min-height: 38px;
  padding: 10px 14px;
  border: 1px solid transparent;
  border-radius: 999px;
  transition:
    color 160ms ease,
    background 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease;
}

.site-nav a:hover {
  color: var(--green);
  background: rgba(255, 252, 244, 0.68);
  border-color: rgba(23, 63, 53, 0.1);
}

.site-nav a.is-current {
  border-color: rgba(199, 151, 63, 0.34);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.94), rgba(242, 232, 216, 0.72));
  color: var(--green);
  font-weight: 760;
  box-shadow: inset 0 -3px 0 rgba(199, 151, 63, 0.72), 0 10px 24px rgba(35, 29, 21, 0.08);
}

.button,
.header-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 760;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease,
    border-color 180ms ease;
}

.header-cta,
.button-primary {
  background: var(--green);
  color: white;
  box-shadow: 0 16px 34px rgba(23, 63, 53, 0.22);
}

.header-cta {
  min-height: 48px;
  padding: 0 22px;
  font-size: 14px;
}

.button {
  min-width: 150px;
  padding: 0 22px;
}

.button-secondary {
  border-color: rgba(23, 63, 53, 0.18);
  background: rgba(255, 250, 241, 0.76);
  color: var(--green);
}

.button:hover,
.header-cta:hover {
  transform: translateY(-2px);
}

.button:active,
.header-cta:active {
  transform: translateY(0) scale(0.98);
  box-shadow: 0 10px 22px rgba(23, 63, 53, 0.16);
}

.button:focus-visible,
.header-cta:focus-visible,
.menu-toggle:focus-visible,
.floating-lead-toggle:focus-visible,
.social-dock-item:focus-visible,
.route-step:focus-visible,
.planner-controls button:focus-visible,
.readiness-options button:focus-visible {
  outline: 3px solid rgba(199, 151, 63, 0.28);
  outline-offset: 3px;
}

.button:hover,
.button:focus-visible,
.header-cta:hover,
.header-cta:focus-visible {
  box-shadow: 0 18px 38px rgba(23, 63, 53, 0.2);
}

.button-secondary:hover,
.button-secondary:focus-visible {
  border-color: rgba(199, 151, 63, 0.42);
  background: rgba(255, 252, 244, 0.9);
  box-shadow: 0 14px 34px rgba(35, 29, 21, 0.08);
}

.menu-toggle {
  position: relative;
  display: none;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 250, 241, 0.75);
  color: var(--ink);
  cursor: pointer;
  transition:
    background 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.menu-toggle:hover,
.menu-toggle:focus-visible {
  background: rgba(255, 252, 244, 0.94);
  box-shadow: 0 10px 24px rgba(35, 29, 21, 0.1);
  transform: translateY(-1px);
}

.menu-toggle span:not(.sr-only) {
  position: absolute;
  width: 18px;
  height: 2px;
  background: currentColor;
  transition:
    transform 180ms ease,
    opacity 180ms ease;
}

.menu-toggle span:first-child {
  transform: translateY(-4px);
}

.menu-toggle span:nth-child(2) {
  transform: translateY(4px);
}

.site-header.is-open .menu-toggle span:first-child {
  transform: rotate(45deg);
}

.site-header.is-open .menu-toggle span:nth-child(2) {
  transform: rotate(-45deg);
}

.hero {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  padding: 132px 24px 70px;
  isolation: isolate;
}

.hero-image,
.hero-overlay,
.hero-grid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-image {
  z-index: -4;
  filter: saturate(1.04) contrast(1.04);
  object-fit: cover;
  object-position: 43% center;
  transform: scaleX(-1) scale(1.12);
}

.hero-overlay {
  z-index: -3;
  background:
    linear-gradient(90deg, rgba(243, 236, 223, 0.9) 0%, rgba(243, 236, 223, 0.54) 34%, rgba(243, 236, 223, 0.12) 70%, rgba(243, 236, 223, 0.34) 100%),
    linear-gradient(180deg, rgba(243, 236, 223, 0.05) 0%, rgba(243, 236, 223, 0.12) 60%, var(--paper) 98%),
    radial-gradient(circle at 72% 18%, rgba(199, 151, 63, 0.12), transparent 30%);
}

.hero-grid {
  z-index: -2;
  opacity: 0.18;
  background-image:
    linear-gradient(rgba(23, 63, 53, 0.24) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 63, 53, 0.24) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(180deg, black, transparent 70%);
}

.hero-inner {
  display: grid;
  align-items: center;
  width: min(760px, calc(100% - 80px));
  min-height: min(720px, calc(100vh - 196px));
  margin-right: auto;
  margin-left: clamp(40px, 7vw, 132px);
}

.hero-content {
  min-width: 0;
  max-width: 680px;
  padding-bottom: 26px;
}

.hero-label {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 24px;
  color: var(--green);
  font-size: 14px;
  font-weight: 760;
}

.hero-label span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 7px rgba(199, 151, 63, 0.14);
}

h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}

h1,
h2,
h3,
h4 {
  overflow-wrap: break-word;
  text-wrap: balance;
}

p,
li,
dd {
  text-wrap: pretty;
}

h1 {
  max-width: 640px;
  margin-bottom: 24px;
  font-size: clamp(38px, 4.7vw, 62px);
  font-weight: 480;
  letter-spacing: 0;
  line-height: 1.08;
}

.hero-copy {
  max-width: 560px;
  margin-bottom: 30px;
  color: rgba(23, 20, 16, 0.74);
  font-size: clamp(17px, 1.8vw, 21px);
  line-height: 1.76;
  overflow-wrap: anywhere;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 28px;
}

.hero-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.hero-proof span {
  display: grid;
  gap: 2px;
  min-height: 38px;
  padding: 8px 14px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.66);
  color: var(--green);
  font-size: 14px;
  font-weight: 700;
  backdrop-filter: blur(12px);
}

.hero-proof strong,
.hero-proof small {
  display: block;
  line-height: 1.28;
}

.hero-proof small {
  color: rgba(23, 63, 53, 0.68);
  font-size: 12px;
  font-weight: 620;
}

.mini-form,
.lead-form {
  display: grid;
  gap: 14px;
}

.hp-field {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  border: 0;
  white-space: nowrap;
}

.mini-form label,
.lead-form label {
  display: grid;
  gap: 7px;
}

.mini-form span,
.lead-form span {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 720;
}

.mini-form input,
.mini-form select,
.lead-form input,
.lead-form select,
.lead-form textarea {
  width: 100%;
  border: 1px solid rgba(35, 29, 21, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.86);
  color: var(--ink);
  outline: none;
}

.mini-form input,
.mini-form select,
.lead-form input,
.lead-form select {
  height: 50px;
  padding: 0 14px;
}

.lead-form textarea {
  resize: vertical;
  padding: 14px;
}

.mini-form input:focus,
.mini-form select:focus,
.lead-form input:focus,
.lead-form select:focus,
.lead-form textarea:focus {
  border-color: rgba(23, 63, 53, 0.7);
  box-shadow: 0 0 0 3px rgba(23, 63, 53, 0.12);
}

.mini-form .consent-field,
.lead-form .consent-field {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 9px;
}

.mini-form .consent-field input[type="checkbox"],
.lead-form .consent-field input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 2px 0 0;
  padding: 0;
  accent-color: var(--green);
}

.mini-form .consent-field span,
.lead-form .consent-field span {
  min-width: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 620;
  line-height: 1.45;
}

.consent-field a {
  color: var(--green);
  font-weight: 760;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.mini-form p,
.form-note {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.turnstile-slot {
  width: 100%;
  min-height: 0;
  overflow: hidden;
}

.turnstile-slot iframe {
  max-width: 100%;
}

.lead-form .turnstile-slot {
  grid-column: 1 / -1;
}

.floating-lead {
  position: fixed;
  z-index: 70;
  right: 18px;
  top: auto;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  transform: none;
  width: auto;
  pointer-events: auto;
}

.floating-lead-toggle,
.floating-lead-panel {
  pointer-events: auto;
}

.floating-lead-toggle {
  display: flex;
  gap: 9px;
  align-items: center;
  width: 172px;
  min-height: 58px;
  padding: 8px 13px 8px 8px;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(23, 63, 53, 0.98), rgba(46, 111, 96, 0.94));
  color: white;
  box-shadow: 0 18px 42px rgba(23, 63, 53, 0.24), 0 0 0 6px rgba(199, 151, 63, 0.12);
  cursor: pointer;
  font-weight: 800;
  backdrop-filter: blur(18px);
  animation: leadPulse 5.4s ease-in-out infinite;
  transition:
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.floating-lead-toggle:hover,
.floating-lead-toggle:focus-visible {
  border-color: rgba(199, 151, 63, 0.42);
  background:
    linear-gradient(135deg, rgba(18, 55, 47, 1), rgba(46, 111, 96, 0.98));
  box-shadow: 0 22px 48px rgba(23, 63, 53, 0.28), 0 0 0 8px rgba(199, 151, 63, 0.16);
  transform: translateY(-2px);
}

.floating-lead-toggle img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
}

.floating-lead-toggle span {
  display: grid;
  gap: 2px;
  line-height: 1.08;
  text-align: left;
}

.floating-lead-toggle span::after {
  color: rgba(255, 255, 255, 0.74);
  font-size: 11px;
  font-weight: 720;
  content: "1分钟判断路径";
}

.floating-lead-panel {
  position: absolute;
  right: 0;
  bottom: 66px;
  display: grid;
  gap: 10px;
  width: 286px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.86);
  box-shadow: 0 18px 46px rgba(35, 29, 21, 0.13);
  backdrop-filter: blur(20px);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.98);
  transform-origin: right bottom;
  transition:
    opacity 180ms ease,
    transform 180ms ease,
    visibility 180ms ease;
  visibility: hidden;
}

.floating-lead:hover .floating-lead-panel,
.floating-lead:focus-within .floating-lead-panel,
.floating-lead.is-hovered .floating-lead-panel,
.floating-lead.is-open .floating-lead-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  visibility: visible;
}

.floating-lead.is-dismissed .floating-lead-panel {
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.98);
  visibility: hidden;
}

.floating-lead-panel label {
  display: grid;
  gap: 7px;
}

.floating-lead-panel label span {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 720;
}

.floating-lead-panel input,
.floating-lead-panel select {
  width: 100%;
  height: 44px;
  padding: 0 10px;
  border: 1px solid rgba(35, 29, 21, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.9);
  color: var(--ink);
  outline: none;
}

.floating-lead-panel input:focus,
.floating-lead-panel select:focus {
  border-color: rgba(23, 63, 53, 0.7);
  box-shadow: 0 0 0 3px rgba(23, 63, 53, 0.12);
}

.floating-lead-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.floating-lead-head strong {
  color: var(--green);
  font-size: 15px;
}

.floating-lead-head button {
  display: none;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255, 252, 244, 0.74);
  color: var(--ink);
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}

.floating-lead-copy,
.floating-lead-panel p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.48;
}

.floating-lead-panel .button {
  min-height: 44px;
  min-width: 0;
  width: 100%;
  padding: 0 14px;
  font-size: 14px;
}

.social-dock {
  position: fixed;
  z-index: 68;
  top: 50%;
  right: 18px;
  display: grid;
  gap: 8px;
  transform: translateY(-50%);
}

.social-dock-hub {
  display: none;
}

.social-dock-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 54px;
  min-height: 54px;
  overflow: hidden;
  padding: 7px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.78);
  color: var(--green);
  box-shadow: 0 10px 28px rgba(35, 29, 21, 0.1);
  cursor: pointer;
  text-align: left;
  backdrop-filter: blur(18px);
  transition:
    width 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.social-dock-item:hover,
.social-dock-item:focus-visible {
  width: 144px;
  border-color: rgba(199, 151, 63, 0.42);
  background: rgba(255, 252, 244, 0.94);
  box-shadow: 0 16px 34px rgba(35, 29, 21, 0.12);
  transform: translateX(-3px);
}

.social-dock-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: var(--green);
  color: var(--white);
  font-size: 15px;
  font-weight: 840;
}

.social-dock-text {
  display: grid;
  min-width: 78px;
  line-height: 1.16;
  opacity: 0;
  transition: opacity 160ms ease;
}

.social-dock-item:hover .social-dock-text,
.social-dock-item:focus-visible .social-dock-text {
  opacity: 1;
}

.social-dock-text strong {
  font-size: 13px;
  font-weight: 820;
}

.social-dock-text small {
  color: var(--muted);
  font-size: 11px;
}

.social-modal[hidden] {
  display: none;
}

.social-modal {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: grid;
  place-items: center;
  padding: 22px;
}

.social-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(23, 20, 16, 0.38);
  backdrop-filter: blur(10px);
}

.social-modal-card {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
  gap: 22px;
  width: min(700px, 100%);
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 92% 12%, rgba(199, 151, 63, 0.18), transparent 32%),
    rgba(255, 250, 241, 0.94);
  box-shadow: 0 28px 80px rgba(23, 20, 16, 0.24);
}

.social-modal-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255, 252, 244, 0.84);
  color: var(--ink);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}

.social-modal-media {
  display: grid;
  min-height: 260px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.72);
}

.social-modal-media img {
  width: 100%;
  max-height: 300px;
  object-fit: contain;
}

.social-modal-placeholder {
  display: grid;
  width: 100%;
  min-height: 260px;
  place-items: center;
  padding: 26px;
  text-align: center;
}

.social-modal-placeholder strong {
  display: block;
  color: var(--green);
  font-size: 22px;
  line-height: 1.25;
}

.social-modal-placeholder span {
  color: var(--muted);
}

.social-modal-copy {
  display: grid;
  align-content: center;
  gap: 12px;
  padding: 18px 18px 18px 0;
}

.social-modal-copy span {
  color: var(--green-2);
  font-size: 12px;
  font-weight: 840;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.social-modal-copy h2 {
  margin-bottom: 0;
  color: var(--green);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 540;
  line-height: 1.12;
}

.social-modal-copy p {
  margin-bottom: 8px;
  color: var(--ink-soft);
}

.social-modal-copy .button {
  width: fit-content;
}

.eyebrow {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: var(--green-2);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.eyebrow::before {
  display: inline-block;
  width: 18px;
  height: 7px;
  border: 1px solid rgba(35, 29, 21, 0.08);
  border-radius: 999px;
  background: linear-gradient(180deg, #1f1b18 0 33%, #b94032 33% 66%, #d9a441 66% 100%);
  content: "";
  opacity: 0.76;
}

.signal-band {
  position: relative;
  overflow: hidden;
  padding: 52px 0;
  border-top: 1px solid rgba(35, 29, 21, 0.1);
  border-bottom: 1px solid rgba(35, 29, 21, 0.1);
  background:
    linear-gradient(90deg, rgba(220, 229, 217, 0.54), rgba(255, 250, 241, 0.82), rgba(219, 229, 232, 0.56));
  isolation: isolate;
}

.signal-band::before,
.signal-band::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  pointer-events: none;
}

.signal-band::before {
  background:
    linear-gradient(90deg, rgba(247, 240, 228, 0.88), rgba(247, 240, 228, 0.54) 48%, rgba(247, 240, 228, 0.9)),
    image-set(
      url("assets/hero-germany-campus-1200.webp") type("image/webp"),
      url("assets/hero-germany-campus-1200.jpg") type("image/jpeg")
    ) right center / min(820px, 58vw) auto no-repeat;
  opacity: 0.36;
}

.signal-band::after {
  background-image:
    linear-gradient(90deg, rgba(23, 63, 53, 0.04) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.04) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(90deg, transparent, black 18%, black 82%, transparent);
  opacity: 0.68;
}

.info-board-inner {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(20px, 4vw, 46px);
  width: min(var(--max), calc(100% - 40px));
  margin: 0 auto;
  align-items: center;
}

.info-board-copy {
  display: grid;
  align-content: center;
  gap: 16px;
  min-width: 0;
}

.info-board-copy h2 {
  margin: 0;
  color: var(--green);
  font-size: clamp(30px, 3.4vw, 46px);
  font-weight: 520;
  line-height: 1.12;
}

.info-board-copy p {
  max-width: 720px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.72;
}

.info-board-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
}

.info-board-grid a {
  display: grid;
  gap: 8px;
  min-height: 148px;
  padding: 16px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.76);
  color: inherit;
  box-shadow: 0 12px 30px rgba(35, 29, 21, 0.06);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.info-board-grid a:hover,
.info-board-grid a:focus-visible {
  border-color: rgba(199, 151, 63, 0.36);
  background: rgba(255, 252, 244, 0.94);
  box-shadow: 0 18px 42px rgba(35, 29, 21, 0.1);
  transform: translateY(-3px);
}

.info-board-grid span {
  color: var(--gold);
  font-size: 12px;
  font-weight: 840;
}

.info-board-grid strong {
  color: var(--green);
  font-size: 18px;
  line-height: 1.28;
}

.info-board-grid small {
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.44;
}

.updates-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 16px;
  align-items: stretch;
}

.updates-feature,
.update-item {
  min-width: 0;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(237, 242, 237, 0.68)),
    radial-gradient(circle at 90% 10%, rgba(199, 151, 63, 0.14), transparent 34%);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.07);
}

.updates-feature {
  position: relative;
  display: grid;
  align-content: end;
  overflow: hidden;
  min-height: 360px;
  padding: 28px;
}

.updates-feature::before {
  position: absolute;
  top: 28px;
  right: 28px;
  left: 28px;
  height: 118px;
  border: 1px solid rgba(23, 63, 53, 0.1);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, #1f1b18 0 33%, #b94032 33% 66%, #d9a441 66% 100%),
    linear-gradient(90deg, rgba(23, 63, 53, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.08) 1px, transparent 1px),
    rgba(255, 252, 244, 0.58);
  background-position:
    22px 24px,
    0 0,
    0 0,
    0 0;
  background-size:
    34px 22px,
    34px 34px,
    34px 34px,
    auto;
  background-repeat: no-repeat, repeat, repeat, repeat;
  box-shadow: inset 0 -48px 60px rgba(255, 252, 244, 0.7);
  content: "";
}

.updates-feature::after {
  position: absolute;
  top: 58px;
  right: 54px;
  width: 78px;
  height: 54px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: 12px;
  background: rgba(255, 250, 241, 0.78);
  box-shadow:
    -96px 26px 0 -8px rgba(237, 242, 237, 0.9),
    -48px -16px 0 -12px rgba(199, 151, 63, 0.22);
  content: "";
}

.updates-feature > * {
  position: relative;
  z-index: 1;
}

.updates-feature span,
.update-item span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.updates-feature h3 {
  max-width: 560px;
  margin: 18px 0 12px;
  color: var(--green);
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.12;
}

.updates-feature p {
  max-width: 620px;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.68;
}

.updates-list {
  display: grid;
  gap: 12px;
}

.update-item {
  display: grid;
  gap: 7px;
  padding: 22px;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

button.update-item {
  font: inherit;
}

.update-item:hover,
.update-item:focus-visible {
  border-color: rgba(199, 151, 63, 0.38);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
  transform: translateY(-3px);
}

.update-item strong {
  color: var(--green);
  font-size: 20px;
  line-height: 1.24;
}

.update-item small {
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.48;
}

.admission-showcase {
  display: grid;
  grid-template-columns: minmax(280px, 0.55fr) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 10% 20%, rgba(199, 151, 63, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(255, 252, 244, 0.88), rgba(237, 242, 237, 0.72));
  box-shadow: 0 20px 58px rgba(35, 29, 21, 0.08);
}

.admission-copy {
  display: grid;
  align-content: center;
  gap: 12px;
  padding: 14px;
}

.admission-copy span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.admission-copy h3 {
  margin: 0;
  color: var(--green);
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.12;
}

.admission-copy p {
  margin: 0 0 8px;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.68;
}

.admission-marquee {
  align-self: center;
  contain: paint;
  overflow: hidden;
  height: 318px;
  max-width: 100%;
  min-width: 0;
  border-radius: var(--radius);
  mask-image: linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}

.admission-track {
  display: flex;
  align-items: center;
  gap: 14px;
  width: max-content;
  animation: admissionScroll 76s linear infinite;
  will-change: transform;
}

.admission-track:hover {
  animation-play-state: paused;
}

.admission-track article {
  flex: 0 0 218px;
  width: 218px;
  height: 318px;
  overflow: hidden;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.86);
  box-shadow: 0 14px 34px rgba(35, 29, 21, 0.08);
}

.admission-track img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  background: rgba(255, 252, 244, 0.94);
}

.section {
  position: relative;
  isolation: isolate;
  width: min(var(--max), calc(100% - 40px));
  margin: 0 auto;
  padding: 94px 0;
  scroll-margin-top: 112px;
}

[data-section-scene] {
  transition:
    filter 360ms ease,
    transform 360ms ease;
}

[data-section-scene]::after {
  position: absolute;
  z-index: 0;
  top: 28px;
  right: max(20px, calc((100vw - var(--max)) / 2));
  width: 76px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, #1f1b18 0 33%, #b94032 33% 66%, #d9a441 66% 100%);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px) scaleX(0.72);
  transform-origin: right;
  transition:
    opacity 360ms ease,
    transform 360ms ease;
}

[data-section-scene].is-scene-active::after {
  opacity: 0.78;
  transform: translateY(0) scaleX(1);
}

[data-section-scene].is-scene-active .section-heading,
[data-section-scene].is-scene-active .contact-copy,
[data-section-scene].is-scene-active .studio-copy {
  transform: translateY(-2px);
  transition: transform 360ms ease;
}

[data-section-scene="services"].is-scene-active .planner-panel {
  border-color: rgba(199, 151, 63, 0.24);
  box-shadow: 0 20px 58px rgba(35, 29, 21, 0.1);
}

[data-section-scene="readiness"].is-scene-active .readiness-panel {
  border-color: rgba(199, 151, 63, 0.28);
  box-shadow: 0 22px 60px rgba(23, 63, 53, 0.1);
}

[data-section-scene="route"].is-scene-active .route-card {
  border-color: rgba(199, 151, 63, 0.24);
  box-shadow: 0 22px 60px rgba(23, 63, 53, 0.11);
}

[data-section-scene="updates"].is-scene-active .updates-feature,
[data-section-scene="updates"].is-scene-active .update-item,
[data-section-scene="admissions"].is-scene-active .admission-showcase {
  border-color: rgba(199, 151, 63, 0.26);
}

[data-section-scene="cases"].is-scene-active .case-card {
  border-color: rgba(199, 151, 63, 0.2);
}

[data-section-scene="knowledge"].is-scene-active .knowledge-card {
  border-color: rgba(23, 63, 53, 0.24);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
}

[data-section-scene="method"].is-scene-active .studio-metrics div {
  border-color: rgba(199, 151, 63, 0.24);
}

[data-section-scene="contact"].is-scene-active .lead-form {
  border-color: rgba(199, 151, 63, 0.26);
  box-shadow: 0 24px 64px rgba(23, 63, 53, 0.12);
}

[data-section-scene="trust"].is-scene-active .trust-card {
  border-color: rgba(199, 151, 63, 0.24);
}

[data-section-scene="faq"].is-scene-active .faq-aside,
[data-section-scene="faq"].is-scene-active .faq-list details {
  border-color: rgba(23, 63, 53, 0.24);
  box-shadow: 0 18px 46px rgba(35, 29, 21, 0.08);
}

.services-section::before,
.updates-section::before,
.route-section::before,
.cases-section::before,
.admission-section::before,
.knowledge-section::before,
.studio-section::before,
.trust-section::before,
.faq-section::before,
.readiness-section::before,
.contact-section::before {
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  border-top: 1px solid rgba(35, 29, 21, 0.09);
  border-bottom: 1px solid rgba(35, 29, 21, 0.07);
  content: "";
  transform: translateX(-50%);
}

.services-section::before {
  background:
    linear-gradient(90deg, rgba(23, 63, 53, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(247, 240, 228, 0.78), rgba(237, 242, 237, 0.46));
  background-size: 64px 64px, 64px 64px, auto;
}

.updates-section::before {
  background:
    linear-gradient(90deg, rgba(255, 250, 241, 0.74), rgba(255, 250, 241, 0.5)),
    linear-gradient(90deg, rgba(23, 63, 53, 0.032) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.032) 1px, transparent 1px),
    radial-gradient(circle at 14% 20%, rgba(199, 151, 63, 0.12), transparent 28%),
    linear-gradient(180deg, rgba(238, 243, 237, 0.82), rgba(247, 240, 228, 0.52));
  background-size: auto, 62px 62px, 62px 62px, auto, auto;
}

.readiness-section::before {
  background:
    linear-gradient(90deg, rgba(255, 250, 241, 0.72), rgba(237, 242, 237, 0.62)),
    linear-gradient(90deg, rgba(23, 63, 53, 0.034) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.034) 1px, transparent 1px),
    radial-gradient(circle at 88% 12%, rgba(217, 121, 92, 0.08), transparent 28%),
    radial-gradient(circle at 18% 72%, rgba(46, 111, 96, 0.08), transparent 30%);
  background-size: auto, 70px 70px, 70px 70px, auto, auto;
}

.route-section::before {
  background:
    linear-gradient(90deg, rgba(23, 63, 53, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.035) 1px, transparent 1px),
    radial-gradient(circle at 16% 22%, rgba(46, 111, 96, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(255, 250, 241, 0.4), rgba(232, 223, 207, 0.5));
  background-size: 72px 72px, 72px 72px, auto, auto;
}

.cases-section::before {
  background:
    linear-gradient(90deg, rgba(247, 240, 228, 0.86), rgba(247, 240, 228, 0.54)),
    linear-gradient(90deg, rgba(199, 151, 63, 0.045) 1px, transparent 1px),
    linear-gradient(rgba(199, 151, 63, 0.04) 1px, transparent 1px),
    radial-gradient(circle at 84% 12%, rgba(199, 151, 63, 0.1), transparent 30%),
    linear-gradient(180deg, rgba(239, 244, 241, 0.72), rgba(247, 240, 228, 0.38));
  background-size: auto, 68px 68px, 68px 68px, auto, auto;
}

.admission-section::before {
  background:
    linear-gradient(90deg, rgba(255, 250, 241, 0.7), rgba(237, 242, 237, 0.82)),
    radial-gradient(circle at 84% 18%, rgba(46, 111, 96, 0.09), transparent 28%),
    linear-gradient(180deg, rgba(247, 240, 228, 0.42), rgba(239, 244, 241, 0.76));
}

.knowledge-section::before {
  background:
    radial-gradient(circle at 88% 18%, rgba(199, 151, 63, 0.11), transparent 32%),
    linear-gradient(180deg, rgba(248, 244, 235, 0.76), rgba(238, 243, 237, 0.7));
}

.studio-section::before {
  background: linear-gradient(180deg, rgba(246, 240, 229, 0.34), rgba(219, 229, 232, 0.34));
}

.trust-section::before {
  background:
    radial-gradient(circle at 82% 18%, rgba(46, 111, 96, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(255, 250, 241, 0.58), rgba(247, 240, 228, 0.44));
}

.faq-section::before {
  background:
    radial-gradient(circle at 16% 18%, rgba(217, 121, 92, 0.09), transparent 27%),
    linear-gradient(180deg, rgba(237, 242, 237, 0.5), rgba(248, 244, 235, 0.7));
}

.contact-section::before {
  background:
    radial-gradient(circle at 10% 20%, rgba(199, 151, 63, 0.1), transparent 26%),
    linear-gradient(180deg, rgba(243, 236, 223, 0.36), rgba(237, 242, 237, 0.6));
}

.section-heading {
  display: grid;
  gap: 14px;
  min-width: 0;
  max-width: 780px;
  margin-bottom: 42px;
  padding: 16px 0 16px 18px;
  border-left: 3px solid rgba(199, 151, 63, 0.72);
  border-top: 1px solid rgba(35, 29, 21, 0.08);
}

.section-heading.compact {
  max-width: 820px;
  margin-top: 30px;
  margin-bottom: 18px;
}

.studio-copy,
.contact-copy {
  padding: 16px 0 16px 18px;
  border-left: 3px solid rgba(199, 151, 63, 0.72);
  border-top: 1px solid rgba(35, 29, 21, 0.08);
}

.section-heading h2,
.studio-copy h2,
.contact-copy h2 {
  margin-bottom: 0;
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 520;
  letter-spacing: 0;
  line-height: 1.16;
}

.section-heading p,
.studio-panel p,
.contact-copy p {
  max-width: 680px;
  color: var(--ink-soft);
  font-size: 18px;
}

.planner-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) 220px minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
  min-height: 330px;
  margin-bottom: 18px;
  padding: 20px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.68);
  box-shadow: 0 18px 54px rgba(35, 29, 21, 0.08);
}

.planner-copy {
  min-width: 0;
  align-self: center;
}

.planner-copy h3 {
  margin: 12px 0 12px;
  font-size: clamp(24px, 2.6vw, 34px);
  font-weight: 520;
  line-height: 1.18;
}

.planner-copy p,
.planner-result p {
  margin-bottom: 0;
  color: var(--ink-soft);
}

.planner-controls {
  display: grid;
  gap: 8px;
}

.planner-controls button {
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.68);
  color: var(--ink-soft);
  cursor: pointer;
  font-weight: 760;
  text-align: left;
  transition:
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.planner-controls button.is-active {
  border-color: rgba(23, 63, 53, 0.3);
  background: rgba(23, 63, 53, 0.94);
  color: white;
  box-shadow: inset 4px 0 0 rgba(199, 151, 63, 0.94), 0 12px 28px rgba(23, 63, 53, 0.14);
}

.planner-controls button:hover:not(.is-active),
.planner-controls button:focus-visible:not(.is-active) {
  border-color: rgba(199, 151, 63, 0.38);
  background: rgba(255, 252, 244, 0.92);
  color: var(--green);
  box-shadow: 0 10px 24px rgba(35, 29, 21, 0.07);
}

.planner-controls button.is-active:hover,
.planner-controls button.is-active:focus-visible {
  background: rgba(23, 63, 53, 0.88);
  box-shadow: inset 4px 0 0 rgba(199, 151, 63, 1), 0 14px 30px rgba(23, 63, 53, 0.18);
}

.planner-result {
  display: grid;
  min-width: 0;
  align-content: center;
  gap: 12px;
  min-height: 286px;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 86% 8%, rgba(199, 151, 63, 0.22), transparent 34%),
    rgba(255, 252, 244, 0.78);
}

.planner-result > span {
  color: var(--green-2);
  font-size: 12px;
  font-weight: 840;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.planner-result h4 {
  margin-bottom: 0;
  color: var(--green);
  font-size: 23px;
  font-weight: 560;
  line-height: 1.22;
}

.planner-result ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
}

.planner-result li {
  padding: 7px 10px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.06);
  color: var(--green);
  font-size: 13px;
  font-weight: 720;
}

.planner-delivery {
  display: grid;
  gap: 6px;
  margin-top: 4px;
  padding: 13px 14px;
  border: 1px solid rgba(199, 151, 63, 0.22);
  border-radius: var(--radius);
  background: rgba(199, 151, 63, 0.08);
}

.planner-delivery strong {
  color: var(--green);
  font-size: 13px;
}

.planner-delivery span {
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.46;
}

.readiness-panel {
  display: grid;
  grid-template-columns: minmax(260px, 0.78fr) minmax(0, 1.22fr);
  gap: 18px;
  align-items: stretch;
  padding: 20px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.72), rgba(247, 240, 228, 0.62)),
    radial-gradient(circle at 84% 0%, rgba(199, 151, 63, 0.12), transparent 36%);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.readiness-controls {
  display: grid;
  gap: 14px;
}

.readiness-control-group {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.72);
}

.readiness-control-group > span {
  color: var(--green);
  font-size: 13px;
  font-weight: 820;
}

.readiness-options {
  display: grid;
  gap: 8px;
}

.readiness-options button {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(35, 29, 21, 0.11);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.8);
  color: var(--ink-soft);
  cursor: pointer;
  font-weight: 760;
  text-align: left;
  transition:
    background 160ms ease,
    border-color 160ms ease,
    color 160ms ease,
    box-shadow 160ms ease;
}

.readiness-options button.is-active {
  border-color: rgba(23, 63, 53, 0.34);
  background: var(--green);
  color: var(--white);
  box-shadow: inset 4px 0 0 rgba(199, 151, 63, 0.94), 0 10px 24px rgba(23, 63, 53, 0.12);
}

.readiness-options button:hover:not(.is-active),
.readiness-options button:focus-visible:not(.is-active) {
  border-color: rgba(199, 151, 63, 0.38);
  background: rgba(255, 252, 244, 0.94);
  color: var(--green);
}

.readiness-result {
  position: relative;
  display: grid;
  min-width: 0;
  align-content: center;
  gap: 14px;
  overflow: hidden;
  padding: 26px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 88% 10%, rgba(199, 151, 63, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(23, 63, 53, 0.96), rgba(46, 111, 96, 0.9));
  color: var(--white);
}

.readiness-meter {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.16);
}

.readiness-meter span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--gold), #f2d08b);
  transition: width 260ms ease;
}

.readiness-result > span {
  color: rgba(255, 250, 241, 0.72);
  font-size: 12px;
  font-weight: 840;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.readiness-result h3 {
  max-width: 620px;
  margin-bottom: 0;
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 520;
  line-height: 1.12;
}

.readiness-result p {
  max-width: 680px;
  margin-bottom: 0;
  color: rgba(255, 250, 241, 0.78);
}

.readiness-result ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.readiness-result li {
  padding: 7px 10px;
  border: 1px solid rgba(255, 250, 241, 0.18);
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.1);
  color: rgba(255, 250, 241, 0.9);
  font-size: 13px;
  font-weight: 720;
}

.readiness-next {
  display: grid;
  gap: 6px;
  padding: 14px 15px;
  border: 1px solid rgba(255, 250, 241, 0.18);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.08);
}

.readiness-next strong {
  color: var(--gold);
  font-size: 13px;
}

.readiness-next span {
  color: rgba(255, 250, 241, 0.84);
}

.readiness-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.readiness-actions .button-primary {
  background: var(--white);
  color: var(--green);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.12);
}

.readiness-actions .button-secondary {
  border-color: rgba(255, 250, 241, 0.22);
  background: rgba(255, 250, 241, 0.08);
  color: var(--white);
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.service-card {
  position: relative;
  min-width: 0;
  min-height: 324px;
  overflow: hidden;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(248, 241, 231, 0.78)),
    radial-gradient(circle at 26% 0%, rgba(199, 151, 63, 0.12), transparent 42%);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.service-card::after {
  position: absolute;
  inset: auto 18px 18px 18px;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), rgba(46, 111, 96, 0.72), transparent);
  content: "";
  transform: scaleX(0.28);
  transform-origin: left;
  transition: transform 220ms ease;
}

.service-card:hover {
  transform: translateY(-2px);
  border-color: rgba(199, 151, 63, 0.38);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.98), rgba(242, 232, 216, 0.84)),
    radial-gradient(circle at 70% 0%, rgba(220, 229, 217, 0.6), transparent 42%);
  box-shadow: 0 12px 28px rgba(35, 29, 21, 0.08);
}

.service-card:hover::after {
  transform: scaleX(1);
}

.card-index {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 760;
}

.service-icon {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  margin: 36px 0 30px;
  border: 1px solid rgba(199, 151, 63, 0.32);
  border-radius: 50%;
  background: rgba(255, 252, 244, 0.78);
  color: var(--green);
  font-size: 14px;
  font-weight: 800;
}

.service-card h3,
.case-card h3,
.route-card h3 {
  letter-spacing: 0;
}

.service-card h3 {
  margin-bottom: 12px;
  font-size: 22px;
  line-height: 1.16;
}

.service-card p,
.case-card p {
  margin-bottom: 0;
  color: var(--ink-soft);
}

.service-output {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.service-output li {
  padding: 6px 9px;
  border: 1px solid rgba(23, 63, 53, 0.1);
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.055);
  color: var(--green);
  font-size: 12px;
  font-weight: 740;
}

.route-section,
.cases-section,
.knowledge-section,
.studio-section,
.contact-section {
  position: relative;
  isolation: isolate;
}

.route-shell {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 18px;
}

.route-steps {
  display: grid;
  gap: 10px;
}

.route-step {
  display: flex;
  gap: 12px;
  align-items: center;
  min-height: 62px;
  padding: 0 16px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.62);
  color: var(--ink-soft);
  cursor: pointer;
  text-align: left;
  transition:
    background 180ms ease,
    color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.route-step span {
  color: var(--gold);
  font-weight: 800;
}

.route-step.is-active {
  border-color: rgba(23, 63, 53, 0.32);
  background: rgba(23, 63, 53, 0.94);
  color: white;
  box-shadow: inset 4px 0 0 rgba(199, 151, 63, 0.94), 0 12px 28px rgba(23, 63, 53, 0.14);
}

.route-step:hover:not(.is-active),
.route-step:focus-visible:not(.is-active) {
  border-color: rgba(199, 151, 63, 0.4);
  background: rgba(255, 252, 244, 0.88);
  color: var(--green);
  box-shadow: 0 12px 28px rgba(35, 29, 21, 0.07);
}

.route-step.is-active:hover,
.route-step.is-active:focus-visible {
  background: rgba(23, 63, 53, 0.88);
  box-shadow: inset 4px 0 0 rgba(199, 151, 63, 1), 0 14px 30px rgba(23, 63, 53, 0.17);
}

.route-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  min-width: 0;
  gap: 30px;
  min-height: 360px;
  padding: 32px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 85% 18%, rgba(199, 151, 63, 0.18), transparent 34%),
    rgba(255, 250, 241, 0.68);
  box-shadow: 0 18px 54px rgba(35, 29, 21, 0.08);
}

.route-card h3 {
  max-width: 640px;
  margin: 12px 0 18px;
  font-size: clamp(28px, 3.1vw, 40px);
  font-weight: 520;
  line-height: 1.14;
}

.route-card p {
  max-width: 620px;
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 18px;
}

.route-card .route-meta {
  margin-top: 18px;
  color: var(--green);
  font-size: 15px;
  font-weight: 740;
}

.route-points {
  display: grid;
  align-content: center;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.route-points li {
  padding: 16px 18px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.72);
  color: var(--green);
  font-weight: 720;
}

.route-progress {
  grid-column: 1 / -1;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.1);
}

.route-progress span {
  display: block;
  width: 25%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--gold));
  transition: width 260ms ease;
}

.case-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.scene-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.scene-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 410px;
  overflow: hidden;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.86), rgba(247, 240, 228, 0.72)),
    radial-gradient(circle at 86% 10%, rgba(199, 151, 63, 0.12), transparent 36%);
  color: inherit;
  box-shadow: 0 16px 44px rgba(35, 29, 21, 0.06);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.scene-card:hover,
.scene-card:focus-visible {
  transform: translateY(-4px);
  border-color: rgba(199, 151, 63, 0.36);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.94), rgba(238, 244, 238, 0.78)),
    radial-gradient(circle at 84% 8%, rgba(199, 151, 63, 0.16), transparent 34%);
  box-shadow: 0 20px 48px rgba(35, 29, 21, 0.1);
}

.scene-card > span {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 20px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.08);
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
}

.scene-card > span::before {
  width: 20px;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(180deg, #1e1a16 0 33%, #b62f24 33% 66%, #d4a23f 66% 100%);
  box-shadow: 0 0 0 1px rgba(35, 29, 21, 0.1);
  content: "";
}

.scene-card h3 {
  margin-bottom: 12px;
  color: var(--green);
  font-size: 22px;
  line-height: 1.22;
}

.scene-card p {
  margin-bottom: 0;
  color: var(--ink-soft);
}

.scene-card dl {
  display: grid;
  gap: 10px;
  margin: auto 0 0;
  padding-top: 22px;
}

.scene-card dl div {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.scene-card dt {
  color: var(--muted);
}

.scene-card dd {
  margin: 0;
  color: var(--green);
  font-weight: 760;
  text-align: right;
}

.scene-visual {
  position: relative;
  height: 126px;
  margin-bottom: 22px;
  overflow: hidden;
  border: 1px solid rgba(23, 63, 53, 0.1);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(220, 229, 217, 0.72), rgba(255, 250, 241, 0.62)),
    linear-gradient(90deg, rgba(23, 63, 53, 0.08) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.08) 1px, transparent 1px);
  background-size: auto, 34px 34px, 34px 34px;
}

.scene-visual span {
  position: absolute;
  display: grid;
  place-items: center;
}

.scene-visual em,
.scene-visual small {
  position: relative;
  z-index: 1;
  font-style: normal;
  line-height: 1.15;
}

.scene-visual em {
  color: var(--green);
  font-size: 12px;
  font-weight: 840;
}

.scene-visual small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 760;
}

.visual-doc {
  left: 14px;
  top: 24px;
  width: 58px;
  height: 72px;
  border: 1px solid rgba(23, 63, 53, 0.18);
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.92), rgba(255, 250, 241, 0.72)),
    repeating-linear-gradient(180deg, transparent 0 13px, rgba(23, 63, 53, 0.12) 13px 14px);
  box-shadow: 0 12px 28px rgba(35, 29, 21, 0.1);
}

.visual-uni {
  left: 86px;
  top: 33px;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(23, 63, 53, 0.14) 0 13px, transparent 13px),
    linear-gradient(90deg, transparent 18px, rgba(23, 63, 53, 0.16) 18px 20px, transparent 20px 34px, rgba(23, 63, 53, 0.16) 34px 36px, transparent 36px 50px, rgba(23, 63, 53, 0.16) 50px 52px, transparent 52px),
    rgba(255, 252, 244, 0.72);
}

.visual-uni::before {
  position: absolute;
  left: 13px;
  right: 13px;
  top: -12px;
  height: 22px;
  border-radius: 6px 6px 0 0;
  background: rgba(23, 63, 53, 0.18);
  content: "";
  transform: skewX(-22deg);
}

.visual-path {
  left: 68px;
  right: 62px;
  top: 64px;
  height: 2px;
  background: linear-gradient(90deg, rgba(199, 151, 63, 0.2), rgba(199, 151, 63, 0.72));
}

.visual-path::after {
  position: absolute;
  right: -2px;
  top: -4px;
  width: 10px;
  height: 10px;
  border-top: 2px solid rgba(199, 151, 63, 0.72);
  border-right: 2px solid rgba(199, 151, 63, 0.72);
  content: "";
  transform: rotate(45deg);
}

.visual-germany {
  right: 14px;
  top: 28px;
  width: 52px;
  height: 66px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 50% 50% 46% 46%;
  background: linear-gradient(180deg, #1e1a16 0 33%, #b62f24 33% 66%, #d4a23f 66% 100%);
  color: white;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.08em;
  box-shadow: 0 12px 26px rgba(35, 29, 21, 0.1);
}

.visual-germany::after {
  position: absolute;
  left: 50%;
  bottom: -12px;
  width: 2px;
  height: 14px;
  background: rgba(23, 63, 53, 0.2);
  content: "";
}

.visual-transcript,
.visual-course,
.visual-master {
  width: 62px;
  height: 56px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 7px;
  background: rgba(255, 252, 244, 0.8);
  box-shadow: 0 10px 22px rgba(35, 29, 21, 0.08);
}

.visual-transcript {
  left: 14px;
  top: 28px;
  background:
    repeating-linear-gradient(180deg, transparent 0 12px, rgba(23, 63, 53, 0.1) 12px 13px),
    rgba(255, 252, 244, 0.82);
}

.visual-course {
  left: 86px;
  top: 50px;
}

.visual-master {
  right: 14px;
  top: 28px;
  background:
    linear-gradient(135deg, rgba(23, 63, 53, 0.16), transparent 34%),
    rgba(255, 252, 244, 0.82);
}

.visual-match-line {
  left: 66px;
  right: 66px;
  top: 66px;
  height: 2px;
  background: rgba(199, 151, 63, 0.66);
}

.visual-match-line::before,
.visual-match-line::after {
  position: absolute;
  top: -4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(199, 151, 63, 0.78);
  content: "";
}

.visual-match-line::before {
  left: -2px;
}

.visual-match-line::after {
  right: -2px;
}

.visual-calendar {
  left: 14px;
  top: 20px;
  width: 72px;
  height: 78px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(23, 63, 53, 0.16) 0 22px, transparent 22px),
    repeating-linear-gradient(90deg, transparent 0 19px, rgba(23, 63, 53, 0.1) 19px 20px),
    rgba(255, 252, 244, 0.78);
}

.visual-calendar em {
  margin-top: 14px;
}

.visual-milestone {
  width: 50px;
  height: 34px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: 999px;
  background: rgba(255, 252, 244, 0.84);
  color: var(--green);
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(35, 29, 21, 0.07);
}

.visual-milestone::before {
  position: absolute;
  top: 50%;
  left: -23px;
  width: 22px;
  height: 2px;
  background: rgba(199, 151, 63, 0.58);
  content: "";
}

.visual-aps {
  left: 102px;
  top: 22px;
}

.visual-language {
  left: 126px;
  top: 66px;
}

.visual-apply {
  right: 12px;
  top: 31px;
}

.visual-passport {
  left: 14px;
  top: 24px;
  width: 60px;
  height: 74px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 252, 244, 0.9) 0 20%, transparent 21%),
    linear-gradient(180deg, rgba(23, 63, 53, 0.78), rgba(23, 63, 53, 0.62));
}

.visual-passport em {
  color: white;
}

.visual-home {
  left: 84px;
  top: 58px;
  width: 68px;
  height: 48px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 7px;
  background: rgba(255, 252, 244, 0.84);
}

.visual-home::before {
  position: absolute;
  left: 17px;
  top: -18px;
  width: 38px;
  height: 38px;
  border-radius: 5px;
  background: rgba(23, 63, 53, 0.2);
  content: "";
  transform: rotate(45deg);
}

.visual-insurance {
  right: 14px;
  top: 22px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background:
    linear-gradient(90deg, transparent 42%, rgba(255, 252, 244, 0.92) 42% 58%, transparent 58%),
    linear-gradient(180deg, transparent 42%, rgba(255, 252, 244, 0.92) 42% 58%, transparent 58%),
    rgba(46, 111, 96, 0.78);
}

.visual-insurance em {
  color: white;
  font-size: 11px;
}

.visual-money {
  right: 14px;
  bottom: 18px;
  width: 78px;
  height: 38px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 7px;
  background:
    linear-gradient(90deg, rgba(199, 151, 63, 0.58) 0 14px, transparent 14px),
    rgba(255, 252, 244, 0.84);
}

.visual-money::before {
  position: absolute;
  left: 42px;
  top: 13px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(199, 151, 63, 0.56);
  content: "";
}

.case-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-top: 14px;
  padding: 18px 20px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.62);
}

.case-note span {
  color: var(--gold);
  font-weight: 840;
}

.case-note p {
  margin: 0;
  color: var(--ink-soft);
}

.text-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  color: var(--green);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(199, 151, 63, 0.45);
  text-underline-offset: 5px;
}

.case-card {
  min-width: 0;
  min-height: 342px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.68);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.case-card:hover {
  transform: translateY(-4px);
  border-color: rgba(23, 63, 53, 0.24);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
}

.case-card > span {
  display: inline-flex;
  margin-bottom: 34px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.08);
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
}

.case-card h3 {
  margin-bottom: 12px;
  font-size: 21px;
  line-height: 1.2;
}

.case-card dl {
  display: grid;
  gap: 10px;
  margin: 28px 0 0;
}

.case-card dl div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.case-card dt {
  color: var(--muted);
}

.case-card dd {
  margin: 0;
  color: var(--green);
  font-weight: 760;
  text-align: right;
}

.knowledge-layout {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr;
  gap: 14px;
}

.knowledge-card {
  min-width: 0;
  min-height: 250px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.86), rgba(247, 240, 228, 0.72)),
    radial-gradient(circle at 88% 0%, rgba(23, 63, 53, 0.08), transparent 34%);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.knowledge-card:hover {
  transform: translateY(-4px);
  border-color: rgba(199, 151, 63, 0.34);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
}

.knowledge-card-main {
  grid-row: span 2;
  min-height: 100%;
  background:
    radial-gradient(circle at 92% 8%, rgba(199, 151, 63, 0.22), transparent 34%),
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(236, 242, 236, 0.74));
}

.knowledge-card-video {
  min-height: 250px;
  background:
    radial-gradient(circle at 12% 16%, rgba(23, 63, 53, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(245, 249, 245, 0.82), rgba(255, 250, 241, 0.72));
}

.knowledge-card span {
  display: inline-flex;
  margin-bottom: 30px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.08);
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
}

.knowledge-card h3 {
  max-width: 540px;
  margin-bottom: 12px;
  font-size: 23px;
  line-height: 1.2;
}

.knowledge-card p {
  max-width: 560px;
  margin-bottom: 0;
  color: var(--ink-soft);
}

.knowledge-card a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-top: 28px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--green);
  color: white;
  font-weight: 760;
  text-decoration: none;
  transition:
    transform 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.knowledge-card a:hover,
.knowledge-card a:focus-visible {
  background: #0f3f36;
  box-shadow: 0 12px 24px rgba(23, 63, 53, 0.16);
  transform: translateY(-2px);
}

.studio-section {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 54px;
  align-items: start;
}

.studio-panel {
  min-width: 0;
  padding: 28px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.68);
}

.studio-brand {
  display: inline-flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 22px;
  padding: 12px 14px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.62);
}

.studio-brand img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
}

.studio-brand strong,
.studio-brand span {
  display: block;
}

.studio-brand strong {
  color: var(--green);
  font-size: 18px;
  line-height: 1.2;
}

.studio-brand span {
  color: var(--muted);
  font-size: 13px;
}

.studio-panel p {
  margin-bottom: 28px;
}

.studio-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.studio-metrics div {
  min-height: 116px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.66);
}

.studio-metrics strong {
  display: block;
  margin-bottom: 8px;
  color: var(--green);
  font-size: 23px;
}

.studio-metrics span {
  color: var(--ink-soft);
}

.trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.trust-card {
  min-width: 0;
  min-height: 250px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.88), rgba(247, 240, 228, 0.72)),
    radial-gradient(circle at 86% 0%, rgba(199, 151, 63, 0.12), transparent 38%);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.trust-card:hover {
  transform: translateY(-4px);
  border-color: rgba(199, 151, 63, 0.34);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
}

.trust-card span {
  display: inline-flex;
  margin-bottom: 34px;
  color: var(--gold);
  font-weight: 840;
}

.trust-card h3 {
  margin-bottom: 12px;
  color: var(--green);
  font-size: 22px;
  line-height: 1.2;
}

.trust-card p {
  margin-bottom: 0;
  color: var(--ink-soft);
}

.faq-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.74fr) minmax(0, 1.26fr);
  gap: 18px;
  align-items: start;
}

.faq-aside {
  display: grid;
  gap: 14px;
  min-height: 320px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(23, 63, 53, 0.94), rgba(46, 111, 96, 0.9)),
    radial-gradient(circle at 84% 10%, rgba(199, 151, 63, 0.24), transparent 36%);
  color: var(--white);
}

.faq-aside > span {
  color: rgba(255, 250, 241, 0.72);
  font-size: 13px;
  font-weight: 820;
  text-transform: uppercase;
}

.faq-aside h3 {
  max-width: 340px;
  margin-bottom: 0;
  font-size: 30px;
  font-weight: 520;
  line-height: 1.12;
}

.faq-aside p {
  max-width: 360px;
  margin-bottom: 0;
  color: rgba(255, 250, 241, 0.78);
}

.faq-aside .text-link {
  align-self: end;
  color: var(--white);
  text-decoration-color: rgba(199, 151, 63, 0.74);
}

.faq-list {
  display: grid;
  gap: 10px;
}

.faq-list details {
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.76);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.faq-list details[open] {
  background: rgba(255, 252, 244, 0.92);
}

.faq-list summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 32px;
  gap: 14px;
  align-items: center;
  min-height: 68px;
  padding: 17px 18px;
  cursor: pointer;
  color: var(--green);
  font-weight: 780;
  line-height: 1.42;
  list-style: none;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary::after {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 50%;
  color: var(--gold);
  content: "+";
  font-size: 20px;
  line-height: 1;
  transition:
    transform 160ms ease,
    background 160ms ease;
}

.faq-list details[open] summary::after {
  background: rgba(23, 63, 53, 0.08);
  content: "−";
  transform: rotate(180deg);
}

.faq-list p {
  margin: -3px 18px 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(35, 29, 21, 0.09);
  color: var(--ink-soft);
}

.contact-section {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  gap: 56px;
  align-items: start;
  width: min(var(--max), calc(100% - 40px));
  margin: 0 auto;
  padding: 94px 0;
}

.lead-form {
  grid-template-columns: 1fr 1fr;
  min-width: 0;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.72);
  box-shadow: var(--shadow);
}

.lead-form label.full,
.lead-form .full {
  grid-column: 1 / -1;
}

.form-note {
  grid-column: 1 / -1;
}

.form-note.is-success,
.mini-form p.is-success,
.floating-lead-panel p.is-success {
  color: var(--green);
  font-weight: 760;
}

.page-hero {
  position: relative;
  overflow: hidden;
  min-height: 72vh;
  padding: 150px 24px 82px;
  border-bottom: 1px solid rgba(35, 29, 21, 0.09);
  background:
    radial-gradient(circle at 78% 10%, rgba(199, 151, 63, 0.18), transparent 30%),
    radial-gradient(circle at 16% 24%, rgba(46, 111, 96, 0.1), transparent 28%),
    linear-gradient(180deg, rgba(255, 250, 241, 0.74), rgba(237, 242, 237, 0.58));
  isolation: isolate;
}

.page-hero::before {
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: 0.16;
  background-image:
    linear-gradient(rgba(23, 63, 53, 0.24) 1px, transparent 1px),
    linear-gradient(90deg, rgba(23, 63, 53, 0.24) 1px, transparent 1px);
  background-size: 72px 72px;
  content: "";
  mask-image: linear-gradient(180deg, black, transparent 72%);
}

.page-hero::after {
  position: absolute;
  right: 8vw;
  bottom: 72px;
  z-index: -1;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(23, 63, 53, 0.1);
  border-radius: 50%;
  background:
    linear-gradient(180deg, #1f1b18 0 33%, #b94032 33% 66%, #d9a441 66% 100%);
  content: "";
  opacity: 0.08;
}

.page-hero-compact {
  min-height: 0;
}

.page-hero-inner {
  display: grid;
  gap: 22px;
  width: min(900px, calc(100% - 40px));
  margin: 0 auto;
}

.page-hero-inner.reveal {
  opacity: 1;
  transform: none;
}

.page-hero h1 {
  color: var(--ink);
  max-width: 820px;
  margin-bottom: 0;
}

.page-hero p {
  max-width: 760px;
  margin-bottom: 0;
  color: #3f392f;
  font-size: clamp(17px, 2vw, 21px);
  line-height: 1.74;
}

.content-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 2px 0 0;
  color: var(--green);
}

.content-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.72);
  box-shadow: 0 10px 28px rgba(35, 29, 21, 0.07);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.page-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.not-found-hero {
  min-height: 76vh;
}

.not-found-code {
  width: fit-content;
  margin: 0;
  padding: 8px 14px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: 999px;
  background: rgba(255, 250, 241, 0.68);
  color: var(--gold);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0;
}

.not-found-section {
  padding-top: 0;
}

.not-found-grid {
  display: grid;
  width: min(var(--max), calc(100% - 40px));
  margin: 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.not-found-card {
  display: grid;
  min-height: 190px;
  align-content: start;
  gap: 14px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.72);
  box-shadow: 0 18px 48px rgba(23, 63, 53, 0.08);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease;
}

.not-found-card:hover,
.not-found-card:focus-visible {
  border-color: rgba(199, 151, 63, 0.48);
  background-color: rgba(255, 252, 246, 0.92);
  transform: translateY(-2px);
}

.not-found-card span {
  color: var(--gold);
  font-weight: 800;
}

.not-found-card strong {
  color: var(--green);
  font-size: 22px;
  line-height: 1.2;
}

.not-found-card p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.7;
}

.page-section {
  position: relative;
}

.page-section.alt::before,
.policy-section::before {
  position: absolute;
  z-index: -1;
  inset: 0 50%;
  width: 100vw;
  margin-left: -50vw;
  border-top: 1px solid rgba(35, 29, 21, 0.09);
  border-bottom: 1px solid rgba(35, 29, 21, 0.06);
  background:
    radial-gradient(circle at 86% 16%, rgba(199, 151, 63, 0.12), transparent 30%),
    linear-gradient(180deg, rgba(237, 242, 237, 0.55), rgba(255, 250, 241, 0.48));
  content: "";
}

.page-grid,
.content-split,
.values-grid,
.case-story-grid,
.article-grid {
  display: grid;
  gap: 14px;
}

.page-grid.four {
  grid-template-columns: repeat(4, 1fr);
}

.page-grid.three,
.content-split,
.values-grid {
  grid-template-columns: repeat(3, 1fr);
}

.page-card,
.value-card,
.case-story,
.article-card,
.policy-block,
.deliverable-item,
.about-panel {
  min-width: 0;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.68);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.06);
}

.page-card,
.value-card,
.case-story,
.article-card,
.policy-block {
  padding: 24px;
}

.page-card {
  min-height: 330px;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.page-card:hover,
.value-card:hover,
.case-story:hover,
.article-card:hover,
.article-card:focus-visible,
.deliverable-item:hover {
  transform: translateY(-2px);
  border-color: rgba(199, 151, 63, 0.34);
  box-shadow: 0 12px 28px rgba(35, 29, 21, 0.08);
}

.page-card .card-index,
.article-card > span,
.case-story > span {
  display: inline-flex;
  margin-bottom: 26px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.page-card h3,
.value-card strong,
.case-story h3,
.article-card h3 {
  display: block;
  margin-bottom: 12px;
  color: var(--green);
  font-size: 22px;
  line-height: 1.22;
}

.page-card p,
.value-card p,
.case-story p,
.article-card p,
.policy-block p {
  color: #4b443a;
}

.article-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  margin-top: 20px;
  color: var(--green);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: rgba(199, 151, 63, 0.45);
  text-underline-offset: 5px;
  transition:
    color 160ms ease,
    text-decoration-color 160ms ease,
    transform 160ms ease;
}

.article-link:hover,
.article-link:focus-visible {
  color: #0f3f36;
  text-decoration-color: var(--gold);
  transform: translateY(-1px);
}

.page-card ul,
.article-card ul,
.policy-block ul {
  display: grid;
  gap: 9px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.page-card li,
.article-card li,
.policy-block li {
  position: relative;
  padding-left: 18px;
  color: var(--ink-soft);
}

.page-card li::before,
.article-card li::before,
.policy-block li::before {
  position: absolute;
  left: 0;
  top: 0.68em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold);
  content: "";
}

.deliverable-list {
  display: grid;
  gap: 12px;
}

.deliverable-item {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  padding: 22px 24px;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.deliverable-item strong {
  color: var(--green);
  font-size: 21px;
  line-height: 1.2;
}

.deliverable-item p {
  margin: 0;
  color: var(--ink-soft);
}

.service-boundary-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.service-boundary-card {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 8px 18px;
  min-width: 0;
  min-height: 172px;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(255, 250, 241, 0.82), rgba(237, 242, 237, 0.62)),
    radial-gradient(circle at 92% 18%, rgba(46, 111, 96, 0.1), transparent 30%);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.06);
}

.service-boundary-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: 34px;
  padding: 0 13px;
  border-radius: 999px;
  background: rgba(199, 151, 63, 0.16);
  color: var(--green);
  font-size: 13px;
  font-weight: 850;
}

.service-boundary-card h3 {
  min-width: 0;
  color: var(--green);
  font-size: 21px;
  line-height: 1.22;
}

.service-boundary-card p {
  grid-column: 2;
  margin: 0;
  color: var(--ink-soft);
}

.prep-check-panel {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.prep-check-card {
  display: grid;
  min-width: 0;
  gap: 14px;
  min-height: 248px;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 250, 241, 0.78), rgba(237, 242, 237, 0.58)),
    radial-gradient(circle at 85% 12%, rgba(199, 151, 63, 0.13), transparent 30%);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.06);
}

.prep-check-card span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(23, 63, 53, 0.92);
  color: #fffaf1;
  font-size: 13px;
  font-weight: 850;
}

.prep-check-card h3 {
  color: var(--green);
  font-size: 21px;
  line-height: 1.22;
}

.prep-check-card p {
  margin: 0;
  color: var(--ink-soft);
}

.prep-check-note {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  margin-top: 14px;
  padding: 18px 20px;
  border: 1px solid rgba(199, 151, 63, 0.28);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.78);
}

.prep-check-note strong {
  color: var(--green);
  font-size: 18px;
  line-height: 1.25;
}

.prep-check-note p {
  margin: 0;
  color: var(--ink-soft);
}

.contact-channel-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.contact-channel-card {
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  min-height: 470px;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 250, 241, 0.82), rgba(237, 242, 237, 0.58)),
    radial-gradient(circle at 88% 14%, rgba(199, 151, 63, 0.12), transparent 30%);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.06);
}

.contact-channel-visual,
.contact-channel-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 210px;
  margin: 0 0 20px;
  overflow: hidden;
  border: 1px solid rgba(35, 29, 21, 0.1);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.7);
}

.contact-channel-visual img {
  width: min(190px, 100%);
  height: auto;
}

.contact-channel-visual-portrait img {
  width: min(150px, 100%);
  max-height: 210px;
  object-fit: contain;
}

.contact-channel-placeholder {
  color: var(--green);
  font-size: 34px;
  font-weight: 880;
  letter-spacing: 0;
}

.contact-channel-card span {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 850;
}

.contact-channel-card h3 {
  color: var(--green);
  font-size: 22px;
  line-height: 1.22;
}

.contact-channel-card p {
  margin: 10px 0 20px;
  color: var(--ink-soft);
}

.contact-channel-card .button {
  width: 100%;
}

.article-grid {
  grid-template-columns: 1.1fr 1fr 1fr;
}

.knowledge-guide {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 30px;
}

.knowledge-guide a {
  display: grid;
  min-height: 150px;
  gap: 8px;
  padding: 20px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.86), rgba(237, 242, 237, 0.66)),
    radial-gradient(circle at 90% 10%, rgba(199, 151, 63, 0.13), transparent 34%);
  color: inherit;
  box-shadow: 0 14px 38px rgba(35, 29, 21, 0.06);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.knowledge-guide a:hover,
.knowledge-guide a:focus-visible {
  border-color: rgba(199, 151, 63, 0.38);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
  transform: translateY(-3px);
}

.knowledge-guide span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.knowledge-guide strong {
  color: var(--green);
  font-size: 19px;
  line-height: 1.22;
}

.knowledge-guide small {
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.48;
}

.article-card {
  display: grid;
  align-content: start;
  min-height: 270px;
  color: inherit;
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.86), rgba(247, 240, 228, 0.72)),
    radial-gradient(circle at 90% 8%, rgba(23, 63, 53, 0.08), transparent 34%);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.article-card.featured {
  grid-row: span 2;
  min-height: 100%;
  background:
    radial-gradient(circle at 90% 10%, rgba(199, 151, 63, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(236, 242, 236, 0.76));
}

.knowledge-detail-grid,
.source-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.knowledge-detail,
.source-card {
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.86), rgba(247, 240, 228, 0.72)),
    radial-gradient(circle at 92% 8%, rgba(199, 151, 63, 0.12), transparent 32%);
  box-shadow: 0 14px 38px rgba(35, 29, 21, 0.06);
}

.knowledge-detail {
  scroll-margin-top: 110px;
}

.life-guide-grid,
#arrival-life,
#reading-order {
  scroll-margin-top: 110px;
}

.knowledge-detail:target {
  border-color: rgba(199, 151, 63, 0.5);
  box-shadow: 0 22px 52px rgba(199, 151, 63, 0.14);
}

.life-guide-panel {
  display: grid;
  grid-template-columns: minmax(260px, 0.74fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  margin-bottom: 14px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 14% 12%, rgba(199, 151, 63, 0.18), transparent 34%),
    linear-gradient(180deg, rgba(255, 252, 244, 0.86), rgba(237, 242, 237, 0.68));
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.07);
}

.life-guide-panel h3 {
  margin-bottom: 12px;
  color: var(--green);
  font-size: clamp(25px, 3vw, 36px);
  line-height: 1.15;
}

.life-guide-panel p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.72;
}

.life-guide-visual {
  position: relative;
  min-height: 230px;
  overflow: hidden;
  border: 1px solid rgba(23, 63, 53, 0.1);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 42% 46%, rgba(23, 63, 53, 0.12), transparent 22%),
    linear-gradient(90deg, rgba(23, 63, 53, 0.07) 1px, transparent 1px),
    linear-gradient(rgba(23, 63, 53, 0.07) 1px, transparent 1px),
    rgba(255, 250, 241, 0.6);
  background-size: auto, 34px 34px, 34px 34px;
}

.life-guide-visual::before {
  position: absolute;
  left: 50%;
  top: 32px;
  width: 2px;
  height: 158px;
  background: linear-gradient(180deg, rgba(23, 63, 53, 0.2), rgba(199, 151, 63, 0.56));
  content: "";
}

.life-pin {
  position: absolute;
  left: calc(50% - 9px);
  top: 24px;
  width: 18px;
  height: 18px;
  border-radius: 50% 50% 50% 0;
  background: var(--coral);
  transform: rotate(-45deg);
  box-shadow: 0 0 0 9px rgba(217, 121, 92, 0.12);
}

.life-card {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 126px;
  min-height: 48px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.86);
  color: var(--green);
  font-size: 13px;
  font-weight: 840;
  box-shadow: 0 14px 28px rgba(35, 29, 21, 0.08);
}

.life-card-home {
  left: 26px;
  top: 48px;
}

.life-card-insurance {
  right: 24px;
  top: 96px;
}

.life-card-money {
  left: 50px;
  bottom: 36px;
}

.knowledge-detail span,
.source-card span {
  display: inline-flex;
  margin-bottom: 18px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.knowledge-detail h3 {
  margin-bottom: 12px;
  color: var(--green);
  font-size: 22px;
  line-height: 1.22;
}

.knowledge-detail p {
  color: #4b443a;
}

.knowledge-detail ul {
  display: grid;
  gap: 9px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.knowledge-detail li {
  position: relative;
  padding-left: 18px;
  color: var(--ink-soft);
}

.knowledge-detail li::before {
  position: absolute;
  left: 0;
  top: 0.68em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold);
  content: "";
}

.source-card {
  display: grid;
  gap: 8px;
  min-height: 156px;
  color: inherit;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.source-card:hover,
.source-card:focus-visible {
  border-color: rgba(199, 151, 63, 0.42);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.09);
  transform: translateY(-3px);
}

.source-card strong {
  color: var(--green);
  font-size: 19px;
  line-height: 1.22;
}

.source-card span {
  margin: 0;
  color: var(--ink-soft);
  font-weight: 620;
  line-height: 1.5;
}

.case-story-grid {
  grid-template-columns: repeat(2, 1fr);
}

.case-link-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  align-items: stretch;
}

.case-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}

.case-feature {
  display: grid;
  min-width: 0;
  gap: 16px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.88), rgba(237, 242, 237, 0.68)),
    radial-gradient(circle at 90% 12%, rgba(199, 151, 63, 0.16), transparent 32%);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.07);
}

.case-feature > span {
  display: inline-flex;
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.case-feature h3 {
  color: var(--green);
  font-size: 23px;
  line-height: 1.2;
}

.case-feature p {
  margin: 0;
  color: #4b443a;
}

.case-feature ol {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.case-feature li {
  display: grid;
  gap: 3px;
  padding-top: 11px;
  border-top: 1px solid var(--line);
}

.case-feature li strong {
  color: var(--green);
  font-size: 14px;
}

.case-feature li span {
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.58;
}

.case-narrative-panel {
  display: grid;
  gap: 18px;
  margin: 18px 0;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 86% 12%, rgba(199, 151, 63, 0.15), transparent 34%),
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(244, 238, 225, 0.72));
  box-shadow: 0 20px 54px rgba(35, 29, 21, 0.08);
  scroll-margin-top: 112px;
}

.case-narrative-head {
  display: grid;
  gap: 10px;
  max-width: 820px;
}

.case-narrative-head h2 {
  margin: 0;
  color: var(--green);
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.12;
}

.case-narrative-head p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.7;
}

.case-narrative-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.case-narrative-card {
  display: grid;
  min-width: 0;
  gap: 14px;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: 8px;
  background: rgba(255, 252, 244, 0.78);
}

.case-narrative-card > span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.case-narrative-card h3 {
  color: var(--green);
  font-size: 22px;
  line-height: 1.24;
}

.case-narrative-card p {
  margin: 0;
  color: #4b443a;
  line-height: 1.68;
}

.case-narrative-card ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.case-narrative-card li {
  display: grid;
  gap: 4px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.case-narrative-card li strong {
  color: var(--green);
  font-size: 14px;
}

.case-narrative-card li span {
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.58;
}

.case-dive-panel {
  display: grid;
  grid-template-columns: minmax(240px, 0.38fr) minmax(0, 1fr);
  gap: 18px;
  margin: 18px 0;
  padding: 22px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(23, 63, 53, 0.94), rgba(40, 84, 72, 0.9)),
    linear-gradient(180deg, rgba(255, 252, 244, 0.08), rgba(255, 252, 244, 0));
  box-shadow: 0 24px 64px rgba(23, 63, 53, 0.18);
}

.case-dive-copy {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  padding: 4px 2px;
}

.case-dive-copy .eyebrow {
  color: rgba(242, 207, 139, 0.95);
}

.case-dive-copy h2 {
  margin: 0;
  color: #fffaf1;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.05;
}

.case-dive-copy p {
  max-width: 360px;
  margin: 0;
  color: rgba(255, 250, 241, 0.78);
}

.case-dive-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.case-dive-card {
  display: grid;
  min-width: 0;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(255, 250, 241, 0.14);
  border-radius: 8px;
  background: rgba(255, 250, 241, 0.08);
}

.case-dive-card > span {
  color: rgba(242, 207, 139, 0.98);
  font-size: 13px;
  font-weight: 840;
}

.case-dive-card h3 {
  color: #fffaf1;
  font-size: 20px;
  line-height: 1.24;
}

.case-dive-card dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.case-dive-card dl div {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 250, 241, 0.12);
}

.case-dive-card dt {
  color: rgba(242, 207, 139, 0.9);
  font-size: 13px;
  font-weight: 760;
}

.case-dive-card dd {
  margin: 0;
  color: rgba(255, 250, 241, 0.78);
  font-size: 14px;
  line-height: 1.58;
}

.case-source-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 24px;
  align-items: center;
  margin-bottom: 14px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 88% 16%, rgba(199, 151, 63, 0.16), transparent 30%),
    rgba(255, 250, 241, 0.72);
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.07);
}

.case-source-panel span {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--gold);
  font-size: 13px;
  font-weight: 840;
}

.case-source-panel h3 {
  margin-bottom: 8px;
  color: var(--green);
  font-size: 28px;
  line-height: 1.16;
}

.case-source-panel p {
  max-width: 620px;
  margin: 0;
  color: var(--ink-soft);
}

.case-source-stats {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 12px;
  align-items: baseline;
  padding: 18px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.7);
}

.case-source-stats strong {
  color: var(--green);
  font-size: 26px;
  line-height: 1;
}

.case-source-stats span {
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.32;
}

.case-proof-block {
  display: grid;
  gap: 18px;
  margin: 16px 0 30px;
  padding: 24px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 92% 12%, rgba(199, 151, 63, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(255, 252, 244, 0.88), rgba(237, 242, 237, 0.7));
  box-shadow: 0 18px 48px rgba(35, 29, 21, 0.07);
  scroll-margin-top: 112px;
}

.case-proof-copy {
  display: grid;
  gap: 10px;
  max-width: 760px;
}

.case-proof-copy h2 {
  margin: 0;
  color: var(--green);
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.14;
}

.case-proof-copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.7;
}

.admission-proof-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

.admission-proof-stats span {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 7px 12px;
  border: 1px solid rgba(23, 63, 53, 0.11);
  border-radius: 999px;
  background: rgba(255, 252, 244, 0.78);
  color: var(--green);
  font-size: 13px;
  font-weight: 760;
}

.admission-proof-stats strong {
  margin-right: 3px;
  color: var(--gold);
  font-size: 17px;
}

.admission-wall-tip {
  margin: -2px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 720;
}

.admission-wall-scroll {
  max-height: min(1120px, 78vh);
  overflow-y: auto;
  padding-right: 8px;
  overscroll-behavior: contain;
  scrollbar-color: rgba(23, 63, 53, 0.46) rgba(23, 63, 53, 0.08);
  scrollbar-width: thin;
}

.admission-wall-scroll::-webkit-scrollbar {
  width: 8px;
}

.admission-wall-scroll::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.08);
}

.admission-wall-scroll::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.42);
}

.admission-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.admission-card {
  position: relative;
  display: grid;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.82);
  box-shadow: 0 14px 34px rgba(35, 29, 21, 0.06);
  cursor: zoom-in;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.admission-card::after {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  padding: 6px 9px;
  border: 1px solid rgba(255, 252, 244, 0.74);
  border-radius: 999px;
  background: rgba(23, 63, 53, 0.82);
  color: #fffaf1;
  content: "点击放大";
  font-size: 12px;
  font-weight: 820;
  letter-spacing: 0;
  opacity: 0.9;
  box-shadow: 0 10px 24px rgba(23, 20, 16, 0.16);
}

.admission-card:hover,
.admission-card:focus-visible,
.admission-card:focus-within {
  border-color: rgba(199, 151, 63, 0.32);
  box-shadow: 0 18px 44px rgba(35, 29, 21, 0.1);
  outline: none;
  transform: translateY(-3px);
}

.admission-card-tu9 {
  border-color: rgba(199, 151, 63, 0.2);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(247, 240, 228, 0.76));
}

.admission-card-tu9::before {
  display: inline-flex;
  width: max-content;
  margin: 12px 12px -4px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(199, 151, 63, 0.12);
  color: var(--green);
  font-size: 11px;
  font-weight: 840;
  content: "TU9";
}

.admission-card img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 720 / 920;
  object-fit: contain;
  object-position: top;
  background: rgba(255, 252, 244, 0.92);
}

.admission-card div {
  display: grid;
  gap: 4px;
  padding: 14px;
}

.admission-card strong {
  color: var(--green);
  font-size: 17px;
  line-height: 1.24;
}

.admission-card span {
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.4;
}

.admission-viewer[hidden] {
  display: none;
}

.admission-viewer {
  position: fixed;
  inset: 0;
  z-index: 116;
  display: grid;
  place-items: center;
  padding: 22px;
}

.admission-viewer-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(23, 20, 16, 0.48);
  backdrop-filter: blur(10px);
  cursor: zoom-out;
}

.admission-viewer-card {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
  width: min(1180px, calc(100vw - 32px));
  max-height: calc(100svh - 36px);
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.76);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.96);
  box-shadow: 0 32px 92px rgba(23, 20, 16, 0.28);
}

.admission-viewer-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  min-width: 0;
  padding-right: 44px;
}

.admission-viewer-frame {
  min-height: 0;
  overflow: auto;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: calc(var(--radius) - 3px);
  background: rgba(255, 252, 244, 0.92);
  overscroll-behavior: contain;
}

.admission-viewer-card img {
  display: block;
  width: 920px;
  max-width: none;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}

.admission-viewer-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(23, 63, 53, 0.14);
  border-radius: 50%;
  background: rgba(255, 252, 244, 0.92);
  color: var(--ink);
  cursor: pointer;
  font-size: 23px;
  line-height: 1;
  box-shadow: 0 10px 26px rgba(35, 29, 21, 0.12);
}

.admission-viewer-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.admission-viewer-copy strong {
  color: var(--green);
  font-size: 16px;
}

.admission-viewer-link {
  display: inline-flex;
  flex: 0 0 auto;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  padding: 7px 13px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 999px;
  background: rgba(255, 252, 244, 0.92);
  color: var(--green);
  font-size: 13px;
  font-weight: 820;
  text-decoration: none;
}

.admission-viewer-link:hover,
.admission-viewer-link:focus-visible {
  border-color: rgba(199, 151, 63, 0.42);
  background: rgba(199, 151, 63, 0.13);
  outline: none;
}

.case-reading-flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 18px;
}

.case-reading-flow span {
  position: relative;
  display: grid;
  min-height: 54px;
  place-items: center;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: 999px;
  background: rgba(255, 252, 244, 0.74);
  color: var(--green);
  font-weight: 820;
}

.case-reading-flow span::after {
  position: absolute;
  right: -13px;
  width: 16px;
  height: 1px;
  background: rgba(199, 151, 63, 0.54);
  content: "";
}

.case-reading-flow span:last-child::after {
  display: none;
}

.case-story {
  display: flex;
  flex-direction: column;
  min-height: 300px;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.case-story dl {
  display: grid;
  gap: 10px;
  margin: auto 0 0;
  padding-top: 22px;
}

.case-story dl div {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.case-story dt {
  color: var(--muted);
}

.case-story dd {
  margin: 0;
  color: var(--green);
  font-weight: 760;
  text-align: right;
  overflow-wrap: anywhere;
}

.case-story details {
  margin-top: 18px;
  border: 1px solid rgba(23, 63, 53, 0.12);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.62);
}

.case-story summary {
  padding: 11px 13px;
  color: var(--green);
  cursor: pointer;
  font-size: 14px;
  font-weight: 760;
}

.case-story details p {
  margin: 0;
  padding: 0 13px 13px;
  color: #4b443a;
  font-size: 14px;
  line-height: 1.62;
}

.case-original-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 44px;
  margin-top: 22px;
  padding: 0 16px;
  border: 1px solid rgba(23, 63, 53, 0.16);
  border-radius: 999px;
  background: rgba(255, 252, 244, 0.82);
  color: var(--green);
  font-size: 14px;
  font-weight: 760;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.case-original-link:hover,
.case-original-link:focus-visible {
  border-color: rgba(199, 151, 63, 0.42);
  box-shadow: 0 12px 24px rgba(35, 29, 21, 0.08);
  transform: translateY(-2px);
}

.value-card {
  min-height: 230px;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.about-panel {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 34px;
  align-items: start;
  padding: 34px;
}

.about-panel h2 {
  margin: 10px 0 0;
  color: var(--green);
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 520;
  line-height: 1.12;
}

.about-panel p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.76;
}

.policy-section {
  display: grid;
  gap: 14px;
  width: min(900px, calc(100% - 40px));
  margin: 0 auto;
  padding: 84px 0;
}

.article-hero .page-hero-inner {
  max-width: 860px;
}

.article-page {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.article-toc {
  position: sticky;
  top: 104px;
  display: grid;
  gap: 10px;
  padding: 18px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background: rgba(255, 250, 241, 0.76);
  box-shadow: 0 14px 38px rgba(35, 29, 21, 0.06);
}

.article-toc strong {
  color: var(--green);
  font-size: 15px;
}

.article-toc a {
  min-height: 34px;
  padding: 8px 10px;
  border-radius: 999px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 700;
  transition:
    background 160ms ease,
    color 160ms ease,
    transform 160ms ease;
}

.article-toc a:hover,
.article-toc a:focus-visible {
  background: rgba(23, 63, 53, 0.08);
  color: var(--green);
  transform: translateX(2px);
}

.article-body {
  display: grid;
  gap: 14px;
}

.article-body section {
  scroll-margin-top: 112px;
  padding: 30px;
  border: 1px solid rgba(23, 63, 53, 0.13);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 252, 244, 0.9), rgba(247, 240, 228, 0.74)),
    radial-gradient(circle at 92% 10%, rgba(199, 151, 63, 0.12), transparent 30%);
  box-shadow: 0 16px 42px rgba(35, 29, 21, 0.06);
}

.article-body h2 {
  margin: 8px 0 14px;
  color: var(--green);
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.18;
}

.article-body p {
  max-width: 820px;
  color: #4b443a;
  font-size: 17px;
  line-height: 1.82;
}

.article-body p + p {
  margin-top: 12px;
}

.article-body ul {
  display: grid;
  gap: 10px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.article-body li {
  position: relative;
  padding-left: 20px;
  color: var(--ink-soft);
  line-height: 1.7;
}

.article-body li::before {
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  content: "";
}

.article-note {
  margin-top: 22px;
  padding: 16px;
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  background: rgba(255, 252, 244, 0.72);
  color: var(--green);
  font-size: 14px;
  font-weight: 720;
  line-height: 1.62;
}

.policy-block h2 {
  margin-bottom: 12px;
  color: var(--green);
  font-size: 25px;
  line-height: 1.2;
}

.policy-block p + p {
  margin-top: 10px;
}

.site-footer {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background:
    radial-gradient(circle at 8% 0%, rgba(199, 151, 63, 0.12), transparent 30%),
    linear-gradient(180deg, #173f35, #102f29);
  color: rgba(255, 250, 241, 0.72);
}

.footer-inner {
  display: grid;
  gap: 28px;
  width: min(var(--max), calc(100% - 40px));
  margin: 0 auto;
  padding: 48px 0 30px;
}

.footer-brand {
  display: flex;
  gap: 14px;
  align-items: center;
}

.footer-brand img {
  width: 54px;
  height: 54px;
  border: 1px solid rgba(255, 250, 241, 0.16);
  border-radius: 50%;
  background: rgba(255, 250, 241, 0.8);
  object-fit: cover;
}

.footer-brand strong,
.footer-brand span {
  display: block;
}

.footer-brand strong {
  color: var(--white);
  font-size: 20px;
  line-height: 1.2;
}

.footer-brand span {
  margin-top: 3px;
  color: rgba(255, 250, 241, 0.62);
  font-size: 13px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1.15fr;
  gap: 28px;
  padding-top: 26px;
  border-top: 1px solid rgba(255, 250, 241, 0.12);
}

.footer-grid h2 {
  margin-bottom: 12px;
  color: var(--white);
  font-size: 16px;
  line-height: 1.3;
}

.footer-grid p,
.footer-grid ul,
.footer-bottom p {
  margin: 0;
}

.footer-grid p {
  max-width: 440px;
  color: rgba(255, 250, 241, 0.68);
}

.footer-grid ul {
  display: grid;
  gap: 8px;
  padding: 0;
  list-style: none;
}

.footer-grid a {
  color: rgba(255, 250, 241, 0.78);
  text-decoration: underline;
  text-decoration-color: rgba(199, 151, 63, 0.44);
  text-underline-offset: 4px;
  transition:
    color 160ms ease,
    text-decoration-color 160ms ease;
}

.footer-grid a:hover,
.footer-grid a:focus-visible {
  color: var(--white);
  text-decoration-color: var(--gold);
}

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 250, 241, 0.1);
  color: rgba(255, 250, 241, 0.52);
  font-size: 13px;
}

.footer-filing a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(255, 250, 241, 0.34);
  text-underline-offset: 4px;
}

.footer-filing a:hover,
.footer-filing a:focus-visible {
  color: var(--white);
  text-decoration-color: var(--gold);
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 700ms ease,
    transform 700ms ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes ticker {
  to {
    transform: translateX(var(--ticker-shift, -50%));
  }
}

@keyframes admissionScroll {
  to {
    transform: translateX(-50%);
  }
}

@keyframes leadPulse {
  0%,
  72%,
  100% {
    box-shadow: 0 18px 42px rgba(23, 63, 53, 0.24), 0 0 0 6px rgba(199, 151, 63, 0.12);
  }

  82% {
    box-shadow:
      0 22px 50px rgba(23, 63, 53, 0.3),
      0 0 0 10px rgba(199, 151, 63, 0.17);
  }
}

@keyframes loaderLift {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.94);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes loaderPulse {
  from {
    opacity: 0;
    transform: scale(0.82);
  }

  55% {
    opacity: 1;
  }

  to {
    opacity: 0.62;
    transform: scale(1.06);
  }
}

@keyframes loaderOrbit {
  from {
    opacity: 0;
    transform: rotate(-70deg) scale(0.9);
  }

  35% {
    opacity: 1;
  }

  to {
    opacity: 0.78;
    transform: rotate(260deg) scale(1);
  }
}

@keyframes loaderTextIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes loaderTrack {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@media (max-width: 1500px) {
  .floating-lead {
    right: 14px;
    top: auto;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    width: auto;
    transform: none;
  }

  .floating-lead-panel {
    right: 0;
    top: auto;
    bottom: 60px;
    width: min(300px, calc(100vw - 28px));
    padding: 14px;
  }

  .floating-lead-head button {
    display: grid;
  }
}

@media (max-width: 1020px) {
  .site-header {
    grid-template-columns: auto auto;
    justify-content: space-between;
    border-radius: 28px;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .site-nav,
  .header-cta {
    display: none;
  }

  .site-header.is-open .site-nav {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    display: grid;
    width: 100%;
    gap: 0;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.62);
    border-radius: 24px;
    background: rgba(23, 63, 53, 0.92);
    color: white;
    box-shadow: var(--shadow);
    backdrop-filter: blur(18px);
  }

  .site-header.is-open .site-nav a {
    padding: 15px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }

  .site-header.is-open .site-nav a.is-current {
    border-color: rgba(199, 151, 63, 0.46);
    background: rgba(255, 252, 244, 0.13);
    color: white;
    box-shadow: inset 4px 0 0 rgba(199, 151, 63, 0.86);
  }

  .site-header.is-open .site-nav a:last-child {
    border-bottom: 0;
  }

  .hero-inner,
  .about-panel,
  .life-guide-panel,
  .info-board-inner,
  .updates-layout,
  .admission-showcase,
  .planner-panel,
  .readiness-panel,
  .route-shell,
  .route-card,
  .studio-section,
  .faq-layout,
  .case-dive-panel,
  .contact-section {
    grid-template-columns: 1fr;
  }

  .service-grid,
  .case-grid,
  .scene-grid,
  .knowledge-layout,
  .trust-grid,
  .faq-layout,
  .page-grid.four,
  .page-grid.three,
  .content-split,
  .values-grid,
  .knowledge-detail-grid,
  .source-grid,
  .knowledge-guide,
  .admission-grid,
  .case-feature-grid,
  .case-narrative-grid,
  .case-dive-grid,
  .service-boundary-panel,
  .prep-check-panel,
  .contact-channel-grid,
  .case-link-grid,
  .article-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .knowledge-card-main,
  .knowledge-card-video,
  .article-card.featured {
    grid-column: 1 / -1;
  }

  .article-card.featured {
    grid-row: auto;
  }

  .planner-controls {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .info-board-grid {
    grid-template-columns: 1fr;
  }

  .planner-controls button {
    text-align: center;
    transform: none;
  }

  .planner-controls button:hover,
  .planner-controls button.is-active {
    transform: none;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }

  .footer-grid > div:first-child {
    grid-column: 1 / -1;
  }

  .article-page {
    grid-template-columns: 1fr;
  }

  .article-toc {
    position: static;
  }
}

@media (max-width: 660px) {
  body {
    padding-bottom: calc(132px + env(safe-area-inset-bottom));
    background:
      linear-gradient(180deg, rgba(243, 236, 223, 0.95), rgba(247, 241, 231, 0.9) 48%, rgba(236, 226, 212, 0.95)),
      radial-gradient(circle at 18% 0%, rgba(199, 151, 63, 0.11), transparent 31%),
      radial-gradient(circle at 86% 34%, rgba(46, 111, 96, 0.08), transparent 28%),
      image-set(
        url("assets/hero-germany-campus-1200.webp") type("image/webp"),
        url("assets/hero-germany-campus-1200.jpg") type("image/jpeg")
      ) center 480px / 540px auto no-repeat,
      linear-gradient(180deg, var(--paper), #f7f1e7 48%, #ece2d4);
    overflow-x: hidden;
  }

  .site-header {
    top: 12px;
    right: 12px;
    left: 12px;
    width: calc(100% - 24px);
    min-height: 58px;
    padding: 8px 9px 8px 12px;
    transform: none;
  }

  .brand {
    max-width: calc(100vw - 94px);
  }

  .brand strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .brand-avatar {
    width: 38px;
    height: 38px;
  }

  .brand small {
    display: none;
  }

  .hero {
    min-height: auto;
    padding: 112px 18px 48px;
  }

  .hero-image {
    object-position: 54% center;
    transform: scaleX(-1) scale(1.06);
  }

  .hero-overlay {
    background:
      linear-gradient(180deg, rgba(243, 236, 223, 0.34), rgba(243, 236, 223, 0.86) 58%, var(--paper) 96%),
      linear-gradient(90deg, rgba(243, 236, 223, 0.86), rgba(243, 236, 223, 0.34));
  }

  .hero-inner {
    width: 100%;
    margin: 0;
    gap: 28px;
    min-height: 0;
  }

  .hero-content {
    width: 100%;
    max-width: 100%;
    padding-bottom: 0;
  }

  .hero-label {
    flex-wrap: wrap;
    margin-bottom: 18px;
    font-size: 13px;
    line-height: 1.38;
  }

  h1 {
    font-size: 34px;
    line-height: 1.14;
  }

  .hero-copy {
    width: 100%;
    max-width: 100%;
    font-size: 16px;
    line-height: 1.62;
  }

  .hero-actions,
  .hero-proof {
    display: grid;
  }

  .button {
    width: 100%;
  }

  .section,
  .policy-section,
  .contact-section {
    width: min(100% - 32px, var(--max));
    padding: 58px 0;
  }

  .section-heading h2,
  .studio-copy h2,
  .contact-copy h2 {
    font-size: 26px;
    line-height: 1.18;
  }

  .section-heading,
  .studio-copy,
  .contact-copy {
    gap: 10px;
    margin-bottom: 26px;
    padding: 13px 0 13px 14px;
  }

  .section-heading p,
  .studio-panel p,
  .contact-copy p {
    font-size: 16px;
    line-height: 1.62;
  }

  .planner-panel {
    gap: 14px;
    min-height: 0;
    margin-bottom: 14px;
    padding: 16px;
  }

  .planner-copy h3 {
    font-size: 24px;
  }

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

  .planner-controls button {
    min-height: 44px;
    padding: 0 10px;
    font-size: 14px;
    text-align: center;
  }

  .planner-result {
    min-height: 286px;
    padding: 18px;
  }

  .planner-result h4 {
    font-size: 21px;
  }

  .readiness-panel {
    gap: 14px;
    grid-template-columns: 1fr;
    padding: 16px;
  }

  .readiness-control-group {
    padding: 14px;
  }

  .readiness-result {
    padding: 20px;
  }

  .readiness-result h3 {
    font-size: 24px;
  }

  .readiness-actions {
    display: grid;
  }

  .service-grid,
  .case-grid,
  .scene-grid,
  .knowledge-layout,
  .trust-grid,
  .faq-layout,
  .page-grid.four,
  .page-grid.three,
  .content-split,
  .values-grid,
  .knowledge-detail-grid,
  .source-grid,
  .knowledge-guide,
  .admission-grid,
  .article-grid,
  .case-story-grid,
  .case-feature-grid,
  .case-narrative-grid,
  .case-dive-grid,
  .service-boundary-panel,
  .prep-check-panel,
  .contact-channel-grid,
  .case-link-grid,
  .planner-controls,
  .readiness-controls,
  .studio-metrics,
  .lead-form {
    grid-template-columns: 1fr;
  }

  .updates-layout,
  .info-board-inner,
  .info-board-grid,
  .admission-showcase,
  .case-dive-panel,
  .prep-check-note,
  .case-reading-flow {
    grid-template-columns: 1fr;
  }

  .signal-band {
    padding: 34px 0;
  }

  .signal-band::before {
    background:
      linear-gradient(180deg, rgba(247, 240, 228, 0.92), rgba(247, 240, 228, 0.72)),
      image-set(
        url("assets/hero-germany-campus-1200.webp") type("image/webp"),
        url("assets/hero-germany-campus-1200.jpg") type("image/jpeg")
      ) center center / 560px auto no-repeat;
    opacity: 0.32;
  }

  .info-board-copy h2 {
    font-size: 27px;
  }

  .info-board-copy p {
    font-size: 15px;
    line-height: 1.62;
  }

  .updates-feature {
    min-height: 0;
    padding: 20px;
  }

  .admission-track article {
    flex-basis: 178px;
    width: 178px;
    height: 258px;
  }

  .admission-marquee {
    height: 258px;
  }

  .case-reading-flow span {
    min-height: 48px;
  }

  .case-reading-flow span::after {
    display: none;
  }

  .case-dive-panel {
    gap: 16px;
    padding: 18px;
  }

  .case-narrative-panel {
    gap: 16px;
    padding: 18px;
  }

  .case-dive-copy p {
    max-width: none;
  }

  .case-dive-card dl div {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .service-boundary-card {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 18px;
  }

  .service-boundary-card p {
    grid-column: auto;
  }

  .prep-check-card {
    min-height: 0;
    padding: 18px;
  }

  .contact-channel-card {
    min-height: 0;
    padding: 18px;
  }

  .contact-channel-visual,
  .contact-channel-placeholder {
    min-height: 180px;
  }

  .prep-check-note {
    gap: 8px;
    padding: 16px;
  }

  .case-source-panel {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .case-source-panel .button {
    width: 100%;
  }

  .page-hero {
    min-height: auto;
    padding: 120px 18px 56px;
    overflow-x: hidden;
  }

  .page-hero-inner {
    width: 100%;
    min-width: 0;
  }

  .page-hero h1 {
    font-size: 34px;
    line-height: 1.14;
    overflow-wrap: anywhere;
  }

  .page-hero p {
    font-size: 16px;
    line-height: 1.62;
    overflow-wrap: anywhere;
  }

  .page-hero-actions {
    display: grid;
  }

  .content-meta {
    gap: 7px;
  }

  .content-meta span {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .not-found-hero {
    min-height: auto;
  }

  .not-found-grid {
    width: calc(100% - 28px);
    grid-template-columns: 1fr;
  }

  .not-found-card {
    min-height: 0;
    padding: 20px;
  }

  .page-card,
  .value-card,
  .case-story,
  .case-feature,
  .case-narrative-card,
  .article-card,
  .knowledge-detail,
  .source-card,
  .life-guide-panel,
  .policy-block {
    min-height: 0;
    max-width: 100%;
    overflow: hidden;
    padding: 20px;
  }

  .page-card .card-index,
  .article-card > span,
  .case-story > span {
    margin-bottom: 18px;
  }

  .deliverable-item,
  .about-panel {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 20px;
  }

  .service-card {
    min-height: 0;
    padding: 18px;
  }

  .service-icon {
    width: 58px;
    height: 58px;
    margin: 24px 0 18px;
    font-size: 13px;
  }

  .service-card h3,
  .case-card h3 {
    font-size: 20px;
  }

  .service-card p,
  .case-card p,
  .knowledge-card p {
    line-height: 1.58;
  }

  .route-steps {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 4px 2px 10px;
    scroll-padding-inline: 2px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .route-steps::-webkit-scrollbar {
    display: none;
  }

  .route-step {
    flex: 0 0 auto;
    width: auto;
    min-width: 126px;
    min-height: 58px;
    padding: 0 12px;
    font-size: 14px;
    scroll-snap-align: start;
    white-space: nowrap;
  }

  .route-step.is-active {
    transform: none;
  }

  .route-card {
    padding: 22px;
    scroll-margin-top: 94px;
  }

  .route-card h3 {
    font-size: 27px;
  }

  .knowledge-card,
  .knowledge-card-main,
  .knowledge-card-video {
    grid-column: auto;
    min-height: 0;
    padding: 20px;
  }

  .knowledge-card span,
  .case-card > span {
    margin-bottom: 18px;
  }

  .case-card {
    min-height: 0;
    padding: 20px;
  }

  .scene-card {
    min-height: 0;
    padding: 20px;
  }

  .scene-card h3 {
    font-size: 20px;
  }

  .scene-visual {
    height: 112px;
    margin-bottom: 18px;
  }

  .case-note {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 16px;
  }

  .life-guide-visual {
    min-height: 190px;
  }

  .life-card {
    min-width: 108px;
  }

  .case-card dl {
    margin-top: 20px;
  }

  .article-body section {
    padding: 22px;
  }

  .article-body p {
    font-size: 15px;
  }

  .studio-panel {
    padding: 20px;
  }

  .studio-metrics div {
    min-height: 0;
  }

  .trust-card {
    min-height: 0;
    padding: 20px;
  }

  .trust-card span {
    margin-bottom: 20px;
  }

  .faq-aside {
    min-height: 0;
    padding: 20px;
  }

  .faq-aside h3 {
    font-size: 24px;
  }

  .faq-list summary {
    min-height: 0;
    padding: 15px;
  }

  .faq-list p {
    margin-right: 15px;
    margin-left: 15px;
  }

  .lead-form label.full,
  .lead-form .full,
  .form-note {
    grid-column: auto;
  }

  .floating-lead {
    right: auto;
    left: 14px;
    top: auto;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    transform: none;
  }

  .floating-lead-toggle {
    display: grid;
    grid-template-columns: 26px auto;
    width: auto;
    min-width: 118px;
    height: 54px;
    min-height: 54px;
    gap: 7px;
    place-items: center;
    padding: 7px 14px 7px 10px;
    border-radius: 999px;
    font-size: 13px;
    line-height: 1.12;
  }

  .floating-lead-toggle img {
    width: 28px;
    height: 28px;
  }

  .floating-lead-toggle span {
    display: block;
    max-width: 72px;
    overflow: hidden;
    line-height: 1.05;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .floating-lead-toggle span::after {
    display: none;
  }

  .floating-lead-panel {
    left: 0;
    right: auto;
    top: auto;
    bottom: 60px;
    width: min(300px, calc(100vw - 28px));
  }

  .floating-lead.is-open ~ .social-dock,
  .floating-lead:focus-within ~ .social-dock,
  .floating-lead.is-hovered ~ .social-dock {
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(0.96);
    visibility: hidden;
  }

  .floating-lead.is-dismissed ~ .social-dock {
    opacity: 1;
    pointer-events: none;
    transform: none;
    visibility: visible;
  }

  .social-dock {
    right: 14px;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    left: auto;
    top: auto;
    display: flex;
    flex-direction: column-reverse;
    gap: 10px;
    width: auto;
    max-width: none;
    transform: none;
    pointer-events: none;
  }

  .social-dock-hub {
    position: relative;
    z-index: 2;
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 50%;
    background: var(--green);
    color: var(--white);
    box-shadow: 0 14px 34px rgba(23, 63, 53, 0.22);
    cursor: pointer;
    font-size: 13px;
    font-weight: 840;
    pointer-events: auto;
    transition:
      background 180ms ease,
      box-shadow 180ms ease,
      transform 180ms ease;
  }

  .social-dock-hub:hover,
  .social-dock-hub:focus-visible,
  .social-dock.is-open .social-dock-hub {
    background: #0f3f36;
    box-shadow: 0 18px 42px rgba(23, 63, 53, 0.26);
    transform: translateY(-2px);
  }

  .social-dock-item,
  .social-dock-item:hover,
  .social-dock-item:focus-visible {
    display: grid;
    grid-template-columns: 1fr;
    width: 50px;
    height: 50px;
    min-width: 0;
    min-height: 50px;
    place-items: center;
    justify-content: center;
    padding: 6px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(0.94);
    visibility: hidden;
  }

  .social-dock-icon {
    width: 34px;
    height: 34px;
    font-size: 13px;
  }

  .social-dock-text {
    display: none;
    min-width: 0;
    flex-direction: column;
    opacity: 1;
  }

  .social-dock.is-open .social-dock-item,
  .social-dock:focus-within .social-dock-item {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    visibility: visible;
  }

  .social-dock:not(.is-open):not(:focus-within) .social-dock-item {
    display: none;
  }

  .social-dock.is-open .social-dock-item:nth-of-type(2) {
    transition-delay: 24ms;
  }

  .social-dock.is-open .social-dock-item:nth-of-type(3) {
    transition-delay: 48ms;
  }

  .social-dock.is-open .social-dock-item:nth-of-type(4) {
    transition-delay: 72ms;
  }

  .social-dock-text strong {
    font-size: 12px;
    max-width: 56px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .social-dock-text small {
    display: none;
  }

  .social-modal {
    align-items: end;
    padding: 12px;
    padding-bottom: calc(104px + env(safe-area-inset-bottom));
  }

  .social-modal-card {
    grid-template-columns: 1fr;
    gap: 14px;
    max-height: calc(100vh - 112px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px;
  }

  .social-modal-media {
    min-height: 210px;
  }

  .social-modal-media img {
    max-height: 230px;
  }

  .admission-wall-scroll {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  .social-modal-placeholder {
    min-height: 190px;
  }

  .social-modal-copy {
    padding: 4px 4px 2px;
  }

  .social-modal-copy .button {
    width: 100%;
  }

  .admission-viewer {
    align-items: end;
    padding: 12px;
    padding-bottom: calc(104px + env(safe-area-inset-bottom));
  }

  .admission-viewer-card {
    max-height: calc(100vh - 112px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 12px;
  }

  .admission-viewer-head {
    display: grid;
    gap: 8px;
    padding-right: 38px;
  }

  .admission-viewer-link {
    width: max-content;
  }

  .admission-viewer-frame {
    max-height: calc(100vh - 210px);
  }

  .admission-viewer-card img {
    height: auto;
    width: 760px;
    max-width: none;
  }

  .footer-inner {
    width: min(100% - 32px, var(--max));
    padding: 36px 0 26px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .footer-grid > div:first-child {
    grid-column: auto;
  }

  .footer-bottom {
    display: grid;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
  }

  .intro-loader {
    display: none;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 430px) {
  .hero {
    padding-right: 14px;
    padding-left: 14px;
  }

  .hero-label {
    font-size: 12px;
  }

  h1 {
    font-size: 31px;
  }

  .hero-copy {
    font-size: 15px;
  }

  .section,
  .contact-section {
    width: min(100% - 28px, var(--max));
  }

  .ticker-track article {
    width: 270px;
  }

  .floating-lead-toggle {
    width: auto;
    min-width: 112px;
    max-width: calc(100vw - 28px);
    font-size: 12px;
  }

  .social-dock {
    gap: 6px;
  }

  .social-dock-item,
  .social-dock-item:hover,
  .social-dock-item:focus-visible {
    display: grid;
    gap: 5px;
    grid-template-columns: 1fr;
    place-items: center;
    width: 48px;
    height: 48px;
    min-height: 48px;
    padding: 5px;
  }

  .social-dock-icon {
    width: 28px;
    height: 28px;
    font-size: 12px;
  }

  .social-dock-text strong {
    max-width: 46px;
    font-size: 11px;
  }

  .social-dock-text {
    display: none;
  }
}