:root {
  --ink:#292e2d;
  --body:#555d5a;
  --accent:#733d36;
  --accent-dark:#572c27;
  --line:#dcded8;
  --paper:#f4f5f1;
  --white:#fff;
  --serif:'Yu Mincho','Hiragino Mincho ProN','Noto Serif JP',serif;
  --sans:'Yu Gothic','Hiragino Kaku Gothic ProN','Noto Sans JP',sans-serif;
  --max:1232px
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body {
  margin:0;
  color:var(--ink);
  background:var(--white);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.85;
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit;
  text-decoration:none
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
img,svg {
  max-width:100%;
  display:block
}
figure,p,h1,h2,h3,h4 {
  margin:0
}
button {
  color:inherit
}
::selection {
  background:#eadbd6;
  color:#292e2d
}
:focus-visible {
  outline:3px solid #ab695a;
  outline-offset:5px
}
.container {
  width:min(calc(100% - 112px),var(--max));
  margin-inline:auto
}
.section {
  padding:112px 0
}
.section-label {
  font-size:14px;
  font-weight:700;
  letter-spacing:.1em;
  color:var(--accent);
  margin-bottom:20px
}
h1,h2 {
  font-family:var(--serif);
  font-weight:600;
  line-height:1.6;
  letter-spacing:.03em
}
h2 {
  font-size:36px
}
h3 {
  font-size:22px;
  font-weight:600;
  line-height:1.6
}
.section-intro {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:end;
  margin-bottom:52px
}
.section-description {
  font-size:16px;
  color:var(--body);
  line-height:2;
  max-width:540px
}
.button {
  background:var(--accent);
  color:white;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:38px;
  min-height:58px;
  padding:14px 26px;
  border:1px solid transparent;
  border-radius:2px;
  font-size:15px;
  font-weight:700;
  letter-spacing:.035em;
  transition:background .2s,color .2s
}
.button:hover {
  background:var(--accent-dark)
}
.button>span[aria-hidden] {
  font-size:21px;
  font-weight:400;
  line-height:1
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:20px;
  font-size:14px;
  font-weight:600;
  border:0;
  border-bottom:1px solid #bfc4bd;
  padding:6px 0;
  background:none;
  transition:color .2s
}
.text-link:hover {
  color:var(--accent)
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
.skip-link {
  position:fixed;
  left:16px;
  top:-100px;
  z-index:300;
  background:white;
  padding:10px 18px
}
.skip-link:focus {
  top:12px
}
/* Header */
.site-header {
  position:sticky;
  top:0;
  z-index:50;
  background:#fff;
  border-bottom:1px solid #e8e9e4
}
.header-inner {
  height:94px;
  width:min(calc(100% - 80px),1360px);
  margin:auto;
  display:flex;
  align-items:center;
  gap:30px
}
.brand {
  display:flex;
  align-items:center;
  gap:15px
}
.brand-symbol {
  font-family:Georgia,serif;
  font-size:45px;
  line-height:1;
  letter-spacing:-.23em;
  display:flex;
  align-items:center;
  color:var(--accent);
  width:50px;
  height:50px;
  padding-bottom:9px
}
.brand-symbol>span {
  font-size:35px;
  margin-top:13px
}
.brand-type {
  display:block;
  font-family:Georgia,serif;
  font-size:16px;
  letter-spacing:.08em;
  white-space:nowrap
}
.brand-type small {
  display:block;
  font-family:var(--sans);
  font-size:10px;
  letter-spacing:.06em;
  margin-top:2px
}
.desktop-nav {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:27px;
  font-size:13px;
  font-weight:600
}
.desktop-nav a {
  padding:10px 0
}
.desktop-nav a:hover {
  color:var(--accent)
}
.header-cta {
  display:flex;
  align-items:center;
  gap:28px;
  background:var(--accent);
  color:white;
  min-height:44px;
  padding:8px 18px;
  font-size:13px;
  font-weight:700;
  border-radius:2px
}
.header-cta:hover {
  background:var(--accent-dark)
}
.menu-toggle {
  display:none
}
.mobile-nav[hidden] {
  display:none
}
/* First view */
.hero {
  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:52px;
  align-items:center;
  padding-block:54px
}
.hero-question {
  font-size:14px;
  letter-spacing:.025em;
  margin-bottom:27px;
  color:var(--body)
}
h1 {
  font-size:58px;
  letter-spacing:.04em;
  line-height:1.52
}
.hero-service {
  font-size:20px;
  font-weight:600;
  letter-spacing:.03em;
  margin-top:27px
}
.hero-description {
  font-size:15px;
  line-height:2.05;
  color:var(--body);
  margin-top:20px
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:30px;
  margin-top:34px
}
.hero-facts {
  font-size:11px;
  color:var(--body);
  margin-top:24px;
  white-space:nowrap
}
.hero-facts span {
  padding:0 7px;
  color:#a8aba6
}
.hero-photo {
  position:relative;
  height:590px;
  overflow:hidden;
  background:#dddcd5
}
.hero-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 70%
}
.hero-photo figcaption {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:#fbfbf9;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:15px 20px;
  font-size:12px
}
.caption-number {
  font-family:Georgia,serif;
  font-size:20px;
  letter-spacing:.06em;
  color:var(--accent)
}
.intro-line {
  display:flex;
  align-items:center;
  gap:34px;
  padding-block:22px;
  border-top:1px solid var(--line);
  font-size:13px
}
.intro-line p:first-child {
  flex-shrink:0
}
.intro-line strong {
  margin-left:15px;
  font-size:16px;
  letter-spacing:.06em;
  font-weight:600
}
.intro-line p:nth-child(2) {
  color:var(--body)
}
.separator {
  padding-inline:14px;
  color:#b8bdb5
}
.intro-line>a {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:16px;
  font-size:12px;
  white-space:nowrap
}
.mobile-break {
  display:none
}
/* A diagram rather than a sequence of cards */
.approach-section {
  background:var(--paper)
}
.approach-chart {
  border-top:1px solid var(--line)
}
.approach-row {
  display:grid;
  grid-template-columns:180px 1fr 240px;
  align-items:center;
  gap:30px;
  min-height:116px;
  border-bottom:1px solid var(--line)
}
.approach-row h3 {
  font-family:var(--sans);
  font-size:16px;
  font-weight:600
}
.approach-row>p {
  font-size:14px;
  color:#69716e;
  justify-self:end;
  width:220px
}
.approach-path,.our-path {
  display:flex;
  align-items:center;
  gap:13px;
  font-size:14px
}
.path-node {
  border:1px solid #c7ccc4;
  background:transparent;
  min-width:65px;
  padding:9px 8px;
  text-align:center;
  white-space:nowrap
}
.muted-node {
  border-style:dashed;
  color:#8a918c
}
.path-line {
  height:1px;
  min-width:20px;
  flex:1;
  background:#bac1b8;
  position:relative
}
.path-line:after {
  content:'';
  position:absolute;
  right:0;
  top:-3px;
  border-right:1px solid #bac1b8;
  border-top:1px solid #bac1b8;
  width:6px;
  height:6px;
  transform:rotate(45deg)
}
.path-caption {
  font-size:13px;
  white-space:nowrap
}
.our-approach {
  min-height:152px;
  color:var(--accent);
  border-bottom:2px solid var(--accent)
}
.our-approach h3 {
  font-size:18px;
  line-height:1.6
}
.our-approach h3 small {
  font-size:12px;
  font-weight:500;
  display:block;
  margin-bottom:7px
}
.our-approach>p {
  color:var(--accent);
  font-weight:600
}
.decision-pair {
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
  border:1px solid var(--accent);
  padding:13px 10px
}
.decision-pair strong {
  font-weight:600
}
.decision-pair>span {
  font-size:23px;
  font-weight:400
}
.decision-note {
  font-size:14px;
  font-weight:600;
  white-space:nowrap;
  text-align:center
}
.decision-note small {
  font-size:10px;
  display:block;
  font-weight:400;
  margin-top:4px
}
.our-path .path-node {
  border-color:var(--accent)
}
.our-path .path-line,.our-path .path-line:after {
  background:var(--accent);
  border-color:var(--accent)
}
.our-path .path-line:after {
  background:transparent
}
.approach-close {
  text-align:center;
  font-family:var(--serif);
  font-size:23px;
  letter-spacing:.03em;
  margin-top:40px
}
.approach-close>span {
  color:var(--accent)
}
/* Projects */
.project-intro {
  margin-bottom:54px
}
.sample-note {
  margin-top:18px;
  font-size:12px;
  color:#747b77;
  line-height:1.9
}
.featured-project {
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:52px;
  align-items:center;
  padding-bottom:50px;
  border-bottom:1px solid var(--line)
}
.project-visual {
  padding:29px;
  background:var(--paper)
}
.app-window {
  background:white;
  border:1px solid #d5d9d2;
  border-radius:5px;
  box-shadow:0 12px 25px rgba(27,39,29,.055);
  overflow:hidden
}
.window-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:11px 16px;
  border-bottom:1px solid #e4e7e1;
  font-size:12px;
  min-height:42px;
  color:#4f5851
}
.window-dots {
  font-size:8px;
  letter-spacing:3px;
  color:#c6cbc4;
  line-height:1
}
.window-detail {
  font-size:10px;
  color:#7a827a;
  white-space:nowrap
}
.notebook-layout {
  display:grid;
  grid-template-columns:175px 1fr;
  min-height:400px
}
.notebook-sidebar {
  background:#f7f8f4;
  border-right:1px solid #e3e6de;
  padding:25px 15px 15px;
  display:flex;
  flex-direction:column
}
.app-wordmark {
  font-size:19px;
  font-family:var(--serif);
  line-height:1.5;
  margin-bottom:26px
}
.app-wordmark>span {
  display:block;
  font-size:10px;
  font-family:var(--sans);
  margin-top:8px;
  color:#7b847b
}
.side-selected {
  font-size:12px;
  background:#e8ece2;
  padding:9px 10px;
  display:flex;
  justify-content:space-between;
  color:#3e5141
}
.side-heading {
  font-size:9px;
  margin-top:25px;
  margin-bottom:14px;
  color:#7c867c
}
.document-item {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:17px;
  font-size:10px
}
.document-item i {
  font-size:9px;
  font-style:normal;
  border:1px solid #c2cbbd;
  width:22px;
  height:27px;
  display:grid;
  place-items:center;
  color:#768371
}
.document-item small {
  display:block;
  font-size:8px;
  color:#7f877d
}
.sidebar-bottom {
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  font-size:10px;
  border-top:1px solid #dce0d6;
  padding-top:12px
}
.notebook-main {
  padding:21px 24px 18px
}
.app-breadcrumb {
  font-size:9px;
  color:#8a9085
}
.notebook-main h4 {
  font-family:var(--serif);
  font-size:19px;
  font-weight:600;
  margin:22px 0 20px
}
.question-bubble {
  font-size:11px;
  background:#f2f3ed;
  border-radius:8px 8px 2px 8px;
  padding:12px 13px;
  margin-left:auto;
  max-width:235px
}
.answer {
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:24px;
  font-size:10px;
  line-height:1.9
}
.answer-mark {
  font-family:Georgia,serif;
  border:1px solid #adbca4;
  display:grid;
  place-items:center;
  flex-shrink:0;
  width:22px;
  height:22px;
  color:#64735c
}
.answer strong {
  font-size:11px;
  font-weight:600
}
.answer p {
  margin-top:7px
}
.source-ref {
  display:inline-block;
  font-size:9px;
  color:#758368;
  border-bottom:1px solid #c1cbb9;
  margin-top:8px
}
.evaluation-note {
  background:#fbf8ed;
  border-left:2px solid #b8a572;
  padding:10px 14px;
  margin-top:23px
}
.evaluation-note>span {
  font-size:9px;
  color:#847751
}
.evaluation-note p {
  font-size:12px;
  font-family:var(--serif);
  margin-top:3px;
  line-height:1.65
}
.evaluation-note small {
  font-size:8px;
  color:#998963
}
.mock-input {
  font-size:10px;
  color:#8a9286;
  margin-top:20px;
  border:1px solid #dde1d6;
  padding:9px 11px;
  display:flex;
  justify-content:space-between;
  border-radius:3px
}
.project-number {
  font-family:Georgia,serif;
  font-size:26px;
  color:var(--accent);
  line-height:1.3;
  margin-bottom:17px
}
.project-number>span {
  font-family:var(--sans);
  font-size:12px;
  margin-left:15px;
  letter-spacing:.06em
}
.project-story h3 {
  font-family:var(--serif);
  font-size:30px;
  line-height:1.7
}
.project-story>p:not(.project-number) {
  font-size:15px;
  color:var(--body);
  margin-top:20px;
  line-height:2
}
.project-takeaway {
  border-top:1px solid var(--line);
  margin:26px 0 0;
  padding-top:20px
}
.project-takeaway dt {
  font-size:12px;
  color:var(--accent);
  font-weight:600;
  margin:0 0 5px
}
.project-takeaway dd {
  font-size:14px;
  line-height:1.9;
  margin:0 0 18px
}
.project-takeaway dd:last-child {
  margin-bottom:0
}
.secondary-projects {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  margin-top:50px
}
.secondary-project .project-visual {
  height:351px;
  display:flex;
  align-items:center
}
.secondary-project .app-window {
  width:100%
}
.secondary-description {
  padding:29px 0 0
}
.secondary-description h3 {
  font-family:var(--serif);
  font-size:23px;
  line-height:1.7
}
.secondary-description>p:not(.project-number) {
  font-size:14px;
  color:var(--body);
  margin-top:14px;
  line-height:1.95;
  max-width:540px
}
.secondary-description .small-outcome {
  font-size:12px!important;
  color:var(--ink)!important;
  padding-top:13px;
  border-top:1px solid var(--line);
  margin-top:20px!important
}
.data-toolbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:17px 20px 0;
  font-size:11px
}
.data-toolbar strong {
  font-size:13px;
  font-weight:600
}
.data-toolbar>span {
  font-size:10px;
  color:#7d847b
}
.data-chart {
  width:100%;
  padding:8px 15px 0
}
.grid-lines {
  fill:none;
  stroke:#e4e7e2;
  stroke-width:1
}
.axis-labels {
  font:12px var(--sans);
  fill:#768073
}
.trend-line {
  fill:none;
  stroke:#b3bca9;
  stroke-width:2;
  stroke-dasharray:5 4
}
.plot-points {
  fill:#627b68;
  stroke:#fff;
  stroke-width:2
}
.data-insight {
  border-top:1px solid #e4e7e0;
  padding:10px 16px;
  font-size:10px;
  color:#54624e
}
.data-insight>span {
  font-size:9px;
  color:#828b7a;
  margin-right:6px
}
.web-visual {
  background:#f3f1ee
}
.club-brand {
  font-weight:700;
  letter-spacing:.06em;
  font-size:13px
}
.club-brand>span {
  font-weight:400;
  font-size:9px;
  letter-spacing:0;
  margin-left:10px;
  color:#8b8176
}
.club-inner {
  padding:14px 22px 18px
}
.club-tabs {
  display:flex;
  gap:22px;
  font-size:10px;
  color:#9b938a;
  border-bottom:1px solid #e9e5df
}
.club-tabs>span {
  padding:0 0 8px
}
.club-tabs .selected {
  border-bottom:2px solid #8b6352;
  color:#6a493b
}
.club-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:16px
}
.club-title h4 {
  font-size:16px;
  font-weight:600
}
.club-title>span {
  font-size:10px;
  color:#90887b
}
.event-row {
  display:flex;
  align-items:center;
  gap:17px;
  padding:14px 0;
  border-bottom:1px solid #e9e5df
}
.event-date {
  font-family:Georgia,serif;
  font-size:25px;
  line-height:1;
  color:#8b6352;
  min-width:37px
}
.event-date small {
  display:block;
  font-family:var(--sans);
  font-size:8px;
  line-height:1.5;
  margin-top:5px;
  color:#958a7c
}
.event-row strong {
  font-size:11px;
  font-weight:600
}
.event-row p {
  font-size:9px;
  color:#9c9388
}
.event-state {
  font-size:8px;
  margin-left:auto;
  color:#88745c;
  border:1px solid #d9d0c5;
  padding:2px 6px;
  border-radius:2px
}
.club-memo {
  font-size:9px;
  color:#746959;
  margin-top:13px
}
.club-memo span {
  color:#9a8a77;
  margin-right:10px
}
.theme-line {
  margin-top:43px;
  border-top:1px solid var(--line);
  padding-top:23px;
  display:flex;
  align-items:baseline;
  gap:32px;
  font-size:14px;
  color:var(--body)
}
.theme-line>span {
  font-size:12px;
  color:var(--accent);
  white-space:nowrap
}
/* Roadmap and weekly guidance */
.roadmap-section {
  background:var(--paper)
}
.roadmap {
  list-style:none;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  margin:60px 0 20px;
  padding:0;
  gap:0
}
.roadmap li {
  position:relative;
  padding:0 18px 0 0
}
.roadmap li+li {
  padding-left:22px
}
.roadmap li:before {
  content:'';
  position:absolute;
  top:69px;
  left:0;
  right:0;
  border-top:1px solid #b8c0b6
}
.roadmap li:last-child:before {
  right:22px
}
.week {
  font-family:Georgia,serif;
  font-size:35px;
  color:var(--accent);
  line-height:1;
  display:block;
  position:relative;
  padding-bottom:35px
}
.week:after {
  content:'';
  position:absolute;
  bottom:-2px;
  left:0;
  width:7px;
  height:7px;
  border-radius:50%;
  border:1px solid var(--accent);
  background:var(--paper)
}
.week small {
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:.03em;
  margin-left:6px
}
.roadmap h3 {
  font-size:16px;
  font-weight:600;
  margin:26px 0 10px
}
.roadmap li p {
  font-size:12px;
  line-height:1.95;
  color:var(--body);
  min-height:52px
}
.milestone {
  display:inline-block;
  font-size:10px;
  border-bottom:1px solid #ccd3c8;
  color:#788271;
  margin-top:22px;
  padding-bottom:2px
}
.roadmap-note {
  font-size:12px;
  color:#7d847a;
  margin-top:31px
}
.weekly-flow {
  margin-top:50px;
  background:white;
  border-top:2px solid #9ea995;
  display:grid;
  grid-template-columns:240px 1fr;
  gap:44px;
  padding:35px
}
.weekly-heading .section-label {
  font-size:12px;
  margin-bottom:9px
}
.weekly-heading h3 {
  font-family:var(--serif);
  font-size:21px
}
.weekly-diagram {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px
}
.flow-role {
  display:block;
  font-size:10px;
  color:#7c8577;
  margin-bottom:12px
}
.weekly-diagram strong {
  font-size:14px;
  font-weight:600;
  white-space:nowrap
}
.weekly-diagram p {
  font-size:10px;
  color:var(--body);
  margin-top:7px
}
.flow-arrow {
  font-family:Georgia,serif;
  font-size:23px;
  color:#a2ad99
}
.parent-note {
  display:flex;
  gap:30px;
  margin-top:25px;
  align-items:baseline;
  font-size:13px;
  color:var(--body)
}
.parent-note>span {
  color:var(--accent);
  font-size:12px;
  white-space:nowrap
}
/* Instructor */
.mentor-grid {
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:130px
}
.mentor-portrait {
  display:flex;
  align-items:flex-end;
  gap:22px;
  margin-top:38px
}
.mentor-portrait img {
  width:200px;
  height:200px;
  object-fit:cover
}
.mentor-portrait figcaption {
  font-size:14px;
  white-space:nowrap;
  letter-spacing:.06em
}
.mentor-portrait figcaption>span {
  display:block;
  font-size:10px;
  color:#7b827a;
  letter-spacing:0;
  margin-top:4px
}
.mentor-pretitle {
  font-size:13px;
  color:#727970;
  margin:8px 0 16px
}
.mentor-details>h3 {
  font-family:var(--serif);
  font-size:33px;
  letter-spacing:.1em;
  display:flex;
  align-items:baseline;
  gap:25px
}
.mentor-details>h3 span {
  font-family:Georgia,serif;
  font-size:14px;
  font-weight:400;
  letter-spacing:.025em;
  color:#82877d
}
.mentor-message {
  font-size:15px;
  line-height:2.1;
  color:var(--body);
  margin-top:23px
}
.bio-list {
  margin:28px 0 19px;
  border-top:1px solid var(--ink)
}
.bio-list>div {
  display:grid;
  grid-template-columns:90px 1fr;
  gap:25px;
  border-bottom:1px solid var(--line);
  padding:15px 0
}
.bio-list dt {
  font-size:12px;
  color:#7b8177
}
.bio-list dd {
  font-size:14px;
  line-height:1.9;
  margin:0
}
.profile-link {
  font-size:13px
}
.mentor-footnote {
  font-size:11px;
  color:#7f857d;
  margin-top:22px;
  line-height:1.9
}
/* Price */
.pricing-section {
  background:#303a36;
  color:white
}
.pricing-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:110px
}
.pricing-section .section-label {
  color:#d7c7b6
}
.pricing-section h2 {
  font-size:38px
}
.pricing-intro>p:last-child {
  font-size:15px;
  color:#c6cdc6;
  line-height:2.15;
  margin-top:25px
}
.price-line {
  display:flex;
  align-items:baseline;
  gap:16px;
  line-height:1.1
}
.price-line>span {
  font-size:16px
}
.price-line>strong {
  font-family:Georgia,serif;
  font-size:69px;
  font-weight:400;
  letter-spacing:-.02em;
  font-variant-numeric:lining-nums
}
.price-line small {
  display:block;
  font-size:11px;
  margin-top:8px;
  color:#c6cdc6
}
.price-caption {
  font-size:14px;
  margin-top:18px;
  color:#e0e5dd
}
.included-heading {
  margin-top:32px;
  padding-top:22px;
  border-top:1px solid #6b756b;
  font-size:12px;
  color:#b4c0b3
}
.included-list {
  list-style:none;
  margin:12px 0 0;
  padding:0
}
.included-list li {
  position:relative;
  padding:10px 0 10px 20px;
  border-bottom:1px solid #5a665c;
  font-size:14px
}
.included-list li:before {
  content:'✓';
  position:absolute;
  left:0;
  color:#c7d0c0;
  font-size:12px
}
.price-total {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-top:24px;
  font-size:13px
}
.price-total strong {
  font-size:18px;
  letter-spacing:.035em;
  font-weight:500;
  white-space:nowrap
}
.price-total strong>span {
  font-size:11px
}
.price-note {
  font-size:11px;
  color:#bdc7ba;
  line-height:1.9;
  margin:17px 0 27px
}
.button-light {
  background:white;
  color:#303a36;
  min-width:280px
}
.button-light:hover {
  background:#e8ede5
}
/* Questions */
.faq-grid {
  display:grid;
  grid-template-columns:1fr 1.8fr;
  gap:70px
}
.faq-list {
  border-top:1px solid #a9b3a4
}
.faq-list details {
  border-bottom:1px solid var(--line)
}
.faq-list summary {
  list-style:none;
  font-size:15px;
  font-weight:600;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:22px;
  padding:24px 0;
  cursor:pointer
}
.faq-list summary::-webkit-details-marker {
  display:none
}
.faq-list summary>span {
  font-size:19px;
  font-weight:400;
  transition:transform .2s;
  color:var(--accent)
}
.faq-list details[open] summary>span {
  transform:rotate(45deg)
}
.faq-list details[open] summary {
  padding-bottom:12px
}
.faq-list details>p {
  color:var(--body);
  font-size:14px;
  line-height:2;
  padding:0 35px 24px 0
}
/* Consultation */
.consultation-section {
  background:#f4f3ef
}
.consultation-grid {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:100px
}
.consultation-copy h2 {
  font-size:48px;
  line-height:1.55
}
.consultation-copy>p:not(.section-label) {
  font-size:15px;
  color:var(--body);
  line-height:2.15;
  margin-top:28px
}
.consultation-agenda {
  margin-top:37px;
  border-top:1px solid #cfcfc4;
  padding-top:21px
}
.consultation-agenda>span {
  font-size:12px;
  color:var(--accent)
}
.consultation-agenda ol {
  padding-left:20px;
  font-size:13px;
  color:var(--body);
  line-height:2.2;
  margin-top:9px
}
.consultation-form {
  background:white;
  padding:34px 36px;
  align-self:start
}
.form-heading {
  font-family:var(--serif);
  font-size:23px;
  margin-bottom:9px
}
.form-availability {
  font-size:12px;
  color:#7f7666;
  margin-bottom:23px
}
.form-row {
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:20px
}
.field {
  margin-bottom:20px
}
.field label {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  font-weight:600;
  margin-bottom:9px
}
.field label>span {
  font-size:10px;
  font-weight:400;
  color:var(--accent);
  background:#f6eeea;
  padding:0 5px
}
.field label>small {
  font-size:10px;
  color:#96968a;
  font-weight:400
}
.field input,.field select,.field textarea {
  width:100%;
  min-width:0;
  border:1px solid #cdd1c6;
  background:#fff;
  border-radius:2px;
  min-height:48px;
  padding:10px 12px;
  font-size:16px;
  line-height:1.65;
  color:var(--ink);
  transition:border-color .2s
}
.field textarea {
  resize:vertical;
  min-height:126px;
  font-size:14px
}
.field input:focus,.field select:focus,.field textarea:focus {
  border-color:var(--accent)
}
::placeholder {
  color:#909588;
  opacity:1
}
.field [aria-invalid=true] {
  border-color:#a33725
}
.field-error {
  color:#9e3223;
  font-size:12px;
  line-height:1.6;
  margin-top:5px
}
.field-error:empty {
  display:none
}
.consent {
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:12px;
  line-height:1.85;
  cursor:pointer
}
.consent input {
  accent-color:var(--accent);
  width:16px;
  height:16px;
  margin:3px 0;
  flex-shrink:0
}
.inline-link {
  font-size:inherit;
  border:0;
  background:none;
  padding:0;
  text-decoration:underline;
  text-underline-offset:4px;
  text-decoration-color:#c2c6bb
}
.inline-link:hover {
  color:var(--accent)
}
.submit-button {
  width:100%;
  margin-top:22px
}
.form-caption {
  font-size:10px;
  color:#858b7c;
  line-height:1.8;
  margin-top:14px;
  text-align:center
}
.form-status {
  font-size:13px;
  margin-top:12px;
  color:var(--accent)
}
.form-status:empty {
  display:none
}
.honeypot {
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden
}
/* Footer and dialogs */
.site-footer {
  padding:43px 0 24px;
  background:#fff
}
.footer-main {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  padding-bottom:30px;
  border-bottom:1px solid var(--line)
}
.footer-nav {
  display:flex;
  gap:27px;
  font-size:12px;
  color:var(--body)
}
.footer-bottom {
  display:flex;
  align-items:center;
  gap:32px;
  font-size:11px;
  color:#767d70;
  padding-top:22px
}
.footer-bottom small {
  margin-left:auto;
  font-size:10px
}
.site-dialog {
  border:1px solid var(--line);
  padding:0;
  color:var(--ink);
  width:min(620px,calc(100% - 32px));
  max-height:calc(100dvh - 48px);
  box-shadow:0 30px 100px #14231933;
  border-radius:4px
}
.site-dialog::backdrop {
  background:#17221988
}
.dialog-inner {
  padding:42px
}
.dialog-inner h2 {
  font-size:27px;
  margin-bottom:24px
}
.dialog-inner>p:not(.section-label) {
  font-size:14px;
  line-height:2;
  color:var(--body);
  margin-bottom:18px
}
.dialog-close {
  position:absolute;
  top:9px;
  right:12px;
  width:40px;
  height:40px;
  border:0;
  background:transparent;
  font-size:28px;
  font-weight:400
}
.dialog-inner .dialog-footnote {
  font-size:12px!important
}
.dialog-inner>.button {
  margin-top:12px
}
.review-fields {
  margin:0 0 25px;
  overflow-wrap:anywhere
}
.review-fields dt {
  font-size:12px;
  color:#848979;
  margin-top:16px
}
.review-fields dd {
  font-size:15px;
  margin:0;
  white-space:pre-wrap
}
.review-notice {
  background:#f4f1e8;
  padding:15px
}
.review-actions {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  align-items:center
}
.review-actions .text-link {
  font-size:13px
}
.button:disabled {
  background:#a6ada2;
  color:#fff;
  cursor:not-allowed
}
#send-status {
  font-size:14px;
  margin-top:20px;
  line-height:1.8
}
@media(min-width:1600px) {
  .hero {
    gap:76px
  }
  .hero-photo {
    height:625px
  }
}
@media(max-width:1200px) {
  .container {
    width:calc(100% - 80px)
  }
  .header-inner {
    width:calc(100% - 48px);
    gap:20px
  }
  .desktop-nav {
    gap:18px;
    font-size:12px
  }
  .brand-type {
    font-size:14px
  }
  .hero {
    gap:35px
  }
  .hero-photo {
    height:560px
  }
  h1 {
    font-size:50px
  }
  .hero-facts {
    font-size:10px
  }
  .hero-actions {
    gap:20px
  }
  .hero-actions .button {
    font-size:14px;
    padding-inline:20px;
    gap:25px
  }
  .section-intro {
    gap:45px
  }
  h2 {
    font-size:32px
  }
  .approach-row {
    grid-template-columns:150px 1fr 200px;
    gap:20px
  }
  .approach-row>p {
    width:185px;
    font-size:12px
  }
  .approach-path,.our-path {
    gap:10px
  }
  .path-node {
    min-width:51px;
    font-size:12px
  }
  .decision-pair {
    font-size:12px;
    gap:6px;
    padding-inline:8px
  }
  .decision-note {
    font-size:12px
  }
  .decision-note small {
    font-size:9px
  }
  .featured-project {
    gap:32px;
    grid-template-columns:1.55fr 1fr
  }
  .feature-visual {
    padding:20px
  }
  .notebook-layout {
    grid-template-columns:145px 1fr
  }
  .notebook-sidebar {
    padding-inline:10px
  }
  .notebook-main {
    padding-inline:18px
  }
  .mentor-grid {
    gap:70px
  }
  .mentor-portrait {
    display:block
  }
  .mentor-portrait figcaption {
    margin-top:14px
  }
  .pricing-grid {
    gap:70px
  }
  .consultation-grid {
    gap:65px
  }
  .weekly-flow {
    grid-template-columns:200px 1fr;
    padding:28px;
    gap:20px
  }
  .weekly-diagram {
    gap:12px
  }
  .weekly-diagram strong {
    font-size:12px
  }
  .weekly-diagram p {
    font-size:9px
  }
  .roadmap li+li {
    padding-left:17px
  }
  .roadmap li p {
    font-size:11px
  }
  .roadmap h3 {
    font-size:15px
  }
  .secondary-project .project-visual {
    padding:23px;
    height:335px
  }
  .secondary-description h3 {
    font-size:21px
  }
}
@media(max-width:1000px) {
  .desktop-nav {
    display:none
  }
  .header-cta {
    margin-left:auto
  }
  .menu-toggle {
    display:flex;
    flex-direction:column;
    gap:7px;
    justify-content:center;
    align-items:center;
    border:0;
    background:none;
    width:44px;
    height:44px
  }
  .menu-toggle>span {
    width:22px;
    height:1px;
    background:var(--ink);
    transition:transform .2s
  }
  .menu-toggle[aria-expanded=true]>span:first-child {
    transform:translateY(4px) rotate(45deg)
  }
  .menu-toggle[aria-expanded=true]>span:last-child {
    transform:translateY(-4px) rotate(-45deg)
  }
  .mobile-nav {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0;
    padding:10px 40px 25px;
    border-top:1px solid var(--line);
    background:white
  }
  .mobile-nav a {
    font-size:14px;
    padding:14px 0;
    border-bottom:1px solid #e7e9e3
  }
  .section {
    padding:90px 0
  }
  .hero {
    gap:30px
  }
  .hero-question {
    font-size:12px
  }
  .hero-photo {
    height:550px
  }
  h1 {
    font-size:43px
  }
  .hero-service {
    font-size:17px
  }
  .hero-description {
    font-size:14px
  }
  .hero-facts {
    white-space:normal;
    font-size:11px;
    line-height:2
  }
  .hero-facts span {
    padding-inline:4px
  }
  .hero-actions {
    align-items:flex-start;
    flex-direction:column;
    gap:16px
  }
  .intro-line {
    flex-wrap:wrap;
    gap:12px 28px
  }
  .intro-line>a {
    display:none
  }
  .section-intro {
    gap:35px
  }
  .section-description {
    font-size:14px
  }
  h2 {
    font-size:30px
  }
  .approach-row {
    grid-template-columns:145px 1fr;
    gap:15px;
    padding:24px 0
  }
  .approach-row>p {
    grid-column:2;
    justify-self:start;
    width:auto;
    margin-top:-3px
  }
  .approach-row h3 {
    grid-row:1 / 3
  }
  .approach-path,.our-path {
    max-width:100%
  }
  .path-node {
    min-width:60px
  }
  .our-approach {
    min-height:155px
  }
  .approach-close {
    font-size:21px
  }
  .featured-project {
    grid-template-columns:1fr;
    gap:30px
  }
  .feature-visual {
    padding:30px 40px
  }
  .notebook-layout {
    grid-template-columns:190px 1fr;
    min-height:390px
  }
  .notebook-main {
    padding-inline:30px
  }
  .project-story {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 35px
  }
  .project-story .project-number {
    grid-column:1/-1
  }
  .project-story h3 {
    font-size:27px
  }
  .project-story>p:not(.project-number) {
    grid-column:1;
    margin-top:17px
  }
  .project-takeaway {
    grid-column:2;
    grid-row:2 / 4;
    margin-top:0;
    padding-top:0;
    border-top:0;
    border-left:1px solid var(--line);
    padding-left:30px
  }
  .secondary-projects {
    gap:28px
  }
  .secondary-project .project-visual {
    height:295px;
    padding:16px
  }
  .club-inner {
    padding:10px 13px
  }
  .data-toolbar {
    padding:14px 12px 0
  }
  .data-toolbar>span {
    display:none
  }
  .event-row {
    gap:10px;
    padding-block:12px
  }
  .club-title>span {
    font-size:8px
  }
  .event-row strong {
    font-size:9px
  }
  .club-brand>span {
    display:none
  }
  .data-insight {
    font-size:9px
  }
  .data-insight>span {
    display:block
  }
  .roadmap {
    grid-template-columns:repeat(3,1fr);
    row-gap:38px
  }
  .roadmap li:nth-child(4) {
    padding-left:0
  }
  .roadmap li:nth-child(3):before {
    right:17px
  }
  .roadmap h3 {
    font-size:16px
  }
  .roadmap li p {
    font-size:13px;
    min-height:auto
  }
  .milestone {
    margin-top:15px
  }
  .weekly-flow {
    grid-template-columns:1fr;
    gap:26px;
    padding:28px
  }
  .weekly-heading {
    display:flex;
    align-items:baseline;
    gap:25px
  }
  .weekly-heading h3 {
    font-size:20px
  }
  .weekly-heading h3 br {
    display:none
  }
  .weekly-diagram {
    justify-content:flex-start;
    gap:24px
  }
  .weekly-diagram strong {
    font-size:14px
  }
  .weekly-diagram p {
    font-size:11px
  }
  .parent-note {
    font-size:12px;
    gap:20px
  }
  .mentor-grid {
    gap:55px;
    grid-template-columns:1fr 1.25fr
  }
  .mentor-details>h3 {
    font-size:29px;
    gap:15px
  }
  .mentor-details>h3 span {
    font-size:12px
  }
  .bio-list>div {
    gap:17px;
    grid-template-columns:65px 1fr
  }
  .bio-list dd {
    font-size:13px
  }
  .mentor-message {
    font-size:14px
  }
  .pricing-grid {
    gap:50px
  }
  .price-line>strong {
    font-size:57px
  }
  .price-line {
    gap:10px
  }
  .pricing-section h2 {
    font-size:32px
  }
  .pricing-intro>p:last-child {
    font-size:14px
  }
  .price-caption {
    font-size:12px
  }
  .included-list li {
    font-size:12px
  }
  .price-total {
    display:block
  }
  .price-total strong {
    display:block;
    margin-top:5px
  }
  .faq-grid {
    gap:45px;
    grid-template-columns:1fr 1.7fr
  }
  .consultation-grid {
    gap:45px;
    grid-template-columns:1fr 1.4fr
  }
  .consultation-copy h2 {
    font-size:40px
  }
  .consultation-copy>p:not(.section-label) {
    font-size:14px
  }
  .consultation-form {
    padding:26px
  }
  .form-row {
    grid-template-columns:1fr;
    gap:0
  }
  .footer-main {
    align-items:flex-start
  }
  .footer-nav {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px 25px
  }
}
@media(max-width:700px) {
  html {
    scroll-padding-top:95px
  }
  .container {
    width:calc(100% - 40px)
  }
  .section {
    padding:68px 0
  }
  .header-inner {
    height:74px;
    width:calc(100% - 32px);
    gap:8px
  }
  .brand {
    gap:10px
  }
  .brand-symbol {
    width:37px;
    height:39px;
    font-size:37px;
    letter-spacing:-.25em
  }
  .brand-symbol>span {
    font-size:29px
  }
  .brand-type {
    font-size:11px;
    letter-spacing:.07em
  }
  .brand-type small {
    font-size:8px;
    letter-spacing:0
  }
  .header-cta {
    min-height:36px;
    font-size:10px;
    padding:5px 10px;
    gap:7px
  }
  .header-cta>span {
    display:none
  }
  .menu-toggle {
    width:32px;
    min-width:32px
  }
  .menu-toggle>span {
    width:18px
  }
  .mobile-nav {
    padding:8px 24px 23px;
    gap:0 20px
  }
  .mobile-nav a {
    font-size:13px
  }
  .hero {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    padding-block:39px 28px;
    gap:31px
  }
  .hero-question {
    font-size:12px;
    letter-spacing:0;
    margin-bottom:18px
  }
  .hero h1 {
    font-size:42px;
    line-height:1.55;
    letter-spacing:.035em
  }
  .hero-service {
    font-size:17px;
    line-height:1.9;
    margin-top:20px
  }
  .hero-description {
    font-size:14px;
    line-height:1.95;
    margin-top:16px
  }
  .hero-actions {
    flex-direction:row;
    align-items:center;
    gap:22px;
    margin-top:26px
  }
  .hero-actions .button {
    font-size:13px;
    padding:12px 16px;
    min-height:52px;
    gap:19px
  }
  .hero-actions .text-link {
    font-size:12px;
    gap:10px
  }
  .hero-facts {
    font-size:10px;
    line-height:2;
    margin-top:17px
  }
  .hero-photo {
    height:330px
  }
  .hero-photo img {
    object-position:50% 73%
  }
  .hero-photo figcaption {
    padding:11px 14px;
    font-size:10px
  }
  .caption-number {
    font-size:17px
  }
  .intro-line {
    padding-block:21px;
    display:block;
    font-size:11px
  }
  .intro-line p:first-child {
    font-size:11px
  }
  .intro-line p:nth-child(2) {
    margin-top:10px;
    font-size:10px;
    line-height:2
  }
  .intro-line strong {
    font-size:15px;
    margin-left:13px
  }
  .separator {
    padding-inline:6px
  }
  .section-label {
    font-size:12px;
    margin-bottom:16px
  }
  .section-intro {
    grid-template-columns:1fr;
    gap:24px;
    margin-bottom:32px
  }
  h2 {
    font-size:28px;
    letter-spacing:.02em;
    line-height:1.65
  }
  .section-description {
    font-size:14px;
    line-height:2
  }
  .section-description br {
    display:none
  }
  .mobile-break {
    display:block
  }
  .desktop-break {
    display:none
  }
  .approach-row {
    grid-template-columns:1fr;
    padding:20px 0;
    gap:14px;
    min-height:auto
  }
  .approach-row h3 {
    grid-row:auto;
    font-size:14px
  }
  .approach-row>p {
    grid-column:1;
    font-size:12px;
    margin:0;
    padding-left:0
  }
  .approach-row h3 br {
    display:none
  }
  .approach-path,.our-path {
    font-size:12px;
    gap:9px
  }
  .path-node {
    font-size:11px;
    padding:7px 8px;
    min-width:53px
  }
  .path-caption {
    font-size:11px
  }
  .our-approach {
    padding-top:24px;
    padding-bottom:24px
  }
  .our-approach h3 {
    font-size:17px
  }
  .our-approach h3 small {
    font-size:10px;
    margin-bottom:6px
  }
  .our-path {
    flex-wrap:wrap;
    gap:9px
  }
  .decision-pair {
    font-size:12px;
    padding:10px 9px;
    gap:7px
  }
  .decision-pair>span {
    font-size:18px
  }
  .decision-note {
    font-size:11px;
    white-space:normal;
    max-width:135px
  }
  .decision-note small {
    font-size:8px;
    line-height:1.6
  }
  .our-path .path-line {
    min-width:8px
  }
  .our-path .path-node {
    min-width:43px;
    padding-inline:5px;
    font-size:10px
  }
  .our-approach>p {
    font-size:12px;
    font-weight:500
  }
  .our-approach>p br {
    display:none
  }
  .approach-close {
    font-size:18px;
    margin-top:27px;
    line-height:1.9;
    text-align:left
  }
  .approach-close>span {
    display:block
  }
  .sample-note {
    font-size:11px;
    line-height:1.85;
    margin-top:17px
  }
  .featured-project {
    gap:23px;
    padding-bottom:36px
  }
  .feature-visual {
    padding:15px;
    margin-inline:-4px
  }
  .window-top {
    padding:9px 11px;
    min-height:34px;
    font-size:10px;
    gap:8px
  }
  .window-dots {
    font-size:5px;
    letter-spacing:2px
  }
  .window-detail {
    font-size:8px
  }
  .notebook-layout {
    grid-template-columns:1fr;
    min-height:auto
  }
  .notebook-sidebar {
    display:none
  }
  .notebook-main {
    padding:16px 17px
  }
  .app-breadcrumb {
    font-size:9px
  }
  .notebook-main h4 {
    font-size:18px;
    margin:17px 0
  }
  .question-bubble {
    font-size:10px;
    padding:10px 12px;
    max-width:215px
  }
  .answer {
    font-size:10px;
    margin-top:20px;
    gap:9px
  }
  .answer strong {
    font-size:10px
  }
  .answer-mark {
    width:20px;
    height:20px
  }
  .evaluation-note {
    margin-top:18px;
    padding:9px 12px
  }
  .evaluation-note p {
    font-size:12px
  }
  .mock-input {
    margin-top:16px
  }
  .project-story {
    display:block
  }
  .project-number {
    font-size:24px;
    margin-bottom:12px
  }
  .project-number>span {
    font-size:11px;
    margin-left:12px
  }
  .project-story h3 {
    font-size:26px;
    line-height:1.7
  }
  .project-story>p:not(.project-number) {
    font-size:14px;
    line-height:2;
    margin-top:15px
  }
  .project-takeaway {
    border-left:0;
    border-top:1px solid var(--line);
    padding:18px 0 0;
    margin-top:20px
  }
  .project-takeaway dt {
    font-size:11px
  }
  .project-takeaway dd {
    font-size:13px;
    margin-bottom:15px
  }
  .secondary-projects {
    grid-template-columns:1fr;
    gap:34px;
    margin-top:34px
  }
  .secondary-project .project-visual {
    height:auto;
    min-height:268px;
    padding:17px
  }
  .secondary-description {
    padding-top:21px
  }
  .secondary-description h3 {
    font-size:22px;
    line-height:1.65
  }
  .secondary-description>p:not(.project-number) {
    font-size:13px;
    margin-top:12px
  }
  .secondary-description .small-outcome {
    font-size:11px!important
  }
  .data-toolbar {
    padding:14px 13px 0
  }
  .data-toolbar strong {
    font-size:12px
  }
  .data-toolbar>span {
    display:none
  }
  .data-chart {
    padding:6px 10px 0
  }
  .data-insight {
    font-size:9px;
    padding:10px 12px
  }
  .data-insight>span {
    display:block
  }
  .club-inner {
    padding:10px 14px 15px
  }
  .club-title h4 {
    font-size:15px
  }
  .club-title>span {
    font-size:9px
  }
  .event-row strong {
    font-size:10px
  }
  .event-row p {
    font-size:9px
  }
  .event-row {
    padding:12px 0;
    gap:12px
  }
  .club-memo {
    font-size:9px
  }
  .theme-line {
    align-items:flex-start;
    font-size:12px;
    gap:17px;
    padding-top:20px;
    margin-top:32px
  }
  .theme-line>span {
    font-size:11px;
    line-height:2
  }
  .roadmap {
    grid-template-columns:1fr;
    margin-top:36px;
    row-gap:0
  }
  .roadmap li,.roadmap li+li,.roadmap li:nth-child(4) {
    display:grid;
    grid-template-columns:66px 1fr;
    gap:28px;
    padding:0 0 27px
  }
  .roadmap li:before,.roadmap li:nth-child(3):before,.roadmap li:last-child:before {
    top:10px;
    bottom:0;
    left:77px;
    right:auto;
    border-top:0;
    border-left:1px solid #b8c0b6
  }
  .roadmap li:last-child:before {
    bottom:35px
  }
  .week {
    font-size:30px;
    text-align:right;
    padding-bottom:0;
    padding-top:0;
    line-height:1.1
  }
  .week:after {
    left:auto;
    right:-16px;
    top:8px;
    bottom:auto;
    width:6px;
    height:6px
  }
  .week small {
    display:block;
    font-size:10px;
    margin:4px 2px 0 0
  }
  .roadmap h3 {
    font-size:16px;
    margin:0 0 7px
  }
  .roadmap li p {
    font-size:12px;
    line-height:1.85
  }
  .roadmap li p br {
    display:none
  }
  .milestone {
    font-size:10px;
    margin-top:9px
  }
  .roadmap-note {
    font-size:11px;
    margin-top:4px
  }
  .weekly-flow {
    margin-top:32px;
    padding:25px 22px;
    gap:26px
  }
  .weekly-heading {
    display:block
  }
  .weekly-heading h3 {
    font-size:23px
  }
  .weekly-heading h3 br {
    display:block
  }
  .weekly-diagram {
    flex-direction:column;
    align-items:stretch;
    gap:13px
  }
  .weekly-diagram>div {
    display:grid;
    grid-template-columns:112px 1fr;
    gap:0 14px
  }
  .flow-role {
    grid-row:1/3;
    font-size:10px;
    margin:2px 0 0;
    align-self:start
  }
  .weekly-diagram strong {
    font-size:13px;
    white-space:normal
  }
  .weekly-diagram p {
    font-size:10px;
    grid-column:2;
    margin-top:4px;
    line-height:1.8
  }
  .flow-arrow {
    margin-left:158px;
    font-size:20px;
    line-height:1;
    transform:rotate(90deg);
    width:20px
  }
  .parent-note {
    display:block;
    margin-top:20px;
    font-size:12px;
    line-height:1.9
  }
  .parent-note>span {
    display:block;
    font-size:11px;
    margin-bottom:7px
  }
  .parent-note br {
    display:none
  }
  .mentor-grid {
    grid-template-columns:1fr;
    gap:34px
  }
  .mentor-portrait {
    display:flex;
    align-items:flex-end;
    gap:24px;
    margin-top:29px
  }
  .mentor-portrait img {
    width:160px;
    height:160px
  }
  .mentor-portrait figcaption {
    font-size:14px
  }
  .mentor-portrait figcaption>span {
    font-size:10px
  }
  .mentor-details>h3 {
    font-size:31px;
    gap:24px
  }
  .mentor-details>h3 span {
    font-size:13px
  }
  .mentor-pretitle {
    font-size:12px;
    margin:0 0 12px
  }
  .mentor-message {
    font-size:14px;
    line-height:2.05;
    margin-top:20px
  }
  .bio-list {
    margin-top:23px
  }
  .bio-list>div {
    grid-template-columns:60px 1fr;
    gap:15px;
    padding-block:14px
  }
  .bio-list dt {
    font-size:11px
  }
  .bio-list dd {
    font-size:13px
  }
  .mentor-footnote {
    font-size:10px
  }
  .pricing-grid {
    grid-template-columns:1fr;
    gap:37px
  }
  .pricing-section h2 {
    font-size:31px
  }
  .pricing-intro>p:last-child {
    font-size:14px;
    line-height:2;
    margin-top:22px
  }
  .price-line {
    gap:12px
  }
  .price-line>strong {
    font-size:65px
  }
  .price-line>span {
    font-size:14px
  }
  .price-line small {
    font-size:10px
  }
  .price-caption {
    font-size:12px;
    margin-top:16px
  }
  .included-heading {
    font-size:11px;
    margin-top:27px;
    padding-top:20px
  }
  .included-list li {
    font-size:13px;
    padding-block:11px
  }
  .price-total {
    display:flex;
    font-size:11px;
    gap:14px;
    margin-top:22px
  }
  .price-total strong {
    font-size:17px;
    margin-top:0;
    letter-spacing:0
  }
  .price-total strong>span {
    font-size:10px
  }
  .price-note {
    font-size:10px;
    margin:19px 0 25px
  }
  .button-light {
    width:100%;
    font-size:14px
  }
  .faq-grid {
    grid-template-columns:1fr;
    gap:28px
  }
  .faq-list summary {
    font-size:14px;
    line-height:1.9;
    padding-block:21px;
    gap:17px
  }
  .faq-list details>p {
    font-size:13px;
    padding-right:12px;
    padding-bottom:22px
  }
  .consultation-grid {
    grid-template-columns:1fr;
    gap:32px
  }
  .consultation-copy h2 {
    font-size:43px
  }
  .consultation-copy>p:not(.section-label) {
    font-size:14px;
    line-height:2.05;
    margin-top:22px
  }
  .consultation-agenda {
    margin-top:25px;
    padding-top:18px
  }
  .consultation-agenda ol {
    font-size:12px;
    line-height:2.3;
    margin-bottom:0
  }
  .consultation-form {
    padding:26px 20px;
    margin-inline:-4px
  }
  .form-heading {
    font-size:23px
  }
  .form-row {
    grid-template-columns:1fr;
    gap:0
  }
  .field {
    margin-bottom:20px
  }
  .field label {
    font-size:13px
  }
  .field input,.field select {
    min-height:50px
  }
  .field textarea {
    font-size:14px
  }
  .form-availability {
    font-size:11px;
    margin-bottom:22px
  }
  .consent {
    font-size:11px
  }
  .submit-button {
    font-size:13px;
    min-height:54px
  }
  .form-caption {
    font-size:9px
  }
  .site-footer {
    padding:31px 0 24px
  }
  .footer-main {
    display:block;
    padding-bottom:25px
  }
  .footer-brand .brand-type {
    font-size:13px
  }
  .footer-brand .brand-type small {
    font-size:9px
  }
  .footer-nav {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    font-size:11px;
    gap:16px 20px;
    margin-top:30px
  }
  .footer-bottom {
    flex-wrap:wrap;
    gap:15px 21px;
    font-size:10px;
    padding-top:22px
  }
  .footer-bottom small {
    display:block;
    margin-left:0;
    flex-basis:100%;
    font-size:9px
  }
  .dialog-inner {
    padding:37px 25px 28px
  }
  .dialog-inner h2 {
    font-size:24px
  }
  .dialog-inner>p:not(.section-label) {
    font-size:13px
  }
  .review-actions {
    gap:18px
  }
  .review-actions .button {
    width:100%;
    min-height:53px;
    font-size:14px
  }
  .review-notice {
    font-size:12px!important
  }
}
@media(max-width:370px) {
  .container {
    width:calc(100% - 36px)
  }
  .brand-type {
    font-size:10px
  }
  .brand-type small {
    font-size:7px
  }
  .brand-symbol {
    width:33px;
    font-size:34px
  }
  .brand-symbol>span {
    font-size:26px
  }
  .header-inner {
    width:calc(100% - 24px)
  }
  .hero h1 {
    font-size:39px
  }
  .hero-actions {
    gap:17px
  }
  .hero-actions .button {
    padding-inline:13px;
    gap:12px
  }
  .hero-facts {
    font-size:9px
  }
  .our-path {
    gap:7px
  }
  .decision-pair {
    font-size:11px;
    padding-inline:7px
  }
  .decision-note {
    max-width:122px;
    font-size:10px
  }
  .decision-note small {
    font-size:8px
  }
  .weekly-flow {
    padding-inline:18px
  }
  .weekly-diagram>div {
    grid-template-columns:101px 1fr;
    gap:0 11px
  }
  .weekly-diagram strong {
    font-size:12px
  }
  .weekly-diagram p {
    font-size:9px
  }
  .flow-arrow {
    margin-left:145px
  }
  .price-line>strong {
    font-size:59px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important
  }
}
@media print {
  .site-header {
    position:static
  }
  .hero-photo {
    height:450px
  }
  .button,.header-cta,.menu-toggle,.consultation-form,.mobile-nav,.site-dialog {
    display:none!important
  }
  .section {
    padding:40px 0
  }
  .container {
    width:100%
  }
  .section,.featured-project,.weekly-flow,.mentor-grid {
    break-inside:avoid
  }
  .pricing-section {
    background:#eee;
    color:#222
  }
  .pricing-section p,.pricing-section .section-label {
    color:#333
  }
}
/* Review 1: readable Japanese and intentional phrase wrapping. */
body {
  font-weight:500
}
.phrase {
  display:inline-block
}
.hero-description,.project-story>p:not(.project-number),.secondary-description>p:not(.project-number),.mentor-message,.pricing-intro>p:last-child,.faq-list details>p,.consultation-copy>p:not(.section-label) {
  font-size:16px
}
.hero-facts {
  font-size:12px
}
.sample-note,.roadmap-note,.mentor-footnote,.price-note {
  font-size:12px;
  color:#626b65
}
.roadmap li p,.parent-note,.project-takeaway dd,.bio-list dd,.included-list li {
  font-size:15px
}
.pricing-section .price-note {
  color:#d0d6d0
}
@media(max-width:700px) {
  h2 {
    font-size:28px;
    line-height:1.7;
    letter-spacing:.01em
  }
  .hero-description,.section-description,.project-story>p:not(.project-number),.secondary-description>p:not(.project-number),.mentor-message,.pricing-intro>p:last-child,.faq-list details>p,.consultation-copy>p:not(.section-label) {
    font-size:16px;
    line-height:1.95
  }
  .hero-facts {
    font-size:11px;
    line-height:1.9;
    white-space:normal
  }
  .sample-note,.roadmap-note,.mentor-footnote,.price-note,.form-availability,.consent,.form-caption {
    font-size:12px
  }
  .roadmap li p,.parent-note,.project-takeaway dd,.bio-list dd,.included-list li {
    font-size:14px
  }
  .approach-row>p {
    font-size:13px
  }
  .section {
    padding-block:72px
  }
  .theme-line,.secondary-description .small-outcome {
    font-size:12px!important
  }
  .field label,.faq-list summary {
    font-size:15px
  }
  .form-caption {
    font-size:11px
  }
}
/* Review 2: project and instructor hierarchy. */
.roadmap li p {
  min-height:64px
}
.milestone {
  font-size:12px
}
.roadmap li:nth-child(4) h3 {
  color:var(--accent)
}
.mentor-portrait h3 {
  font-family:var(--serif);
  font-size:25px;
  letter-spacing:.07em
}
.mentor-portrait figcaption>span {
  font-family:Georgia,serif;
  font-size:12px;
  margin-top:7px
}
.mentor-portrait small {
  display:block;
  font-size:11px;
  color:var(--body);
  margin-top:10px
}
.mentor-pretitle {
  font-family:var(--serif);
  font-size:24px;
  color:var(--ink);
  line-height:1.8;
  margin-top:0
}
.mentor-message {
  margin-top:20px
}
.secondary-project .project-visual {
  height:368px;
  display:flex;
  align-items:center
}
.secondary-project .app-window {
  width:100%
}
.notebook-main .answer {
  font-size:12px
}
.notebook-main .answer strong {
  font-size:12px
}
.app-breadcrumb {
  color:#68715f
}
.notebook-main .answer p {
  line-height:1.9
}
.reference-tag {
  color:#586250
}
@media(max-width:1000px) {
  .secondary-project .project-visual {
    height:310px
  }
  .mentor-portrait {
    gap:19px
  }
  .mentor-portrait h3 {
    font-size:22px
  }
}
@media(max-width:700px) {
  .secondary-project .project-visual {
    height:auto;
    min-height:280px
  }
  .secondary-description h3 {
    font-size:22px
  }
  .project-number {
    font-size:23px
  }
  .notebook-main .answer,.notebook-main .answer strong {
    font-size:12px
  }
  .notebook-main .question-bubble {
    font-size:12px;
    max-width:250px
  }
  .evaluation-note {
    font-size:11px
  }
  .notebook-main h4 {
    font-size:18px
  }
  .mock-input {
    font-size:10px
  }
  .roadmap li p {
    min-height:0
  }
  .milestone {
    font-size:11px
  }
  .roadmap li,.roadmap li+li,.roadmap li:nth-child(4) {
    padding-bottom:26px
  }
  .roadmap li:last-child:before {
    bottom:30px
  }
  .weekly-diagram strong {
    font-size:15px
  }
  .weekly-diagram p,.flow-role {
    font-size:12px
  }
  .weekly-diagram>div {
    grid-template-columns:100px 1fr
  }
  .flow-arrow {
    margin-left:147px
  }
  .mentor-pretitle {
    font-size:21px
  }
  .mentor-grid {
    gap:31px
  }
  .mentor-portrait h3 {
    font-size:26px
  }
  .mentor-portrait figcaption>span {
    font-size:12px
  }
  .mentor-portrait small {
    font-size:11px
  }
  .mentor-portrait {
    align-items:center
  }
  .mentor-message {
    margin-top:18px
  }
  .consultation-agenda ol {
    font-size:14px
  }
  .consultation-copy h2 {
    font-size:39px
  }
}
/* Review 3: tangible instructor identity and readable pricing. */
.hero-facts {
  font-size:13px
}
.hero-facts strong {
  font-weight:600;
  color:var(--ink)
}
.intro-line {
  padding-block:16px
}
.intro-line p:first-child {
  display:flex;
  align-items:center
}
.intro-portrait {
  width:42px;
  height:42px;
  object-fit:cover;
  margin-right:17px
}
@media(max-width:1000px) {
  .hero-facts {
    font-size:12px
  }
}
@media(max-width:700px) {
  .hero-description {
    line-height:1.95
  }
  .hero-facts {
    font-size:12px;
    line-height:2
  }
  .hero-facts span {
    padding-inline:5px
  }
  .intro-line {
    display:grid;
    grid-template-columns:1fr auto;
    gap:9px 16px;
    padding-block:19px
  }
  .intro-line p:nth-child(2) {
    grid-column:1/-1;
    margin:0;
    font-size:11px
  }
  .intro-line>a {
    display:flex;
    font-size:11px;
    gap:6px;
    grid-column:2;
    grid-row:1
  }
  .intro-line strong {
    margin-left:10px
  }
  .intro-portrait {
    margin-right:13px
  }
  .our-path {
    position:relative;
    padding-bottom:31px;
    flex-wrap:nowrap
  }
  .decision-note {
    font-size:12px;
    max-width:132px
  }
  .decision-note small {
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    font-size:12px;
    text-align:left;
    line-height:1.6
  }
  .decision-pair {
    font-size:12px
  }
  .our-approach>p {
    margin-top:15px
  }
  .mentor-pretitle {
    font-size:21px
  }
}
@media(max-width:370px) {
  .intro-line>a {
    font-size:10px
  }
  .intro-line {
    column-gap:8px
  }
  .decision-note {
    font-size:11px;
    max-width:121px
  }
  .decision-pair {
    font-size:11px
  }
}
/* Review 4: intermediate widths and touch targets. */
.caption-number {
  white-space:nowrap;
  flex-shrink:0
}
.hero-photo figcaption>span:first-child {
  max-width:calc(100% - 82px)
}
.consent label {
  cursor:pointer
}
.consent>span {
  display:flex;
  align-items:center;
  flex-wrap:wrap
}
@media(min-width:1001px) {
  .section {
    padding-block:96px
  }
  .approach-row {
    min-height:100px
  }
  .our-approach {
    min-height:144px
  }
}
@media(min-width:701px) and (max-width:1000px) {
  .hero-photo figcaption {
    padding:13px 14px;
    font-size:11px;
    gap:10px
  }
  .caption-number {
    font-size:18px
  }
  .hero-photo figcaption>span:first-child {
    max-width:calc(100% - 72px)
  }
}
@media(max-width:700px) {
  .header-cta {
    min-height:44px;
    padding-inline:10px
  }
  .menu-toggle {
    width:44px;
    min-width:44px;
    height:44px
  }
  .header-inner {
    gap:5px
  }
  .brand {
    gap:8px
  }
  .text-link,.intro-line>a {
    min-height:44px
  }
  .consent {
    min-height:44px;
    align-items:center
  }
  .consent .inline-link,.consent label {
    display:inline-flex;
    align-items:center;
    min-height:44px
  }
  .consent input {
    flex-shrink:0
  }
  .footer-nav a {
    min-height:44px;
    display:flex;
    align-items:center
  }
  .footer-nav {
    gap:1px 20px
  }
  .footer-bottom>.inline-link {
    min-height:44px
  }
  .hero-photo figcaption>span:first-child {
    max-width:calc(100% - 80px)
  }
}
/* Review 5: captions with meaning and a contextual consultation link. */
.caption-number {
  font-size:26px
}
.caption-number small {
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:0;
  margin-left:6px
}
.hero-photo figcaption>span:first-child {
  max-width:calc(100% - 70px)
}
.project-consultation {
  margin-left:auto;
  flex-shrink:0;
  font-size:13px;
  gap:18px
}
@media(max-width:1000px) {
  .theme-line {
    flex-wrap:wrap
  }
  .project-consultation {
    margin-left:0
  }
}
@media(max-width:700px) {
  .caption-number {
    font-size:23px
  }
  .caption-number small {
    font-size:10px
  }
  .theme-line {
    gap:11px 16px
  }
  .theme-line>p {
    flex:1;
    min-width:230px
  }
  .project-consultation {
    margin-left:57px
  }
  .hero-photo figcaption>span:first-child {
    max-width:calc(100% - 65px)
  }
}
