

[data-opening],
.hero-opening {
  position:relative;
  min-height:calc(100vh - var(--header-h));
  min-height:calc(100svh - var(--header-h));
  display:flex;
  flex-direction:row;
  align-items:stretch;
  background-color:var(--ground);
  overflow:hidden;
  border-bottom:1px solid var(--line);
}

.hero-opening-text {
  flex:0 0 45%;
  max-width:45%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:var(--space-xl) var(--space-l);
  z-index:2;
  background-color:var(--ground);
}

.hero-opening-text h1 {
  font-family:var(--gizi-70f);
  font-size:var(--type-display-2);
  line-height:var(--line-display);
  letter-spacing:-0.02em;
  color:var(--ink);
  margin-bottom:var(--space-s);
  text-wrap:balance;
}

.hero-opening-text .lede {
  font-size:var(--type-body-l);
  line-height:1.55;
  color:var(--ink);
  margin-bottom:var(--space-m);
  max-width:48ch;
}

.hero-opening-meta {
  font-family:var(--gizi-8c0);
  font-size:var(--type-caption);
  color:var(--ink-soft);
  margin-bottom:var(--space-m);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.hero-action-row {
  display:flex;
  align-items:center;
  gap:var(--space-s);

}

.hero-crop-stage {
  flex:0 0 55%;
  max-width:55%;
  position:relative;
  background-color:var(--surface);
  overflow:hidden;
  border-left:1px solid var(--line);
}

[data-model-stage],
.model-stage {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  display:block;
}

[data-model-stage] img[data-model-still] {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;

  object-position:right 68%;
  display:block;
  z-index:1;
  transition:opacity var(--dur-unhurried) var(--ease-standard);
}

[data-model-stage] canvas[data-model-canvas] {
  position:absolute;
  inset:0;
  width:100% !important;
  height:100% !important;
  display:block;
  z-index:2;
  touch-action:pan-y;
  cursor:grab;
}

[data-model-stage] canvas[data-model-canvas]:active { cursor:grabbing; }

[data-model-stage][data-model-live] img[data-model-still] {
  opacity:0;
  pointer-events:none;

}

.model-stage-hint {
  position:absolute;
  bottom:var(--space-s);
  right:var(--space-s);
  z-index:5;
  background-color:#242120;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border:1px solid #383432;
  padding:0.35rem 0.75rem;
  border-radius:var(--radius-xs);
  font-family:var(--gizi-8c0);
  font-size:var(--type-micro);
  color:#ede6e4;
  letter-spacing:0.04em;
  text-transform:uppercase;
  pointer-events:none;
}


.essay-flow {
  width:100%;
  max-width:var(--measure-wide);
  margin-inline:auto;
  padding-inline:var(--space-m);
  padding-block:clamp(3rem, 6vw, 6rem);
  display:block;
}

.essay-body {
  width:100%;
  max-width:var(--measure-prose);
  margin-inline:auto;
}

/* The first section of the continuous essay forms the second screen on desktop */
.essay-flow > .essay-body:first-child {
  max-width:100%;
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(0, 0.85fr);
  column-gap:clamp(2.5rem, 4vw, 5rem);
  row-gap:var(--space-m);
  align-items:start;
}

.essay-flow > .essay-body:first-child > .essay-opener {
  grid-column:1 / -1;
  max-width:58ch;
}

.essay-flow > .essay-body:first-child > .essay-paragraph:first-of-type {
  grid-column:1;
  max-width:var(--measure-ch);
}

.essay-flow > .essay-body:first-child > .essay-inset {
  grid-column:2;
  grid-row:2 / span 3;
  margin-block:0;
}

.essay-flow > .essay-body:first-child > .essay-subhead,
.essay-flow > .essay-body:first-child > .essay-paragraph:not(:first-of-type) {
  grid-column:1;
  max-width:var(--measure-ch);
}

@media (max-width: 960px) {
  .essay-flow > .essay-body:first-child {
    display:block;
    max-width:var(--measure-prose);
  }

  .essay-flow > .essay-body:first-child > .essay-inset { margin-block:var(--space-l); }
}

.essay-opener {
  font-family:var(--gizi-70f);
  font-size:clamp(1.4rem, 1.25rem + 1vw, 2.15rem);
  line-height:1.35;
  color:var(--ink);
  margin-bottom:var(--space-m);
  font-weight:600;
  text-wrap:balance;
}

.essay-subhead {
  font-family:var(--gizi-70f);
  font-size:var(--type-title);
  line-height:1.25;
  color:var(--ink);
  margin-top:var(--space-xl);
  margin-bottom:var(--space-s);
  display:block;
  text-wrap:balance;
}

.essay-subhead-inline {
  font-family:var(--gizi-70f);
  font-size:var(--type-subtitle);
  color:var(--ink);
  margin-top:var(--space-l);
  margin-bottom:var(--space-xs);
  display:block;
}

.essay-paragraph {
  font-size:var(--type-body-l);
  line-height:var(--line-body);
  color:var(--ink);
  margin-bottom:var(--space-m);
  text-wrap:pretty;
}

.essay-lead {
  font-size:clamp(1.125rem, 1.05rem + 0.4vw, 1.35rem);
  line-height:1.55;
  color:var(--ink);
  margin-bottom:var(--space-m);
}

/* Full-measure interrupting photographs */
.essay-break-figure {
  margin-block:var(--space-2xl);
  width:100%;
  max-width:var(--measure-wide);
  position:relative;
  margin-inline:auto;
}

.essay-break-figure img {
  width:100%;
  aspect-ratio:21 / 9;
  object-fit:cover;
  border:1px solid var(--line);
  border-radius:var(--radius-xs);
}

.essay-figure-caption {
  margin-top:var(--space-2xs);
  padding-inline:var(--space-xs);
  font-size:var(--type-caption);
  color:var(--ink-soft);
  font-family:var(--gizi-da5);
  font-style:italic;
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  flex-wrap:wrap;
  gap:var(--space-xs);
}

.essay-figure-caption .spec-pill {
  font-family:var(--gizi-8c0);
  font-size:var(--type-micro);
  font-style:normal;
  text-transform:uppercase;
  color:var(--ink);
  background-color:var(--surface-2);
  padding:2px 6px;
  border-radius:var(--radius-xs);
}

.essay-inset {
  background-color:#242120;
  color:#ede6e4;
  border:1px solid #383432;
  border-top:3px solid var(--accent);
  box-shadow:0 4px 16px rgba(36, 33, 32, 0.14), 0 16px 36px rgba(36, 33, 32, 0.08);
  padding:var(--space-l) var(--space-m);
  margin-block:var(--space-l);
  border-radius:var(--radius-xs);
}

.essay-inset .caption { color:#b5aba8; }

.essay-inset-head {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  flex-wrap:wrap;
  gap:var(--space-2xs);
  margin-bottom:var(--space-xs);
  border-bottom:1px solid #3d3937;
  padding-bottom:var(--space-2xs);
}

.essay-inset-title {
  font-family:var(--gizi-70f);
  font-size:var(--type-subtitle);
  color:#f5efeb;
}

aside.essay-inset span.essay-inset-price,
div.essay-inset span.essay-inset-price,
.essay-inset-price {
  font-family:var(--gizi-8c0);
  font-size:var(--type-body);
  font-weight:500;
  color:#f8dbd9 !important;
}

.essay-inset-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
  gap:var(--space-s);
  margin-top:var(--space-s);
}

.essay-inset-item {
  display:flex;
  flex-direction:column;
}

.essay-inset-label {
  font-family:var(--gizi-8c0);
  font-size:var(--type-micro);
  text-transform:uppercase;
  color:#b5aba8;
  margin-bottom:2px;
}

.essay-inset-val {
  font-family:var(--gizi-8c0);
  font-size:var(--type-body-s);
  color:#f5efeb;
  font-weight:500;
}


.collage-signature {
  margin-block:var(--space-2xl);
  padding-block:var(--space-xl);
  position:relative;
  width:100%;
}

.collage-stage {
  position:relative;
  min-height:520px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.collage-frame {
  position:absolute;
  background-color:var(--surface);
  padding:var(--space-2xs);
  border:1px solid var(--line);
  box-shadow:var(--shadow-card);
  transition:transform var(--dur-deliberate) var(--ease-standard),
              box-shadow var(--dur-deliberate) var(--ease-standard);
}

.collage-frame:hover {
  box-shadow:var(--shadow-overlay);
  z-index:10 !important;
}

.collage-frame-main {
  width:58%;
  max-width:540px;
  left:6%;
  top:5%;
  z-index:2;
  transform:rotate(-1.5deg);
}

.collage-frame-main img {
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:cover;
  border-radius:var(--radius-xs);
}

.collage-frame-overlap {
  width:44%;
  max-width:410px;
  right:8%;
  top:24%;
  z-index:3;
  transform:rotate(2.2deg);
}

.collage-frame-overlap img {
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
  border-radius:var(--radius-xs);
}

.collage-frame-detail {
  width:32%;
  max-width:300px;
  left:32%;
  bottom:0;
  z-index:4;
  transform:rotate(-0.8deg);
}

.collage-frame-detail img {
  width:100%;
  aspect-ratio:3 / 2;
  object-fit:cover;
  border-radius:var(--radius-xs);
}

.collage-annotation {
  position:relative;
  z-index:6;
  max-width:36ch;
  margin-left:auto;
  margin-top:var(--space-m);
  background-color:var(--ground);
  padding:var(--space-s);
  border-left:2px solid var(--accent);
  font-size:var(--type-caption);
  color:var(--ink-soft);
  line-height:var(--line-tight);
}


.doc-card-container {
  padding-block:var(--space-xl);
  max-width:var(--measure-wide);
  margin-inline:auto;
  padding-inline:var(--space-m);
}

.doc-card {
  background-color:var(--surface);
  border:1px solid var(--line);
  box-shadow:var(--shadow-card);
  border-radius:var(--radius-s);
  padding:var(--space-xl) var(--space-l);
  margin-inline:auto;
  max-width:52rem;
}

.doc-card-masthead {
  border-bottom:2px solid var(--ink);
  padding-bottom:var(--space-m);
  margin-bottom:var(--space-l);
}

.doc-card-kicker {
  font-family:var(--gizi-8c0);
  font-size:var(--type-micro);
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--accent);
  margin-bottom:var(--space-3xs);
}

.doc-card-title {
  font-family:var(--gizi-70f);
  font-size:var(--type-display-1);
  color:var(--ink);
  margin-bottom:var(--space-xs);
}

.doc-card-meta-bar {
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-m);
  font-family:var(--gizi-8c0);
  font-size:var(--type-caption);
  color:var(--ink-soft);
}

