/* "Your personal order" landing-page compositions.
   The shared shell, typography, and components continue to come from site.css and home.css. */

.order-hero-visual{background:var(--surface);border:1px solid var(--border);border-radius:18px;
  padding:22px;box-shadow:var(--shadow);display:grid;gap:16px;overflow:hidden}
.order-visual-label{font:11px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.order-source-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.order-source{border:1px solid var(--border);border-radius:11px;padding:12px;background:var(--bg)}
.order-source b{display:block;font-size:14px}
.order-source span{display:block;margin-top:3px;color:var(--muted);font-size:12.5px}
.order-rule-list{display:grid;gap:8px;position:relative}
.order-rule{display:grid;grid-template-columns:78px 1fr auto;align-items:center;gap:10px;
  border:1px solid var(--border);border-radius:11px;padding:10px 12px;background:var(--surface-2)}
.order-rule b{font:650 12px/1.2 var(--mono);color:var(--accent-text)}
.order-rule code{font:11.5px/1.4 var(--mono);color:var(--muted);overflow-wrap:anywhere}
.order-rule .route{color:var(--verify);font-size:16px}
.order-tree{border-left:2px solid var(--accent);padding-left:14px;display:grid;gap:7px}
.order-tree div{font:12px/1.45 var(--mono);color:var(--text);overflow-wrap:anywhere}
.order-tree span{color:var(--faint)}
.order-visual-note{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12.5px}
.order-visual-note::before{content:"✓";width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  background:var(--verify-soft);color:var(--verify);font-weight:700}

.order-thesis{padding-top:28px;padding-bottom:34px}
.order-thesis-in{max-width:78ch}
.order-thesis h2{font-size:clamp(28px,4vw,42px);margin-top:12px}
.order-thesis .lead{margin-top:18px;font-size:clamp(18px,2.2vw,21px);line-height:1.55}
.source-choices{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.source-choice{border:1px solid var(--border);border-radius:var(--radius);padding:24px;background:var(--surface)}
.source-choice .eyebrow{color:var(--verify)}
.source-choice h3{font-size:21px;margin-top:10px}
.source-choice p{margin-top:10px;color:var(--muted);font-size:15px}
.order-autonomy{margin-top:18px;border:1px solid color-mix(in srgb,var(--accent) 44%,var(--border));
  border-radius:var(--radius);padding:24px;background:color-mix(in srgb,var(--accent) 7%,var(--surface))}
.order-autonomy h3{font-size:22px;margin-top:10px}
.order-autonomy > p:last-child{margin-top:10px;color:var(--muted);font-size:15.5px;max-width:74ch}

.order-system{background:var(--surface-2);border-block:1px solid var(--border)}
.order-system .steps{grid-template-columns:repeat(4,minmax(0,1fr))}
.order-system .step h3{line-height:1.18}

.recipe-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:start;margin-top:34px}
.recipe-copy{display:grid;gap:14px;color:var(--muted);font-size:16px}
.recipe-copy h3{font-size:clamp(22px,2.5vw,28px);line-height:1.15}
.recipe-copy strong{color:var(--text)}
.recipe-shot{margin:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.recipe-shot img{display:block;width:100%;height:auto}
.order-prose-shot{margin-top:28px}
.order-assurance{margin-top:clamp(52px,6vw,76px);padding-top:clamp(42px,5vw,60px);border-top:1px solid var(--border)}
.order-assurance-head{max-width:920px}
.order-assurance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:34px;align-items:stretch}
.order-assurance-grid .card{height:100%}
.order-assurance-grid .card strong{color:var(--text)}
.order-assurance-more{margin:0}
.order-system-trial{margin-top:clamp(38px,4vw,52px);padding-inline:0}

.order-page-hero{padding-top:66px;padding-bottom:12px;max-width:76ch}
.order-page-hero h1{font-size:clamp(34px,5vw,52px);margin-top:16px}
.order-page-hero .lede{max-width:62ch;margin-top:20px}
.order-prose{max-width:76ch;margin-inline:auto;padding:12px 0 80px}
.order-prose h2{font-size:clamp(24px,3.2vw,31px);margin-top:52px;line-height:1.15}
.order-prose h3{font-size:19px;margin-top:28px;line-height:1.2}
.order-prose p{margin-top:14px;color:var(--muted);font-size:16.5px}
.order-prose strong{color:var(--text)}
.order-prose ul,.order-prose ol{margin:14px 0 0;padding-left:24px;color:var(--muted)}
.order-prose li{margin-top:8px}

.token-table{margin-top:22px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.token-row{display:grid;grid-template-columns:170px 1fr;gap:1px;background:var(--border);border-bottom:1px solid var(--border)}
.token-row:last-child{border-bottom:0}
.token-row > *{background:var(--surface);padding:13px 16px}
.token-row code{font:12.5px/1.5 var(--mono);color:var(--accent-text)}
.token-row span{font-size:14px;color:var(--muted)}

.pattern-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:22px}
.pattern-example{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);padding:18px}
.pattern-example b{display:block;font-size:15px}
.pattern-example code{display:block;margin-top:10px;padding:10px;border-radius:8px;background:var(--surface-2);
  color:var(--text);font:12px/1.55 var(--mono);overflow-wrap:anywhere}
