@font-face {
  font-family:Vazirmatn;
  src:url('../fonts/Vazirmatn.woff2') format('woff2');
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
:root {
  --bg:#f7f9fc;
  --ink:#17273e;
  --muted:#637186;
  --blue:#066fdc;
  --blue-dark:#055ab3;
  --yellow:#ffd444;
  --line:rgba(111,143,181,.17);
  --radius:28px;
  --shadow:0 12px 40px rgba(50,92,143,.08);
  --font:Vazirmatn,Tahoma,Arial,sans-serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px;
}
body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:400 1rem/1.9 var(--font);
  -webkit-font-smoothing:antialiased;
}
body::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 0 auto;
  height:1060px;
  background:radial-gradient(ellipse at 20% 42%,#d5eaff 0,transparent 45%),radial-gradient(ellipse at 34% 73%,#fff0b6 0,transparent 36%),radial-gradient(ellipse at 86% 22%,#eaf2ff 0,transparent 40%);
  pointer-events:none;
}
a {
  color:inherit;
  text-decoration:none;
}
button,input {
  font:inherit;
}
button,a {
  -webkit-tap-highlight-color:transparent;
}
button {
  cursor:pointer;
}
img {
  display:block;
  max-width:100%;
  height:auto;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  font-weight:800;
}
h2 {
  font-size:clamp(1.75rem,3.6vw,2.8rem);
  line-height:1.6;
  letter-spacing:-.035em;
}
h3 {
  line-height:1.6;
}
strong {
  font-weight:700;
}
::selection {
  background:#cde6ff;
  color:#113756;
}
:focus-visible {
  outline:3px solid var(--blue);
  outline-offset:5px;
  border-radius:8px;
}
.icon-sprite {
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}
.icon {
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex-shrink:0;
  vertical-align:middle;
}
.section-shell {
  width:min(1140px,calc(100% - 40px));
  margin-inline:auto;
}
.glass {
  background:rgba(255,255,255,.57);
  border:1px solid rgba(255,255,255,.88);
  box-shadow:var(--shadow),inset 0 1px 1px #fff;
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
}
.skip-link {
  position:fixed;
  top:8px;
  right:20px;
  transform:translateY(-150%);
  z-index:20;
  padding:10px 20px;
  background:#fff;
  border-radius:12px;
}
.skip-link:focus {
  transform:none;
}
.site-header {
  position:relative;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:min(1140px,calc(100% - 32px));
  margin:16px auto 0;
  padding:11px 14px;
  border-radius:99px;
}
.brand {
  display:flex;
  align-items:center;
  gap:9px;
  font-size:.875rem;
  font-weight:600;
  white-space:nowrap;
}
.brand b {
  color:var(--blue);
}
.brand-icon {
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  background:linear-gradient(145deg,#a7d9ff,#177ff0);
  color:white;
  border:1px solid #fff;
  border-radius:11px;
  box-shadow:inset 1px 1px 3px #eff9ff,0 4px 8px #1374c422;
}
.site-header nav {
  display:none;
  align-items:center;
  gap:30px;
  font-size:.875rem;
  color:#5e6c7d;
}
.site-header nav a:hover {
  color:var(--blue);
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:52px;
  padding:12px 24px;
  border:1px solid transparent;
  border-radius:99px;
  font-size:.9375rem;
  font-weight:600;
  line-height:1.7;
  white-space:nowrap;
  transition:background .2s,transform .2s,box-shadow .2s;
}
.button:hover {
  transform:translateY(-2px);
}
.button-primary {
  background:var(--blue);
  color:white;
  box-shadow:0 5px 15px #087af124,inset 0 1px 0 #ffffff38;
}
.button-primary:hover {
  background:var(--blue-dark);
  box-shadow:0 8px 22px #087af135;
}
.button-glass {
  background:#ffffffa8;
  border-color:#fff;
  box-shadow:0 5px 15px #4a658b09;
}
.button-glass:hover {
  background:#fff;
}
.header-buy {
  padding:8px 17px;
  min-height:42px;
  font-size:.8125rem;
}
.header-buy .icon {
  width:17px;
}
.hero {
  display:grid;
  gap:16px;
  padding-top:55px;
  padding-bottom:38px;
}
.hero-copy {
  text-align:center;
}
.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:5px 13px;
  border-radius:30px;
  font-size:.8125rem;
  color:#426482;
  box-shadow:0 4px 16px #7896b70a;
}
.eyebrow .icon {
  width:17px;
  color:var(--blue);
}
h1 {
  margin:22px 0 18px;
  font-size:clamp(2.3rem,7.9vw,4.6rem);
  line-height:1.5;
  letter-spacing:-.06em;
  font-weight:850;
}
.accent-word {
  color:var(--blue);
  position:relative;
  white-space:nowrap;
}
.accent-word::after {
  content:"";
  height:7px;
  position:absolute;
  bottom:1px;
  right:0;
  left:0;
  background:linear-gradient(90deg,transparent,#a2d1ff);
  border-radius:50%;
  transform:rotate(-2deg);
}
.hero-lead {
  color:var(--muted);
  font-size:1.025rem;
  line-height:2.05;
}
.hero-lead strong {
  color:#425c77;
  font-weight:600;
}
.hero-actions {
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:25px;
}
.hero-actions .button {
  padding-inline:19px;
}
.author-line {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:27px;
  text-align:right;
  font-size:.8125rem;
  line-height:1.8;
  color:var(--muted);
}
.author-line strong {
  color:#43526b;
  font-size:.875rem;
  display:block;
}
.author-line span span {
  display:block;
}
.author-monogram {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid #fff;
  background:linear-gradient(145deg,#edf4ff,#cfdef2);
  font-size:.875rem;
  color:#426484;
}
.author-separator {
  width:1px;
  height:30px;
  background:var(--line);
  margin-inline:6px;
}
.small-note {
  font-size:.75rem;
}
.hero-visual {
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:500px;
  margin:auto;
  height:400px;
  display:grid;
  place-items:center;
}
.book-float {
  width:211px;
  transform:rotate(-9deg);
  animation:book-enter 1s ease-out both;
}
.hero-book {
  filter:drop-shadow(14px 25px 18px #335f8d33);
  width:100%;
}
.hero-orbit {
  position:absolute;
  z-index:-1;
  top:50%;
  left:50%;
  border:1px solid #88afdd24;
  border-radius:50%;
  transform:translate(-50%,-50%) rotate(-25deg);
  width:330px;
  height:285px;
}
.orbit-two {
  width:380px;
  height:335px;
  transform:translate(-50%,-50%) rotate(25deg);
}
.visual-caption {
  position:absolute;
  bottom:5px;
  font-size:.75rem;
  letter-spacing:2.4px;
  color:#8596ab;
}
.floating-code {
  position:absolute;
  left:-1px;
  bottom:36px;
  width:235px;
  border-radius:16px;
  padding:12px 14px;
  transform:rotate(3deg);
  box-shadow:0 10px 25px #507ba619;
  animation:float 7s ease-in-out infinite;
}
.code-window {
  display:flex;
  align-items:center;
  gap:4px;
  direction:ltr;
  border-bottom:1px solid var(--line);
  padding-bottom:9px;
}
.code-window>span {
  width:6px;
  height:6px;
  border-radius:50%;
  background:#f79f9c;
}
.code-window>span:nth-child(2) {
  background:#f0ce78;
}
.code-window>span:nth-child(3) {
  background:#a2d7b0;
}
.code-window b {
  font:400 .75rem ui-monospace,monospace;
  color:#77879c;
  margin-left:auto;
}
.floating-code code {
  display:block;
  text-align:left;
  font:500 .74rem/2.8 ui-monospace,SFMono-Regular,Consolas,monospace;
  white-space:nowrap;
  color:#536985;
}
.floating-code code span {
  color:#2583e7;
}
.floating-code em {
  font-style:normal;
  color:#bb8424;
}
.code-output {
  display:flex;
  align-items:center;
  gap:5px;
  font-size:.75rem;
  color:#61788c;
}
.code-output .icon {
  width:14px;
  height:14px;
  color:#37966c;
}
.floating-mission {
  position:absolute;
  top:39px;
  right:0;
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 13px;
  border-radius:15px;
  transform:rotate(4deg);
}
.floating-mission strong {
  display:block;
  font-size:.75rem;
  line-height:1.8;
}
.floating-mission small {
  display:block;
  font-size:.75rem;
  color:#637186;
}
.mission-icon {
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  background:#e4f2ff;
  border:1px solid #fff;
  color:var(--blue);
  border-radius:9px;
}
.mission-icon .icon {
  width:18px;
}
.visual-spark {
  position:absolute;
  font-size:26px;
  color:#b8d6f5;
}
.spark-one {
  top:47px;
  left:42px;
  color:#dfbb39;
}
.spark-two {
  right:26px;
  bottom:68px;
}
.stats-strip {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px 0;
  padding:30px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  text-align:center;
}
.stats-strip strong {
  font-size:2.1rem;
  font-weight:700;
  line-height:1.7;
}
.stats-strip strong span {
  font-size:.875rem;
  font-weight:500;
  margin-inline-start:8px;
}
.stats-strip p {
  font-size:.75rem;
  color:var(--muted);
}
.stats-strip>div:nth-child(odd) {
  border-inline-end:1px solid var(--line);
}
.section-kicker {
  display:block;
  font-size:.875rem;
  font-weight:600;
  color:var(--blue);
  margin-bottom:14px;
}
.section-intro {
  color:var(--muted);
  margin-top:14px;
  line-height:2;
}
.buy-section {
  text-align:center;
  padding-block:70px;
}
.store-grid {
  display:grid;
  gap:14px;
  margin-top:30px;
}
.store-card {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  text-align:right;
  padding:25px;
  border-radius:22px;
  transition:transform .2s,box-shadow .2s;
}
.store-card:hover {
  transform:translateY(-4px);
  box-shadow:0 12px 30px #2673c315;
}
.store-card>strong {
  font-size:1.1rem;
}
.store-card>span {
  font-size:.8125rem;
  color:var(--blue);
}
.store-card .icon {
  width:17px;
  margin-inline-start:6px;
}
.site-footer {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:20px;
  padding-block:27px;
  border-top:1px solid var(--line);
  font-size:.8125rem;
  color:var(--muted);
}
.site-footer>p {
  display:none;
}
.site-footer>.brand {
  color:var(--ink);
}
@keyframes float {
  0%,100% {
    transform:translateY(0) rotate(3deg);
  }
  50% {
    transform:translateY(-8px) rotate(3deg);
  }
}
@keyframes book-enter {
  from {
    transform:translateY(22px) rotate(-6deg);
  }
  to {
    transform:translateY(0) rotate(-9deg);
  }
}
@media(min-width:600px) {
  .hero {
    padding-top:70px;
  }
  .hero-visual {
    height:470px;
  }
  .book-float {
    width:260px;
  }
  .floating-mission {
    right:20px;
    top:75px;
  }
  .floating-code {
    left:10px;
    bottom:45px;
  }
  .stats-strip {
    grid-template-columns:repeat(4,1fr);
  }
  .stats-strip>div:not(:last-child) {
    border-inline-end:1px solid var(--line);
  }
  .stats-strip p {
    font-size:.8125rem;
  }
  .store-grid {
    grid-template-columns:1fr 1fr;
  }
  .site-footer>p {
    display:block;
  }
}
@media(min-width:960px) {
  .section-shell {
    width:min(1140px,calc(100% - 80px));
  }
  .site-header {
    padding:10px 13px 10px 20px;
    margin-top:22px;
  }
  .brand {
    font-size:.9375rem;
  }
  .site-header nav {
    display:flex;
  }
  .hero {
    grid-template-columns:1.05fr 1fr;
    align-items:center;
    gap:36px;
    min-height:665px;
    padding-top:36px;
    padding-bottom:48px;
  }
  .hero-copy {
    text-align:right;
    padding-bottom:15px;
  }
  .hero-actions,.author-line {
    justify-content:flex-start;
  }
  .hero-actions {
    margin-top:30px;
  }
  .hero-actions .button {
    padding-inline:25px;
  }
  .hero-lead {
    font-size:1.125rem;
  }
  .author-line {
    margin-top:32px;
  }
  .hero-visual {
    height:530px;
    max-width:none;
  }
  .book-float {
    width:293px;
  }
  .hero-orbit {
    width:395px;
    height:385px;
  }
  .orbit-two {
    width:470px;
    height:430px;
  }
  .floating-code {
    left:-5px;
    bottom:34px;
    width:267px;
    padding:14px 17px;
  }
  .floating-code code {
    font-size:.84375rem;
  }
  .code-output {
    font-size:.75rem;
  }
  .floating-mission {
    top:92px;
    right:-4px;
    padding:13px 16px;
  }
  .floating-mission strong {
    font-size:.8125rem;
  }
  .floating-mission small {
    font-size:.75rem;
  }
  .mission-icon {
    width:37px;
    height:37px;
  }
  .visual-caption {
    bottom:1px;
    left:95px;
    font-size:.75rem;
  }
  .spark-one {
    top:52px;
    left:75px;
  }
  .spark-two {
    right:23px;
    bottom:94px;
  }
  .stats-strip {
    padding-block:34px;
  }
  .stats-strip strong {
    font-size:2.3rem;
  }
  .buy-section {
    padding-block:100px;
  }
}
@media(max-width:359px) {
  .brand {
    font-size:.75rem;
  }
  .brand-icon {
    width:30px;
    height:30px;
  }
  .header-buy {
    padding-inline:12px;
  }
  .hero-actions {
    gap:8px;
  }
  .hero-actions .button {
    padding-inline:13px;
    font-size:.8125rem;
  }
  .floating-code {
    width:219px;
  }
  .small-note {
    font-size:.75rem;
  }
  .hero-visual {
    height:380px;
  }
  .hero-orbit {
    width:280px;
  }
  .orbit-two {
    width:300px;
  }
  .hero-book {
    width:190px;
  }
  .store-card {
    padding:20px 16px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}
/* The remaining book story follows the same glass, blue and yellow palette. */
[hidden] {
  display:none!important;
}
main {
  overflow:clip;
}
.text-blue {
  color:var(--blue);
}
.section-heading {
  text-align:center;
  max-width:770px;
  margin:0 auto 36px;
}
.section-heading .section-intro {
  max-width:660px;
  margin-inline:auto;
}
.journey-section {
  padding-block:60px;
  background:linear-gradient(145deg,#eff5fd,#f1f5fb88 60%,#fafbfe);
  border-block:1px solid #e9eef5;
}
.journey-layout {
  display:grid;
  gap:38px;
}
.journey-intro {
  text-align:center;
}
.journey-intro .section-intro {
  max-width:400px;
  margin-inline:auto;
}
.journey-note {
  display:none;
  align-items:center;
  gap:15px;
  width:fit-content;
  padding:15px 20px;
  border-radius:19px;
  margin-top:28px;
  text-align:right;
}
.journey-note>.icon {
  width:29px;
  height:29px;
  color:#608cb6;
}
.journey-note p {
  font-size:.875rem;
  color:#728398;
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:.875rem;
  font-weight:500;
  color:var(--blue);
  padding-block:10px;
}
.text-link:hover {
  text-decoration:underline;
  text-underline-offset:5px;
}
.journey-intro>.text-link {
  margin-top:15px;
}
.chapter-list {
  border-top:1px solid #dce5ef;
}
.chapter {
  border-bottom:1px solid #dce5ef;
}
.chapter summary {
  display:flex;
  align-items:center;
  gap:16px;
  list-style:none;
  cursor:pointer;
  padding:21px 3px;
}
.chapter summary::-webkit-details-marker,.faq-item summary::-webkit-details-marker {
  display:none;
}
.chapter-number {
  font-size:1rem;
  font-weight:600;
  line-height:1;
  color:#8296ad;
  min-width:28px;
}
.chapter summary>span:nth-child(2) {
  flex:1;
}
.chapter summary small {
  font-size:.75rem;
  color:#637186;
  display:block;
  margin-bottom:3px;
}
.chapter summary strong {
  font-size:1rem;
  font-weight:600;
}
.chapter summary>.icon {
  width:18px;
  height:18px;
  color:#637186;
  transition:transform .2s;
}
.chapter[open] summary>.icon,.faq-item[open] summary>.icon {
  transform:rotate(45deg);
  color:var(--blue);
}
.chapter[open] .chapter-number,.chapter[open] summary strong {
  color:var(--blue);
}
.chapter-body {
  padding:0 47px 25px 5px;
}
.chapter-body p {
  font-size:1rem;
  color:var(--muted);
  line-height:2;
}
.chapter-project {
  display:block;
  font-size:.8125rem;
  color:#446a91;
  margin-top:15px;
}
.code-tags {
  display:flex;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
  margin-top:13px;
}
.code-tags span {
  font:400 .75rem/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;
  background:#fff9;
  border:1px solid #dfe9f4;
  border-radius:7px;
  padding:4px 7px;
  color:#5a7c9d;
}
.inside-section {
  padding-block:75px;
}
.inside-layout {
  display:grid;
  gap:28px;
  align-items:center;
}
.book-preview {
  overflow:hidden;
  border-radius:var(--radius);
  padding:11px;
  min-width:0;
  background:#e5f0ff85;
}
.preview-expand {
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:20px;
  cursor:zoom-in;
}
.preview-expand img {
  width:100%;
  aspect-ratio:1;
  object-fit:contain;
  transition:opacity .2s;
}
.zoom-hint {
  position:absolute;
  bottom:14px;
  left:14px;
  display:flex;
  align-items:center;
  gap:4px;
  padding:4px 11px;
  font-size:.75rem;
  border-radius:20px;
  color:#466787;
  background:#ffffffbd;
}
.zoom-hint .icon {
  width:14px;
}
.preview-controls {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 5px 2px;
}
.round-button {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  flex-shrink:0;
  background:#ffffffaf;
  border:1px solid #fff;
  border-radius:50%;
  color:#56799e;
  transition:background .2s;
}
.round-button:hover {
  background:#fff;
}
.round-button .icon {
  width:19px;
  height:19px;
}
#preview-next .icon {
  transform:rotate(180deg);
}
#preview-caption {
  font-size:.75rem;
  color:#527091;
  text-align:center;
}
.inside-copy {
  padding-top:10px;
}
.book-label {
  font-size:.8125rem;
  color:var(--blue);
}
.inside-copy h3 {
  font-size:1.6rem;
  line-height:1.8;
  margin-block:12px 18px;
}
.inside-copy>p {
  color:var(--muted);
  font-size:1rem;
  line-height:2.1;
}
.check-list {
  list-style:none;
  margin:23px 0;
  padding:0;
  display:grid;
  gap:12px;
  font-size:.875rem;
}
.check-list li {
  display:flex;
  align-items:flex-start;
  gap:9px;
}
.check-list .icon {
  width:19px;
  height:19px;
  color:var(--blue);
  margin-top:4px;
}
.book-credit {
  display:flex;
  gap:30px;
  border-block:1px solid var(--line);
  padding-block:17px;
  margin-block:24px 17px;
}
.book-credit>span {
  font-size:.75rem;
  color:var(--muted);
}
.book-credit strong {
  display:block;
  font-size:.875rem;
  color:#41566e;
  font-weight:600;
  margin-top:3px;
}
.inside-copy>.text-link {
  font-size:.8125rem;
  flex-wrap:wrap;
}
.inside-copy>.text-link .icon {
  width:19px;
}
.quote-section {
  display:grid;
  overflow:hidden;
  background:#fff;
  border:1px solid #edf2f8;
  border-radius:30px;
}
.quote-copy {
  padding:30px;
}
.quote-copy .section-kicker {
  font-size:.8125rem;
}
.quote-copy blockquote {
  margin:0 0 14px;
  font-weight:750;
  font-size:1.6rem;
  line-height:1.9;
  letter-spacing:-.04em;
}
.quote-copy>p {
  color:var(--muted);
  line-height:2;
  font-size:1rem;
}
.quote-author {
  font-size:.875rem;
  display:block;
  margin-top:22px;
  font-weight:600;
}
.quote-author>span {
  display:block;
  font-weight:400;
  color:#637186;
  font-size:.75rem;
  margin-top:3px;
}
.faq-section {
  padding-block:75px;
}
.faq-list {
  max-width:800px;
  margin:auto;
}
.faq-item {
  border-bottom:1px solid var(--line);
}
.faq-item summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:24px 0;
  font-size:.9375rem;
  font-weight:600;
  line-height:1.9;
}
.faq-item summary>.icon {
  width:19px;
  height:19px;
  transition:transform .2s;
  color:#91a2b5;
}
.faq-item p {
  padding:0 0 24px 35px;
  font-size:1rem;
  line-height:2.1;
  color:var(--muted);
}
.faq-item a {
  color:var(--blue);
  text-decoration:underline;
  text-underline-offset:4px;
}
.buy-section {
  position:relative;
  isolation:isolate;
  background:radial-gradient(ellipse at 75% 70%,#e0efffa1,transparent 65%),radial-gradient(ellipse at 15% 50%,#fff4cb80,transparent 55%);
  border-top:1px solid #e6edf6;
  padding-block:65px 55px;
}
.buy-section>.section-shell {
  max-width:860px;
}
.buy-section h2 {
  font-size:clamp(1.65rem,4vw,2.8rem);
}
.store-grid {
  gap:16px;
  margin-top:36px;
  text-align:right;
}
.store-card {
  display:block;
  padding:24px;
  border:1px solid #fff;
  background:#ffffffb3;
}
.store-card.store-kian {
  box-shadow:0 8px 32px #478de416,0 0 0 1px #98c8ff4d;
}
.store-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:25px;
  gap:10px;
}
.store-mark {
  height:43px;
  display:flex;
  align-items:center;
  font-weight:800;
}
.kian-mark {
  width:43px;
  justify-content:center;
  color:#39604d;
  background:#eaf3ec;
  border-radius:13px;
}
.kian-mark .icon {
  width:25px;
  height:25px;
  margin:0;
}
.fidibo-mark {
  color:#078f91;
  font-size:1.3rem;
  letter-spacing:-1px;
}
.store-type {
  font-size:.75rem;
  color:#637186;
}
.store-card>strong {
  font-size:1.3rem;
  font-weight:700;
}
.store-card>p {
  font-size:.875rem;
  color:#637186;
  margin-block:7px 24px;
}
.store-card>.store-action {
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:var(--blue);
  color:#fff;
  padding:11px 17px;
  border-radius:13px;
  font-size:.875rem;
  font-weight:500;
  min-height:47px;
}
.store-fidibo>.store-action {
  background:#eef5fe;
  color:#2476c8;
}
.store-fidibo:hover>.store-action {
  background:#e0edfc;
}
.upcoming-stores {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:16px;
}
.upcoming-store {
  border:1px solid #dce5ef9e;
  border-radius:15px;
  padding:16px 8px;
  color:#637186;
  background:#ffffff3b;
}
.upcoming-store strong {
  font-size:.875rem;
  font-weight:600;
}
.upcoming-store>span {
  display:block;
  font-size:.75rem;
  color:#637186;
  margin-top:3px;
}
.purchase-note {
  font-size:.75rem;
  color:#637186;
  margin-top:25px;
}
.mobile-buy {
  position:fixed;
  bottom:max(12px,env(safe-area-inset-bottom));
  right:14px;
  left:14px;
  z-index:15;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-radius:22px;
  padding:10px 13px;
  background:#ffffffd4;
  box-shadow:0 6px 30px #27486a24;
}
.mobile-buy>span {
  font-size:.75rem;
  line-height:1.8;
}
.mobile-buy small {
  display:block;
  font-size:.75rem;
  color:#637186;
}
.mobile-buy .button {
  font-size:.8125rem;
  min-height:43px;
  padding:9px 16px;
  gap:7px;
}
.mobile-buy .icon {
  width:17px;
}
.preview-dialog {
  position:fixed;
  padding:0;
  margin:auto;
  width:min(1000px,calc(100% - 24px));
  max-height:90dvh;
  border:1px solid #ffffffbb;
  border-radius:22px;
  background:#f2f7ff;
  box-shadow:0 24px 120px #14274245;
  color:var(--ink);
  overscroll-behavior:contain;
}
.preview-dialog::backdrop {
  background:#1935527d;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.dialog-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 17px;
  gap:20px;
  position:sticky;
  top:0;
  background:#f3f8fff2;
  z-index:1;
  border-bottom:1px solid var(--line);
}
.dialog-header h2 {
  font-size:1rem;
  font-weight:600;
  letter-spacing:0;
}
.dialog-image-wrap {
  padding:10px;
}
.dialog-image-wrap img {
  border-radius:12px;
  width:100%;
}
.preview-dialog>p {
  text-align:center;
  color:var(--muted);
  font-size:.75rem;
  padding:4px 16px 18px;
}
body.dialog-open {
  overflow:hidden;
}
@media(min-width:600px) {
  .quote-section {
    grid-template-columns:1fr 1.2fr;
    align-items:center;
  }
  .quote-lifestyle {
    grid-column:1;
    grid-row:1;
  }
  .quote-copy {
    grid-column:2;
    grid-row:1;
    padding:28px;
  }
  .upcoming-store {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 22px;
  }
  .upcoming-store>span {
    margin:0;
  }
  .site-footer {
    padding-bottom:100px;
  }
}
@media(min-width:960px) {
  .section-heading {
    margin-bottom:44px;
  }
  .journey-section {
    padding-block:90px;
  }
  .journey-layout {
    grid-template-columns:.85fr 1.15fr;
    gap:95px;
  }
  .journey-intro {
    position:sticky;
    top:60px;
    align-self:start;
    text-align:right;
    padding-top:22px;
  }
  .journey-intro .section-intro {
    margin-inline:0;
  }
  .journey-note {
    display:flex;
  }
  .journey-intro>.text-link {
    margin-top:25px;
  }
  .chapter summary {
    padding-block:22px;
  }
  .chapter summary strong {
    font-size:1.125rem;
  }
  .chapter-number {
    min-width:34px;
  }
  .chapter summary small {
    font-size:.75rem;
  }
  .chapter-body {
    padding-inline-start:53px;
  }
  .inside-section {
    padding-block:100px;
  }
  .inside-layout {
    grid-template-columns:1.05fr 1fr;
    gap:64px;
    direction:ltr;
  }
  .inside-layout>* {
    direction:rtl;
  }
  .inside-copy {
    padding:0;
  }
  .inside-copy h3 {
    font-size:1.9rem;
  }
  .inside-copy>p {
    max-width:450px;
  }
  .book-preview {
    padding:15px;
  }
  .preview-controls {
    padding:16px 5px 2px;
  }
  #preview-caption {
    font-size:.8125rem;
  }
  .quote-section {
    grid-template-columns:.8fr 1.2fr;
    border-radius:32px;
  }
  .quote-copy {
    padding:42px 50px;
  }
  .quote-copy blockquote {
    font-size:2rem;
  }
  .quote-copy>p {
    max-width:490px;
  }
  .faq-section {
    padding-block:100px;
  }
  .faq-item summary {
    font-size:1rem;
  }
  .buy-section {
    padding-block:90px 70px;
  }
  .store-card {
    padding:29px 30px;
  }
  .store-grid {
    gap:20px;
  }
  .store-top {
    margin-bottom:28px;
  }
  .upcoming-stores {
    margin-top:20px;
    gap:15px;
  }
  .mobile-buy {
    display:none!important;
  }
  .site-footer {
    padding-block:30px;
  }
}
@media(max-width:599px) {
  .site-footer {
    padding-bottom:95px;
  }
}
@media(prefers-reduced-motion:no-preference) {
  .reveal-ready {
    opacity:0;
    transform:translateY(18px);
    transition:opacity .65s,transform .65s;
  }
  .reveal-ready.is-visible {
    opacity:1;
    transform:none;
  }
}
/* Keep the cover and both actions prominent on a small phone. */
@media(max-width:599px) {
  .hero {
    padding-top:32px;
    padding-bottom:28px;
    gap:10px;
  }
  h1 {
    margin-top:18px;
    margin-bottom:16px;
  }
  .hero-actions {
    gap:9px;
    margin-top:23px;
  }
  .hero-actions .button {
    font-size:.875rem;
    padding:11px 13px;
    gap:7px;
    min-height:49px;
  }
  .hero-actions .icon {
    width:18px;
    height:18px;
  }
  .author-line {
    margin-top:22px;
    gap:8px;
  }
  .author-line .small-note,.author-separator {
    display:none;
  }
  .author-line>span:nth-child(2) {
    display:flex;
    align-items:baseline;
    gap:10px;
  }
  .author-line strong {
    font-size:.8125rem;
  }
  .author-monogram {
    width:32px;
    height:32px;
    font-size:.75rem;
  }
  .hero-visual {
    height:350px;
  }
  .book-float {
    width:193px;
  }
  .floating-code {
    bottom:10px;
    width:224px;
  }
  .floating-mission {
    top:26px;
    padding:8px 10px;
    gap:7px;
  }
  .floating-mission strong {
    font-size:.75rem;
  }
  .floating-mission small {
    font-size:.75rem;
  }
  .visual-caption {
    bottom:-14px;
    font-size:.75rem;
    letter-spacing:1.25px;
  }
  .hero-orbit {
    width:290px;
    height:260px;
  }
  .orbit-two {
    width:335px;
    height:295px;
  }
}
@media(max-width:359px) {
  .hero-actions {
    flex-direction:column;
    align-items:stretch;
    max-width:240px;
    margin-inline:auto;
  }
  .author-line>span:nth-child(2) {
    display:block;
  }
  .author-line strong {
    font-size:.8125rem;
  }
  .floating-mission {
    right:-5px;
    top:18px;
  }
  .floating-code {
    left:-5px;
  }
  .brand {
    gap:5px;
    font-size:.75rem;
  }
  .header-buy {
    padding-inline:10px;
  }
  .header-buy .icon {
    display:none;
  }
  .mobile-buy .button {
    padding-inline:12px;
  }
}

/* Verified chapter contents and publication helpers. */
.toc-chapters{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:19px}
.toc-chapters>li{padding-inline-start:13px;border-inline-start:2px solid #caddf1}
.toc-chapter-no{font-size:.75rem;color:#597b9c}
.toc-chapters h4{margin:4px 0 6px;font-size:.9375rem;font-weight:600;line-height:1.9;color:#354e69}
.toc-chapters li>span:last-child{font-size:.8125rem;color:#637a91;line-height:1.9;display:block}
.available-store{color:var(--blue);border-color:#bfd8f3;background:#fff8;transition:background .2s}
.available-store:hover{background:#fff}
.available-store>span{color:var(--blue)}
.error-page{min-height:100dvh;display:grid;place-items:center;padding:25px}
.error-card{padding:clamp(26px,6vw,65px);text-align:center;max-width:640px;border-radius:32px}
.error-card h1{font-size:clamp(2.3rem,7vw,3.7rem);margin:14px 0 20px}
.error-card>p{color:var(--muted);margin-bottom:28px}

@media(min-width:960px) { .site-header { position:sticky; top:16px; } }

/* Image-led introduction and chapter projects. */
.workshop { padding-block:64px 72px; }
.campaign-banner { display:block; border-radius:24px; overflow:hidden; border:1px solid #fff; box-shadow:0 18px 48px #345e8f12; }
.campaign-banner picture, .campaign-banner img { display:block; width:100%; }
.campaign-banner img { height:auto; aspect-ratio:1; object-fit:contain; }
.workshop-heading { display:grid; gap:16px; margin:48px 0 28px; }
.workshop-heading h2 { font-size:clamp(1.85rem,3.8vw,3rem); margin:10px 0 0; line-height:1.65; letter-spacing:-.04em; }
.workshop-heading>p { color:var(--muted); max-width:410px; font-size:.9375rem; line-height:2.1; margin:0; }
.projects-carousel { position:relative; }
.projects-carousel:not(.is-ready) .projects-toolbar,.projects-carousel:not(.is-ready) .projects-progress { display:none; }
.projects-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.projects-status { margin:0; font-size:.8125rem; color:var(--muted); }
.projects-controls { display:flex; gap:8px; }
.projects-controls .round-button { background:#fff; border-color:#e6eef7; box-shadow:0 4px 12px #35608a0f; }
.projects-controls .round-button:hover { background:#f3f8ff; }
#projects-next .icon { transform:scaleX(-1); }
.project-track { --per-view:1.15; --gap:14px; display:flex; gap:var(--gap); list-style:none; margin:0 -2px; padding:8px 2px 14px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; }
.project-track::-webkit-scrollbar { display:none; }
.project-track>.project-card { flex:0 0 calc((100% - (var(--per-view) - 1) * var(--gap)) / var(--per-view)); scroll-snap-align:start; min-width:0; }
.projects-progress { height:4px; border-radius:99px; background:#e4ecf5; overflow:hidden; }
.projects-progress>span { display:block; height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg,var(--blue),#5aa8ff); transition:width .45s ease; }
.project-card { display:flex; flex-direction:column; padding:23px; border-radius:22px; border:1px solid #fff; background:linear-gradient(145deg,#fffefbdb,#ffffff7a); box-shadow:0 8px 26px #40639207; position:relative; }
.project-card:nth-child(even) { background:linear-gradient(145deg,#f0f7ffeb,#ffffff8a); }
.project-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.project-card-top>span:first-child { font-size:.75rem; color:#5a718a; }
.project-mark { font:700 1.45rem/1 ui-monospace,monospace; color:#2877bd; width:44px; height:44px; display:grid; place-items:center; border-radius:15px; border:1px solid #fff; background:linear-gradient(145deg,#fff,#e0efff); box-shadow:0 4px 13px #2e619d0d; }
.project-card:nth-child(odd) .project-mark { color:#927023; background:linear-gradient(145deg,#fffdf4,#fff0b4); }
.project-card h3 { font-size:1.0625rem; margin:19px 0 10px; line-height:1.8; }
.project-card p { font-size:.875rem; line-height:2; color:var(--muted); margin:0 0 20px; }
.project-tech { display:block; width:fit-content; margin-top:auto; padding:4px 10px; border-radius:8px; font:500 .6875rem/1.7 ui-monospace,monospace; color:#587188; background:#eaf0f680; }

/* The printed rank milestones are a reading map, without simulated progress. */
.rank-journey { position:relative; isolation:isolate; margin-top:34px; padding:26px 22px 19px; color:#f5f8fc; background:radial-gradient(ellipse at 0% 0%,#32628a70,transparent 65%),linear-gradient(130deg,#142d48,#192b43 70%); border:1px solid #ffffff80; border-radius:25px; box-shadow:0 18px 45px #193c601c,inset 0 1px 0 #ffffff2e; }
.rank-intro { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.rank-eyebrow { color:#b7cee5; font-size:.6875rem; }
.rank-intro h3 { font-size:1.3rem; margin:9px 0; line-height:1.7; }
.rank-intro p { font-size:.8125rem; line-height:2; color:#bdcfe1; margin:0; max-width:540px; }
.rank-emblem { flex:none; width:67px; height:86px; display:flex; flex-direction:column; justify-content:center; align-items:center; border:1px solid #d2b66066; border-radius:20px 20px 30px 30px; transform:rotate(-5deg); background:linear-gradient(145deg,#fbe79924,#fff4b108); box-shadow:inset 0 1px 1px #ffefb543,0 8px 28px #070e201f; color:#ffdf79; }
.rank-emblem b { font:700 2.6rem/1 ui-monospace,monospace; text-shadow:0 0 24px #ffdc7066; }
.rank-emblem span { font-size:.625rem; margin-top:8px; }
.rank-track { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:21px 12px; margin:28px 0; padding:0; }
.rank-step { min-width:0; position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; }
.rank-step b { display:grid; place-items:center; width:35px; height:35px; margin-bottom:5px; font:600 .9375rem/1 ui-monospace,monospace; color:#dbeeff; border:1px solid #6e91b576; border-radius:50%; background:#213a53; z-index:1; }
.rank-step>span { font-size:.75rem; color:#d0deec; }
.rank-step small { font-size:.625rem; color:#9eb5cc; }
.rank-finale b { color:#14293f; background:linear-gradient(145deg,#fff1ac,#f3cd58); border-color:#ffe287; box-shadow:0 0 20px #f5d5741a; }
.rank-finale>span { color:#f5da8a; }
.rank-footnote { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:7px 16px; padding-top:15px; border-top:1px solid #ffffff1c; font-size:.6875rem; color:#afc5da; }
.rank-footnote b { display:inline-block; font:500 .6875rem/1.7 ui-monospace,monospace; color:#f9db84; margin-inline:4px; }
.inside-copy>.text-link { display:flex; width:fit-content; min-height:44px; }
.inside-copy>.sample-link { margin-top:23px; margin-bottom:6px; }

/* The book photograph sits beside the author’s words. */
.quote-section { grid-template-columns:1fr; gap:0; padding:10px; }
.quote-copy { grid-row:1; padding:24px 18px; }
.quote-lifestyle { min-width:0; padding:6px; align-self:center; }
.quote-lifestyle img { display:block; width:100%; height:auto; border-radius:17px; aspect-ratio:1; object-fit:contain; }
@media(min-width:540px) {
  .project-track { --per-view:2; }
  .rank-emblem { width:90px; height:110px; }
  .rank-emblem b { font-size:3.25rem; }
  .rank-track { grid-template-columns:repeat(9,minmax(0,1fr)); gap:0; }
  .rank-step:not(:last-child)::after { content:""; position:absolute; width:100%; height:1px; top:17px; right:50%; background:#5c7c9b7d; }
  .rank-step>span { font-size:.6875rem; }
}
@media(min-width:680px) {
  .campaign-banner img { aspect-ratio:1600/533; }
  .workshop-heading { grid-template-columns:1.25fr 1fr; align-items:end; gap:40px; }
  .rank-journey { padding:32px 32px 22px; }
  .rank-intro h3 { font-size:1.65rem; }
  .rank-eyebrow,.rank-footnote { font-size:.75rem; }
  .rank-intro p { font-size:.875rem; }
  .rank-step>span { font-size:.8125rem; }
  .rank-step small { font-size:.6875rem; }
  .rank-track { margin:30px 0; }
}
@media(min-width:960px) {
  .workshop { padding-block:80px 95px; }
  .campaign-banner { border-radius:30px; }
  .workshop-heading { margin-top:60px; margin-bottom:32px; }
  .project-track { --per-view:4; --gap:16px; }
  .project-card { padding:23px 21px; }
  .project-card h3 { min-height:3.6em; font-size:1.0625rem; }
  .rank-journey { margin-top:42px; padding-inline:38px; }
  .rank-intro h3 { margin:7px 0; }
  .rank-track { margin:22px 0 27px; }
  .quote-section { grid-template-columns:1fr 1.45fr; padding:16px; gap:16px; }
  .quote-lifestyle { grid-column:1; grid-row:1; padding:0; }
  .quote-copy { grid-column:2; grid-row:1; padding:30px 36px; }
  .quote-copy blockquote { font-size:1.8rem; }
}

@media (prefers-reduced-motion:no-preference) {
  .project-card,.campaign-banner { transition:transform .3s ease,box-shadow .3s ease,opacity .6s ease; }
  .rank-journey.is-visible .rank-emblem { animation:rank-arrive .7s ease-out both; }
  @keyframes rank-arrive {
    from { opacity:.3; transform:translateY(9px) rotate(-12deg); }
    to { opacity:1; transform:translateY(0) rotate(-5deg); }
  }
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .project-card:hover { transform:translateY(-4px); box-shadow:0 13px 28px #355d8812; }
  .campaign-banner:hover { transform:translateY(-3px); box-shadow:0 22px 48px #345e8f20; }
}