.doc-card-clause {
  margin-bottom:var(--space-l);
  padding-bottom:var(--space-m);
  border-bottom:1px solid var(--line);
}

.doc-card-clause:last-of-type {
  border-bottom:none;
  margin-bottom:0;
  padding-bottom:0;
}

.doc-clause-header {
  display:flex;
  align-items:baseline;
  gap:var(--space-xs);
  margin-bottom:var(--space-xs);
}

.doc-clause-number {
  font-family:var(--gizi-8c0);
  font-size:var(--type-body-s);
  color:var(--accent);
  font-weight:500;
}

.doc-clause-title {
  font-family:var(--gizi-70f);
  font-size:var(--type-title);
  color:var(--ink);
}

.doc-bahu2d1 {
  font-size:var(--type-body);
  line-height:var(--line-body);
  color:var(--ink);
}

.doc-bahu2d1 ul {
  list-style:disc;
  margin-left:var(--space-m);
  margin-block:var(--space-xs);
}

.doc-bahu2d1 li { margin-bottom:var(--space-3xs); }

.doc-signatures {
  margin-top:var(--space-xl);
  padding-top:var(--space-m);
  border-top:1px solid var(--ink);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-m);
  font-family:var(--gizi-8c0);
  font-size:var(--type-caption);
  color:var(--ink-soft);
}