.pattern-example p{font-size:14px;margin-top:9px}
.pattern-example.good{border-color:color-mix(in srgb,var(--verify) 42%,var(--border))}
.pattern-example.warn{border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}

.archive-examples{margin-top:22px}
.archive-examples .qa summary{align-items:center}
.archive-example-summary{display:grid;gap:8px}
.archive-example-case{font-weight:500}
.archive-example-recommendation{color:var(--accent-text);font-weight:680}
.archive-example-rules{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.order-design .order-prose section.archive-example-rule{padding:0}
.archive-example-rule{border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.order-design .order-prose .archive-example-rule h3{margin:0;padding:14px 16px;font-size:15.5px;line-height:1.2;background:color-mix(in srgb,var(--accent) 6%,var(--surface))}
.archive-example-rule > div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;padding:11px 14px;border-top:1px solid var(--border)}
.archive-example-rule span{color:var(--faint);font:11px/1.45 var(--mono);text-transform:uppercase;letter-spacing:.05em}
.archive-example-rule code{color:var(--text);font:12px/1.5 var(--mono);overflow-wrap:anywhere}

.criteria-groups{display:grid;gap:28px;margin-top:36px}
.criteria-group{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden}
.criteria-group-head{padding:22px 24px;background:var(--surface-2)}
.criteria-group-head h2{font-size:23px}
.criteria-group-head p{margin-top:8px;color:var(--muted);font-size:14.5px}
.criterion{padding:18px 24px;border-top:1px solid var(--border)}
.criterion h3{font-size:17px}
.criterion p{margin-top:6px;color:var(--muted);font-size:14.5px}
.criteria-note{margin-top:28px;padding:20px 22px;border-left:3px solid var(--accent);background:var(--surface);
  color:var(--muted);font-size:15px}

.review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:30px}
.review-card{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);padding:22px}
.review-card h2{font-size:20px}
.review-card p{margin-top:9px;color:var(--muted);font-size:14.5px}
.review-card a{display:inline-block;margin-top:14px;color:var(--accent-text);text-decoration:underline;text-underline-offset:3px}
.review-status{display:inline-flex;margin-top:12px;border-radius:999px;padding:4px 9px;background:var(--verify-soft);
  color:var(--verify);font:11px/1.3 var(--mono)}

/* Visual system for the full Russian concept pages.
   Scoped to .order-design so comparison experiments can evolve independently. */
.order-design{
  --order-reading:820px;
  --order-review:980px;
  --order-section:clamp(52px,5.2vw,66px);
  --order-card-pad:clamp(21px,2.2vw,28px);
}
.order-design :where(h1,h2,h3){font-family:var(--font)}
.order-design :where(.eyebrow,.mono){font-family:var(--mono)}
.order-design footer{margin-top:0}
.order-design main > section{padding-block:var(--order-section)}
.order-design .hero{padding-top:clamp(46px,6vw,66px);padding-bottom:clamp(42px,5vw,60px)}
.order-design .hero-grid{gap:clamp(38px,5vw,58px);align-items:center}
.order-design .hero-copy h1{margin-top:18px;font-size:clamp(40px,10.5cqi,58px)}
.order-design .hero-copy .lede{line-height:1.55}
.order-design .order-hero-visual{padding:clamp(20px,2.2vw,26px);gap:17px}

.order-design .shead{max-width:760px}
.order-design .shead h2{font-size:clamp(30px,3.6vw,40px);line-height:1.08}
.order-design .shead p{max-width:66ch;line-height:1.65}
.order-design .feat{gap:20px;margin-top:40px}
.order-design .card{padding:var(--order-card-pad)}
.order-design .card h3{font-size:20px;line-height:1.18}
.order-design .card p{font-size:15.5px;line-height:1.65}