.glance-page-wrap {
  padding-block:var(--space-xl);
  max-width:var(--measure-wide);
  margin-inline:auto;
  padding-inline:var(--space-m);
}

.glance-header {
  max-width:var(--measure-prose);
  margin-inline:auto;
  margin-bottom:var(--space-l);
}

.glance-header h1 {
  font-family:var(--gizi-70f);
  font-size:var(--type-display-1);
  color:var(--ink);
  margin-bottom:var(--space-xs);
}

.glance-panel {
  background-color:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-s);
  padding:var(--space-l);
  max-width:var(--measure-prose);
  margin-inline:auto;
  margin-bottom:var(--space-xl);
  box-shadow:var(--shadow-subtle);
}

.glance-panel-title {
  font-family:var(--gizi-70f);
  font-size:var(--type-subtitle);
  color:var(--ink);
  margin-bottom:var(--space-s);
  border-bottom:1px solid var(--line);
  padding-bottom:var(--space-2xs);
}

.glance-table {
  width:100%;
  border-collapse:collapse;
}

.glance-table tr { border-bottom:1px solid var(--line); }

.glance-table tr:last-child { border-bottom:none; }

.glance-key {
  font-family:var(--gizi-8c0);
  font-size:var(--type-caption);
  font-weight:500;
  color:var(--ink);
  padding:0.75rem 0.5rem 0.75rem 0;
  width:32%;
  vertical-align:top;
}

.glance-val {
  font-size:var(--type-body-s);
  color:var(--ink-soft);
  padding:0.75rem 0;
  vertical-align:top;
}

.glance-prose {
  max-width:var(--measure-prose);
  margin-inline:auto;
}

.glance-prose h2 {
  font-family:var(--gizi-70f);
  font-size:var(--type-title);
  margin-top:var(--space-xl);
  margin-bottom:var(--space-xs);
  color:var(--ink);
}

.glance-prose p {
  font-size:var(--type-body-l);
  line-height:var(--line-body);
  margin-bottom:var(--space-m);
}


.disclosure-container {
  padding-block:var(--space-xl);
  max-width:var(--measure-wide);
  margin-inline:auto;
  padding-inline:var(--space-m);
}

.disclosure-masthead {
  max-width:var(--measure-prose);
  margin-inline:auto;
  margin-bottom:var(--space-l);
}

.disclosure-masthead h1 {
  font-family:var(--gizi-70f);
  font-size:var(--type-display-1);
  color:var(--ink);
  margin-bottom:var(--space-xs);
}

.disclosure-controls {
  max-width:var(--measure-prose);
  margin-inline:auto;
  margin-bottom:var(--space-m);
  display:flex;
  align-items:center;
  gap:var(--space-s);
}

.disclosure-btn {
  font-family:var(--gizi-8c0);
  font-size:var(--type-caption);
  color:var(--ink-soft);
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
  background:none;
  border:none;
  padding:4px;
  transition:color var(--dur-tactile) var(--ease-out);
}

.disclosure-btn:hover { color:var(--accent); }

.disclosure-stack {
  max-width:var(--measure-prose);
  margin-inline:auto;
  display:flex;
  flex-direction:column;
  gap:var(--space-xs);
}

details.disclosure-item {
  background-color:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-xs);
  transition:border-color var(--dur-tactile) var(--ease-out),
              box-shadow var(--dur-tactile) var(--ease-out);
}

details.disclosure-item[open] {
  border-color:var(--ink);
  box-shadow:var(--shadow-subtle);
}