.order-design .order-thesis{padding-block:var(--order-section);border-top:1px solid var(--border)}
.order-design .order-thesis-in{
  max-width:var(--maxw);
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(460px,1.12fr);
  gap:clamp(42px,6vw,72px);
  align-items:center;
}
.order-design .order-thesis-copy{max-width:46ch}
.order-design .order-thesis h2{font-size:clamp(32px,4vw,44px);line-height:1.06}
.order-design .order-thesis .lead{font-size:clamp(17px,1.7vw,20px);line-height:1.62;color:var(--muted)}
.order-design .order-thesis-diagram{display:grid;gap:14px;position:relative}
.order-design .source-choices{grid-template-columns:1fr;gap:14px;margin-top:0}
.order-design .source-choice{
  position:relative;
  padding:var(--order-card-pad);
  box-shadow:0 1px 0 color-mix(in srgb,var(--border) 72%,transparent);
}
.order-design .source-choice::before{
  content:"";
  position:absolute;
  top:25px;
  left:-7px;
  width:12px;
  height:12px;
  border-radius:50%;
  border:3px solid var(--bg);
  background:var(--verify);
}
.order-design .source-choice h3{font-size:20px;line-height:1.2}
.order-design .source-choice p:last-child{font-size:15px;line-height:1.62}
.order-design .order-autonomy{
  position:relative;
  margin-top:0;
  padding:var(--order-card-pad);
  box-shadow:var(--shadow);
}
.order-design .order-autonomy::before{
  content:"↓";
  position:absolute;
  left:24px;
  top:-21px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:1px solid var(--border);
  border-radius:50%;
  background:var(--bg);
  color:var(--accent-text);
  font:700 16px/1 var(--mono);
}
.order-design .order-autonomy h3{font-size:21px;line-height:1.18}
.order-design .order-autonomy > p:last-child{font-size:15px;line-height:1.62}

.order-design .order-system .steps{margin-top:38px}
.order-design .order-system .step{padding:var(--order-card-pad)}
.order-design .order-system .step h3{font-size:18px;line-height:1.22}
.order-design .order-system .step p{font-size:14.5px;line-height:1.6}
.order-design .recipe-grid{grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,46px);margin-top:42px}
.order-design .recipe-copy{font-size:16px;line-height:1.68;gap:16px}
.order-design .trial-band{padding-bottom:0}
.order-design .promise-in{padding:var(--order-card-pad)}
.order-design .promise-in h3{font-size:20px}
.order-design .promise-in p{font-size:15.5px;line-height:1.62}
.order-design .shots{margin-top:40px;gap:54px 22px}
.order-design .shot figcaption{font-size:14px;line-height:1.6;margin-top:2px}
.order-design .about-copy{
  max-width:760px;
  margin-top:30px;
  color:var(--muted);
  font-size:16px;
  line-height:1.72;
  display:grid;
  gap:17px;
}
.order-design .order-plan-label{color:var(--muted)}
.order-design .order-compare-link{margin-top:18px}
.order-design .order-compare-link a,
.order-design .order-inline-link{
  color:var(--accent-text);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:var(--accent);
}

.order-design .order-page-hero{
  max-width:var(--order-reading);
  margin-inline:auto;
  padding-top:clamp(58px,7vw,78px);
  padding-bottom:clamp(24px,4vw,38px);
}
.order-design.order-review-page .order-page-hero{max-width:var(--order-review)}
.order-design .order-page-hero h1{
  max-width:19ch;
  margin-top:16px;
  font-size:clamp(36px,5vw,54px);
  font-weight:680;
  line-height:1.04;
}
.order-design .order-page-hero .lede{
  max-width:64ch;
  margin-top:20px;
  font-size:clamp(17px,2vw,20px);
  line-height:1.62;
}
.order-design .order-reading,
.order-design .order-prose{width:100%;max-width:var(--order-reading);margin-inline:auto}
.order-design .order-prose{padding:8px 0 clamp(56px,6vw,72px)}
.order-design .wrap.order-prose{padding-inline:24px}
.order-design .order-prose h2{
  margin-top:clamp(42px,5vw,52px);
  font-size:clamp(25px,3vw,30px);
  line-height:1.16;
}
.order-design .order-prose h3{font-size:20px;line-height:1.22}
.order-design .order-prose > h2:first-child{margin-top:24px}
.order-design .order-prose p,
.order-design .order-prose li{font-size:16.5px;line-height:1.72}
.order-design .order-prose li{margin-top:10px}
.order-design .order-prose-cta,
.order-design .order-prose .cta-row{margin:44px auto 0}
.order-design .rule-callout{margin:8px auto 0}
.order-design .rule-callout .promise-in{align-items:flex-start}
.order-design .rule-callout h2{font-size:20px}