summary.disclosure-summary {
  padding:var(--space-s) var(--space-m);
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-s);
  font-family:var(--gizi-70f);
  font-size:var(--type-subtitle);
  color:var(--ink);
  transition:background-color var(--dur-tactile) var(--ease-out);
}

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

summary.disclosure-summary:hover { background-color:var(--surface-2); }

.disclosure-icon {
  width:18px;
  height:18px;
  flex-shrink:0;
  transition:transform var(--dur-tactile) var(--ease-standard);
}

details.disclosure-item[open] .disclosure-icon { transform:rotate(180deg); }

.disclosure-content {
  padding:0 var(--space-m) var(--space-m) var(--space-m);
  border-top:1px solid var(--line);
  padding-top:var(--space-s);
  font-size:var(--type-body);
  line-height:var(--line-body);
  color:var(--ink);
}

.disclosure-content p:last-child { margin-bottom:0; }


.spec-matrix-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:var(--space-m);
  margin-block:var(--space-l);
}

.spec-card {
  background-color:var(--surface);
  border:1px solid var(--line);
  padding:var(--space-s);
  border-radius:var(--radius-xs);
}

.spec-card-head {
  font-family:var(--gizi-8c0);
  font-size:var(--type-micro);
  text-transform:uppercase;
  color:var(--accent);
  letter-spacing:0.05em;
  margin-bottom:var(--space-3xs);
}

.spec-card-title {
  font-family:var(--gizi-70f);
  font-size:var(--type-body-l);
  color:var(--ink);
  margin-bottom:var(--space-xs);
}

.spec-card-desc {
  font-size:var(--type-body-s);
  color:var(--ink-soft);
  line-height:var(--line-tight);
}

/* Workshop Syllabus & Cohort Blocks */
.workshop-syllabus {
  margin-block:var(--space-l);
  border-top:1px solid var(--line);
}

.syllabus-row {
  display:grid;
  grid-template-columns:100px 1fr;
  gap:var(--space-m);
  padding-block:var(--space-s);
  border-bottom:1px solid var(--line);
}

.syllabus-time {
  font-family:var(--gizi-8c0);
  font-size:var(--type-caption);
  color:var(--accent);
  font-weight:500;
}

.syllabus-topic {
  display:flex;
  flex-direction:column;
}

.syllabus-topic-title {
  font-family:var(--gizi-70f);
  font-size:var(--type-body-l);
  color:var(--ink);
  margin-bottom:4px;
}

.syllabus-topic-desc {
  font-size:var(--type-body-s);
  color:var(--ink-soft);
}

.contact-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--space-xl);
  margin-block:var(--space-l);
}

.contact-meta-card {
  background-color:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius-xs);
  padding:var(--space-m);
  display:flex;
  flex-direction:column;
  gap:var(--space-s);
}

.contact-meta-group {
  display:flex;
  flex-direction:column;
}

.contact-meta-label {
  font-family:var(--gizi-8c0);
  font-size:var(--type-micro);
  text-transform:uppercase;
  color:var(--ink-soft);
  letter-spacing:0.05em;
  margin-bottom:2px;
}

.contact-meta-val {
  font-family:var(--gizi-da5);
  font-size:var(--type-body);
  color:var(--ink);
}

.contact-meta-val a {
  text-decoration:underline;
  text-underline-offset:3px;
}

.contact-meta-val a:hover { color:var(--accent); }

/* Confirmation / Thanks Page */
.confirmation-card {
  background-color:var(--surface);
  border:1px solid var(--line);
  border-top:4px solid var(--accent);
  border-radius:var(--radius-s);
  padding:var(--space-xl) var(--space-l);
  max-width:var(--measure-prose);
  margin:var(--space-xl) auto;
  box-shadow:var(--shadow-card);
}

.confirmation-card h1 {
  font-family:var(--gizi-70f);
  font-size:var(--type-title);
  color:var(--ink);
  margin-bottom:var(--space-xs);
}

.confirmation-lead {
  font-size:var(--type-body-l);
  color:var(--ink);
  margin-bottom:var(--space-m);
}

.ticket-receipt-box {
  background-color:var(--ground);
  border:1px dashed var(--line);
  padding:var(--space-s);
  border-radius:var(--radius-xs);
  margin-block:var(--space-m);
  font-family:var(--gizi-8c0);
  font-size:var(--type-body-s);
  color:var(--ink);
}

.error-page-wrap {
  padding-block:var(--space-2xl);
  max-width:var(--measure-prose);
  margin-inline:auto;
  padding-inline:var(--space-m);
  text-align:center;
}

.error-badge {
  font-family:var(--gizi-8c0);
  font-size:var(--type-display-1);
  color:var(--accent);
  margin-bottom:var(--space-xs);
}


@media (max-width: 1024px) {
  .hero-opening-text {
    flex:0 0 50%;
    max-width:50%;
    padding:var(--space-l) var(--space-m);
  }

  .hero-crop-stage {
    flex:0 0 50%;
    max-width:50%;
  }

  .collage-stage { min-height:440px; }

  .collage-frame-main { width:62%; }

  .collage-frame-overlap { width:48%; }

  .contact-grid {
    grid-template-columns:1fr;
    gap:var(--space-l);
  }
}

@media (max-width: 768px) {
  [data-opening],
  .hero-opening {
    flex-direction:column;
    min-height:auto;
  }

  .hero-opening-text {
    flex:0 0 100%;
    max-width:100%;
    padding:clamp(2rem, 5vw, 3rem) var(--space-s) var(--space-l);
  }

  .hero-crop-stage {
    flex:0 0 100%;
    max-width:100%;
    width:100%;
    aspect-ratio:16 / 9;
    height:auto;
    min-height:0;
    border-left:none;
    border-top:1px solid var(--line);
    order:2;
  }

  .essay-break-figure {
    width:100%;
    left:auto;
    transform:none;
    margin-block:var(--space-l);
  }

  .essay-break-figure img { aspect-ratio:16 / 9; }

  .collage-stage { min-height:380px; }

  .collage-frame-main {
    width:75%;
    left:2%;
    top:0;
  }

  .collage-frame-overlap {
    width:58%;
    right:2%;
    top:28%;
  }

  .collage-frame-detail { display:none; }

  .doc-card { padding:var(--space-l) var(--space-s); }

  .doc-signatures { grid-template-columns:1fr; }

  .syllabus-row {
    grid-template-columns:1fr;
    gap:var(--space-2xs);
  }
}

@media (max-width: 480px) {
  .hero-crop-stage {
    height:auto;
    aspect-ratio:16 / 9;
  }

  .glance-key { width:40%; }

  .collage-stage { min-height:320px; }

  .collage-frame-main { width:82%; }

  .collage-frame-overlap { width:66%; }
}

@media (max-width: 320px) {
  .hero-opening-text { padding-inline:var(--space-2xs); }

  .hero-opening-text h1 { font-size:1.55rem; }

  .doc-card { padding:var(--space-m) var(--space-2xs); }

  .glance-table { display:block; }

  .glance-table tr {
    display:flex;
    flex-direction:column;
    padding-block:var(--space-2xs);
  }

  .glance-key,
  .glance-val {
    width:100%;
    padding:2px 0;
  }
}


@media print {
  .site-rail,
  .site-header,
  .site-footer,
  .chat-launcher,
  .chat-panel,
  .cookie-bar,
  .disclosure-controls { display:none !important; }

  body {
    background:#ffffff !important;
    color:#000000 !important;
  }

  details.disclosure-item {
    border:1px solid #ccc !important;
    break-inside:avoid;
    margin-bottom:1rem;
  }

  details.disclosure-item[open] { box-shadow:none !important; }

  summary.disclosure-summary { background:#eee !important; }

  .disclosure-content { display:block !important; }

  .doc-card {
    box-shadow:none !important;
    border:1px solid #000 !important;
    padding:0 !important;
  }
}