.order-design .token-table{background:var(--surface);box-shadow:var(--shadow)}
.order-design .token-row > *{background:var(--surface)}
.order-design .pattern-example,
.order-design .rule-callout,
.order-design .review-card{background:var(--surface)}

.order-design .faq-body{padding-top:4px;padding-bottom:clamp(56px,6vw,72px)}
.order-design .faq-group{padding:0;margin-top:clamp(38px,4.5vw,48px)}
.order-design .faq-body > .faq-group:first-child{margin-top:18px}
.order-design .faq-group h2{font-size:clamp(24px,3vw,29px);line-height:1.14}
.order-design details.qa{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  margin-top:13px;
  overflow:hidden;
}
.order-design details.qa[open]{border-color:color-mix(in srgb,var(--accent) 40%,var(--border))}
.order-design .qa summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  padding:18px 22px;
  font-weight:620;
  font-size:16.5px;
  line-height:1.4;
}
.order-design .qa summary::-webkit-details-marker{display:none}
.order-design .qa summary::after{
  content:"+";
  color:var(--accent);
  flex:0 0 auto;
  font:17px/1 var(--mono);
}
.order-design .qa[open] summary::after{content:"–"}
.order-design .qa-a{padding:0 22px 20px;color:var(--muted);font-size:15.5px;line-height:1.68}
.order-design .qa-a p{margin:0}
.order-design .qa-a p+p{margin-top:11px}
.order-design .qa-a a{color:var(--accent-text);text-decoration:underline;text-underline-offset:3px}
.order-design .faq-cta{
  margin-top:48px;
  padding:var(--order-card-pad);
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow);
}
.order-design .faq-cta h2{font-size:22px}
.order-design .faq-cta p{margin-top:9px;color:var(--muted);font-size:15.5px;line-height:1.65}
.order-design .faq-cta .cta-row{margin-top:20px}

.order-design .order-review-body{max-width:var(--order-review);padding-bottom:clamp(72px,8vw,92px)}
.order-design .review-grid{gap:18px;margin-top:26px}
.order-design .review-card{padding:var(--order-card-pad)}
.order-design .review-card h2{font-size:21px;line-height:1.18}
.order-design .review-card p{font-size:15px;line-height:1.65}
.order-design .review-card-links{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:14px}
.order-design .review-card-links a{margin-top:0}
.order-design .review-note-first{margin-top:36px}
.order-design .criteria-note{font-size:15.5px;line-height:1.65}

@media(max-width:940px){
  .order-hero-visual{max-width:680px;margin-inline:auto}
  .order-design .hero-grid{align-items:start}
  .order-design .order-thesis-in{grid-template-columns:1fr;gap:34px}
  .order-design .order-thesis-copy{max-width:70ch}
  .order-design .order-thesis-diagram{grid-template-columns:1fr 1fr;align-items:stretch}
  .order-design .source-choices{height:100%}
  .order-design .order-autonomy{height:100%}
  .order-design .order-autonomy::before{content:"→";left:-22px;top:25px}
}
@media(max-width:820px){
  .order-system .steps{grid-template-columns:1fr 1fr}
  .recipe-grid{grid-template-columns:1fr}
  .order-design .recipe-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .order-assurance-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .source-choices,.pattern-examples,.review-grid{grid-template-columns:1fr}
  .archive-example-rules{grid-template-columns:1fr}
  .token-row{grid-template-columns:1fr}
  .token-row > *+*{border-top:1px solid var(--border)}
  .order-design main > section{padding-block:52px}
  .order-design .hero{padding-top:42px;padding-bottom:44px}
  .order-design .hero-copy h1{font-size:clamp(36px,11.5cqi,48px)}
  .order-design .order-thesis-in{gap:28px}
  .order-design .order-thesis-diagram{grid-template-columns:1fr}
  .order-design .order-autonomy::before{content:"↓";left:22px;top:-21px}
  .order-design .order-page-hero{padding-top:48px;padding-bottom:24px}
  .order-design .order-page-hero h1{font-size:clamp(33px,10vw,44px)}
  .order-design .order-prose p,
  .order-design .order-prose li{font-size:16px}
  .order-design .qa summary{padding:16px 18px;font-size:16px}
  .order-design .qa-a{padding:0 18px 18px}
  .order-design .faq-group{margin-top:36px}
  .order-design .review-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
  .order-source-row{grid-template-columns:1fr}
  .order-rule{grid-template-columns:66px 1fr auto}
  .order-system .steps{grid-template-columns:1fr}
  .order-design .order-system .step{border-right:0;border-bottom:1px solid var(--border)}
  .order-design .order-system .step:last-child{border-bottom:0}
}