/* Shared layout for the isolated, four-project portfolio preview. */
.portfolio-preview .story-list { padding-left: 1.35em; margin: 10px 0 18px; font-size: 14px; line-height: 1.85; color: var(--tx2); }
.portfolio-preview .story-list li + li { margin-top: 7px; }
.portfolio-preview .story-list b { color: var(--tx); font-weight: 600; }
.portfolio-preview .story-note { margin-top: 20px; font-size: 13px; line-height: 1.85; color: var(--tx2); }
.portfolio-preview .story-note b { color: var(--tx); }
.portfolio-preview .story-section-label { font-size: 16px; margin: 24px 0 14px; }
.portfolio-preview .story-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 28px; }
.portfolio-preview .story-columns h4 { font-size: 16px; margin-bottom: 8px; }
.portfolio-preview .story-columns p { font-size: 14px; line-height: 1.85; color: var(--tx2); }
.portfolio-preview .story-research h4, .portfolio-preview .story-result-copy h4 { font-size: 17px; margin-bottom: 8px; }
.portfolio-preview .story-decisions { margin-top: 28px; }
.portfolio-preview .story-evolution { margin-top: 12px; }
.portfolio-preview .story-evolution .story-list { margin-bottom: 0; }
.portfolio-preview .story-result-copy { margin-block: 26px; }
.portfolio-preview .case-background h3:not(:first-child) { margin-top: 26px; }
.portfolio-preview #walk .p9 .shot-grid > div:not(.shot) { display: flex; flex-direction: column; gap: 22px; }
.portfolio-preview #walk .p9 .shot-grid .shot { margin: 0; }
.portfolio-preview #walk .p9 .shot-grid { align-items: start; margin-top: 24px; }
.portfolio-preview .story-evaluation-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 30px; align-items: start; }
.portfolio-preview .story-evaluation-layout > .shot { margin: 0; }
.portfolio-preview .story-evaluation-layout > .prose { margin: 0; }
.portfolio-preview .prototype-diagram { margin: 28px 0; border: 1px solid var(--line2); border-radius: 8px; box-shadow: none; background: #fff; }
.portfolio-preview .prototype-diagram img { display: block; width: 100%; height: auto; object-fit: contain; }
.portfolio-preview .product-table { width: 100%; margin: 24px 0 0; border-collapse: collapse; font-size: 14px; line-height: 1.8; color: var(--tx2); table-layout: fixed; }
.portfolio-preview .product-table th, .portfolio-preview .product-table td { padding: 15px 16px; border-bottom: 1px solid var(--line2); vertical-align: top; text-align: left; overflow-wrap: anywhere; }
.portfolio-preview .product-table thead th { color: var(--tx2); font-size: 12px; font-weight: 500; border-top: 1px solid var(--line2); background: #f7f9f8; }
.portfolio-preview .product-table tbody th { color: var(--tx); font-weight: 600; }
.portfolio-preview .product-table th:first-child { width: 24%; }
.portfolio-preview .decision-table th:last-child, .portfolio-preview .interaction-table th:last-child { width: 27%; }
.portfolio-preview .product-table strong { color: var(--green); font-size: 15px; font-weight: 600; }
.portfolio-preview .metric-context { font-size: 12px; color: var(--tx2); line-height: 1.7; margin: 10px 0 0; }
.portfolio-preview .walk-metrics { margin-top: 26px; }
.portfolio-preview .result-followup { display: grid; grid-template-columns: 1fr 1.15fr; gap: 28px; align-items: center; margin-top: 24px; }
.portfolio-preview .result-followup .story-result-copy, .portfolio-preview .result-followup .shot { margin: 0; }
@media screen {
  .portfolio-preview .tools-page { display: block; }
  .preview-nav .logo { white-space: nowrap; }
  .preview-nav .preview-pdf-link { color: var(--green); font-weight: 600; }
  .portfolio-preview .project-tab { padding-block: 12px; min-width: 0; }
  @media (min-width: 801px) {
    .portfolio-preview .hero { min-height: 780px; }
    .preview-nav .links { gap: 20px; }
  }
  @media (max-width: 800px) {
    .portfolio-preview .project-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portfolio-preview .exhibit-stage { overflow: clip; }
    .portfolio-preview .preview-panel { overflow-wrap: anywhere; }
    .preview-nav .links { min-width: 0; overflow-x: auto; gap: 18px; scrollbar-width: none; }
    .preview-nav .links a { flex-shrink: 0; }
    .preview-nav .links::-webkit-scrollbar { display: none; }
  }
  @media (max-width: 640px) {
    .portfolio-preview .hero-intro > *, .portfolio-preview .exhibit-index { min-width: 0; }
    .portfolio-preview .story-columns { grid-template-columns: 1fr; gap: 18px; }
    .portfolio-preview .story-evaluation-layout { grid-template-columns: 1fr; gap: 22px; }
    .portfolio-preview .result-followup { grid-template-columns: 1fr; gap: 18px; }
    .portfolio-preview .product-table { font-size: 12px; line-height: 1.7; }
    .portfolio-preview .product-table th, .portfolio-preview .product-table td { padding: 10px 7px; }
    .portfolio-preview .product-table strong { font-size: 13px; }
    .portfolio-preview .product-table thead th { font-size: 11px; }
  }
}

@media print {
  .portfolio-preview .page::after { content: attr(data-preview-page) " / " attr(data-preview-total); }
  .portfolio-preview .page.first::after { content: none; }
  .preview-full .print-overview { margin-top: 6mm; }
  .preview-full .print-overview a { grid-template-columns: 43mm minmax(0, 1fr); column-gap: 4mm; padding: 3mm 0; }
  .preview-full .print-overview .no { margin-bottom: 3px; font-size: 8.5px; }
  .preview-full .print-overview h3 { font-size: 13px; }
  .preview-full .print-overview p { font-size: 10.5px; line-height: 1.6; }
  .portfolio-preview .page:not(.case-cover) .sec-num { font-size: 10px; margin-bottom: 9px; }
  .portfolio-preview .page:not(.case-cover) .sec-head { margin-bottom: 4mm; }
  .portfolio-preview .story-list { font-size: 12px; line-height: 1.65; margin: 6px 0 10px; }
  .portfolio-preview .story-list li + li { margin-top: 5px; }
  .portfolio-preview .story-note { font-size: 11px; line-height: 1.6; margin-top: 3mm; }
  .portfolio-preview .story-section-label { font-size: 13px; margin: 3mm 0 2mm; }
  .portfolio-preview .case-background h3:not(:first-child) { margin-top: 4mm; }
  .portfolio-preview .case-cover .story-list { font-size: 12px; margin-bottom: 3mm; }
  .portfolio-preview .story-research h4, .portfolio-preview .story-result-copy h4 { font-size: 14px; margin-bottom: 5px; }
  .portfolio-preview .story-decisions { margin-top: 4mm; }
  .portfolio-preview .story-decisions .layer { padding: 4mm 5mm; }
  .portfolio-preview .story-columns { gap: 5mm; margin-top: 4mm; }
  .portfolio-preview .story-columns h4 { font-size: 13px; margin-bottom: 5px; }
  .portfolio-preview .story-columns p { font-size: 12px; line-height: 1.65; }
  .portfolio-preview .drama-assets .p3grid { max-width: 86%; margin-inline: auto; }
  .portfolio-preview .drama-video > .shot { max-width: 72%; margin: 2mm auto; }
  .portfolio-preview .story-evolution { margin-top: 0; }
  .portfolio-preview .story-evolution .evo-item { padding: 3mm 0; grid-template-columns: 29mm minmax(0, 1fr); }
  .portfolio-preview .story-evolution .story-list { font-size: 11.5px; line-height: 1.6; margin-top: 4px; }
  .portfolio-preview .drama-evolution-shots { margin-top: 4mm; }
  .portfolio-preview .story-result-copy { margin: 4mm 0; }
  .portfolio-preview .drama-results > .shot { max-width: 63%; margin: 2mm auto; }
  .portfolio-preview #walk .case-foundation { margin-top: 3mm; padding-top: 3mm; }
  .portfolio-preview #walk .tools-page .tool { padding: 4mm; }
  .portfolio-preview #walk .tools-page .story-list { margin-bottom: 0; }
  .portfolio-preview #walk .p9 .shot-grid { max-width: 92%; margin-inline: auto; }
  .portfolio-preview .story-evaluation-layout { grid-template-columns: 1.1fr 1fr; gap: 5mm; margin-top: 6mm; }
  .portfolio-preview #walk .story-evaluation-layout .shot { max-width: 100%; margin: 0; }
  .portfolio-preview #walk .story-evaluation-layout .cap { display: block; font-size: 10.5px; padding: 10px; }
  .portfolio-preview #walk .story-evaluation-layout .cap b { display: block; margin-bottom: 4px; }
  .portfolio-preview #walk .story-evaluation-layout .prose h3 { font-size: 14px; margin-bottom: 10px; }
  .portfolio-preview #walk .story-evaluation-layout .prose p { font-size: 12px; line-height: 1.65; }
  .portfolio-preview #toudi .toudi-collaboration .toudi-decisions { margin-top: 2mm; }
  .portfolio-preview #toudi .toudi-collaboration .collab-flow { margin: 2mm 0; }
  .portfolio-preview #toudi .toudi-collaboration .case-example { margin: 2mm 0; }
  .portfolio-preview #toudi .toudi-filling .filling-library { max-width: 78%; margin-inline: auto; }
  .portfolio-preview #advertising .ad-evaluation .story-list { font-size: 12px; line-height: 1.65; margin-block: 5px 0; }
  .portfolio-preview .prototype-diagram, .portfolio-preview #advertising .prototype-diagram { max-width: 100%; width: 100%; margin: 3mm 0 4mm; border-radius: 4px; }
  .portfolio-preview .prototype-diagram img { height: auto; max-height: none; }
  .portfolio-preview .product-table { font-size: 11.5px; line-height: 1.65; margin-top: 4mm; }
  .portfolio-preview .product-table th, .portfolio-preview .product-table td { padding: 6px 10px; }
  .portfolio-preview .product-table th:first-child { width: 20%; }
  .portfolio-preview .product-table thead th { font-size: 10.5px; }
  .portfolio-preview .product-table strong { font-size: 12px; }
  .portfolio-preview .interaction-table { margin-top: 2mm; }
  .portfolio-preview .metric-context { font-size: 10px; line-height: 1.6; margin-top: 2mm; }
  .portfolio-preview .drama-results .story-result-copy { margin: 0; }
  .portfolio-preview .drama-results .story-result-copy p { font-size: 12px; line-height: 1.65; margin: 0; }
  .portfolio-preview .drama-results > .shot { max-width: 59%; }
  .portfolio-preview .result-followup { margin-top: 4mm; gap: 5mm; }
  .portfolio-preview .result-followup .shot .bar, .portfolio-preview .result-followup .shot .cap { display: none; }
  .portfolio-preview .walk-results .story-evaluation-layout { margin-top: 4mm; }
  .portfolio-preview .walk-results .story-evaluation-layout .prose h3 { margin: 3mm 0 2mm; }
  .portfolio-preview .walk-results .story-evaluation-layout .prose h3:first-child { margin-top: 0; }
  .portfolio-preview .walk-metrics { margin-top: 4mm; }
  .portfolio-preview #toudi .toudi-filling .filling-library { max-width: 56%; margin-top: 1mm; margin-bottom: 2mm; }
  .portfolio-preview #toudi .toudi-filling .filling-library .cap { display: none; }
}

/* Full product flows and current TouDi interfaces in the isolated preview. */
#advertising .ad-role-points,
#advertising .ad-exploration-steps,
#toudi .toudi-points,
#toudi .toudi-principles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:24px 0; }
#advertising .ad-role-points h4,
#advertising .ad-step-copy h4,
#advertising .ad-authoring-step h4,
#advertising .ad-media-step h4,
#advertising .ad-exploration-step h4,
#toudi .toudi-points h4,
#toudi .toudi-principles h4 { font-size:16px; line-height:1.65; margin:0 0 9px; }
#advertising .ad-role-points p,
#advertising .ad-step-copy p,
#advertising .ad-authoring-step p,
#advertising .ad-media-step p,
#advertising .ad-exploration-step p,
#toudi .toudi-points p,
#toudi .toudi-principles p { font-size:14px; line-height:1.85; color:var(--tx2); margin:0; }
#advertising .ad-authoring-intake { display:grid; grid-template-columns:.9fr 1.1fr; gap:28px; align-items:center; margin:24px 0 32px; }
#advertising .ad-authoring-intake .shot { margin:0; }
#advertising .ad-authoring-main { margin:0; gap:28px; align-items:start; }
#advertising .ad-authoring-main .shot { margin:18px 0 0; }
#advertising .ad-media-pair { gap:36px; align-items:start; }
#advertising .ad-media-pair .shot { margin:16px auto; max-width:350px; }
#advertising .ad-media-pair .cap { display:block; }
#advertising .ad-media-pair .cap b { display:block; }
#advertising .ad-exploration-step .shot { margin:20px 0 0; }
#advertising .ad-exploration-step .cap { display:block; }
#advertising .ad-exploration-step .cap b { display:block; }
#toudi .toudi-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:26px 0; align-items:start; }
#toudi .toudi-pair .shot { margin:0; }
#toudi .toudi-pair .cap { display:block; }
#toudi .toudi-pair .cap b { display:block; }
#toudi .toudi-fill-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; padding:0; list-style:none; margin:24px 0; }
#toudi .toudi-fill-flow li { font-size:14px; line-height:1.8; color:var(--tx2); }
#toudi .toudi-fill-flow strong { display:block; color:var(--tx); margin-bottom:6px; }
#toudi .toudi-profile-shot { max-width:860px; margin-inline:auto; }
@media screen and (max-width:760px) {
  #advertising .ad-role-points, #advertising .ad-exploration-steps,
  #advertising .ad-authoring-intake, #advertising .ad-authoring-main,
  #advertising .ad-media-pair, #toudi .toudi-points,
  #toudi .toudi-principles, #toudi .toudi-pair, #toudi .toudi-fill-flow { grid-template-columns:1fr; gap:20px; }
  #advertising .ad-media-pair .shot { max-width:380px; }
}
@media print {
  #advertising .ad-role-points, #advertising .ad-exploration-steps,
  #toudi .toudi-points, #toudi .toudi-principles { gap:5mm; margin:3mm 0; }
  #advertising .ad-role-points h4, #advertising .ad-step-copy h4,
  #advertising .ad-authoring-step h4, #advertising .ad-media-step h4,
  #advertising .ad-exploration-step h4, #toudi .toudi-points h4,
  #toudi .toudi-principles h4 { font-size:12.5px; line-height:1.5; margin:0 0 5px; }
  #advertising .ad-role-points p, #advertising .ad-step-copy p,
  #advertising .ad-authoring-step p, #advertising .ad-media-step p,
  #advertising .ad-exploration-step p, #toudi .toudi-points p,
  #toudi .toudi-principles p { font-size:11.5px; line-height:1.65; }
  #advertising .ad-architecture .ad-architecture-diagram { width:160mm; max-width:160mm; margin:2mm auto 3mm; }
  #advertising .ad-authoring-intake { grid-template-columns:.85fr 1.15fr; gap:6mm; margin:3mm 0 5mm; }
  #advertising .ad-authoring-main { grid-template-columns:1fr 1fr; gap:6mm; margin:0; }
  #advertising .ad-authoring-main .shot { margin:3mm 0 0; }
  #advertising .ad-authoring-main .cap { display:block; padding:6px 8px; }
  #advertising .ad-authoring-main .cap b { display:block; }
  #advertising .ad-media-pair { grid-template-columns:1fr 1fr; gap:8mm; margin:0; }
  #advertising .ad-media-pair .shot { width:60mm; max-width:60mm; margin:2mm auto 3mm; }
  #advertising .ad-media-pair .shot .cap { padding:6px 8px; font-size:9px; }
  #advertising .ad-media-pair .shot .cap b { font-size:8.5px; }
  #advertising .ad-exploration-steps { gap:5mm; margin-top:6mm; }
  #advertising .ad-exploration-step .shot { margin:3mm 0; }
  #advertising .ad-exploration-step .cap { padding:6px; font-size:10px; }
  #advertising .ad-exploration-step .cap b { font-size:9px; }
  #toudi .toudi-page > .case-head { margin-bottom:4mm; }
  #toudi .toudi-page .toudi-pair { gap:5mm; margin:4mm 0; grid-template-columns:1fr 1fr; }
  #toudi .toudi-pair .cap { padding:8px 10px; font-size:10.5px; }
  #toudi .toudi-page .toudi-main-shot { max-width:150mm; margin:3mm auto; }
  #toudi .toudi-page .toudi-profile-shot { max-width:136mm; margin:2mm auto 3mm; }
  #toudi .toudi-profile-shot .cap { display:none; }
  #toudi .toudi-fill-flow { gap:5mm; margin:3mm 0; }
  #toudi .toudi-fill-flow li { font-size:11px; line-height:1.65; }
  #toudi .toudi-fill-flow strong { margin-bottom:3px; }
  #toudi .toudi-results { margin-top:3mm; }
  #toudi .toudi-results th, #toudi .toudi-results td { padding:5px 8px; font-size:10.5px; }
}
#toudi .toudi-session-steps { display:grid; gap:28px; }
#toudi .toudi-session-step { display:grid; grid-template-columns:.8fr 1.2fr; gap:28px; align-items:center; }
#toudi .toudi-session-step h4 { font-size:17px; line-height:1.6; margin:0 0 10px; }
#toudi .toudi-session-step p { font-size:14px; line-height:1.85; color:var(--tx2); margin:0; }
#toudi .toudi-session-step .shot { margin:0; }
@media screen and (max-width:760px) {
 #toudi .toudi-session-step { grid-template-columns:1fr; gap:14px; }
}
@media print {
 #toudi .toudi-session-steps { gap:3mm; }
 #toudi .toudi-session-step { grid-template-columns:1fr 79mm; gap:6mm; }
 #toudi .toudi-session-step h4 { font-size:13px; margin:0 0 5px; }
 #toudi .toudi-session-step p { font-size:11.5px; line-height:1.65; }
 #toudi .toudi-session-step .shot { margin:0; }
}

/* Screen reading rhythm: keep the overview and its first product flow together. */
@media screen {
  .portfolio-preview .page:not(.first):not(:has(footer)) { padding-block: 30px 32px; }
  .portfolio-preview .sec-head { margin-bottom: 22px; }
  .portfolio-preview section > .wrap > .page:first-child .sec-head { padding-top: 12px; }
  .portfolio-preview .sec-num { line-height: 1.5; margin-bottom: 8px; }
  .portfolio-preview .sec-head h2 { font-size: clamp(26px, 2.5vw, 34px); line-height: 1.3; margin-bottom: 10px; }
  .portfolio-preview .sec-head .lede { max-width: 820px; line-height: 1.7; }
  .portfolio-preview .tags { margin-top: 14px; gap: 7px; }
  .portfolio-preview .tag { padding-block: 3px; }
  .portfolio-preview .prose { max-width: 820px; }
  .portfolio-preview .prose h3 { line-height: 1.5; margin-bottom: 8px; }
  .portfolio-preview .prose p { line-height: 1.7; margin-bottom: 10px; }
  .portfolio-preview .prose p:last-child { margin-bottom: 0; }
  .portfolio-preview .case-head { max-width: 860px; margin-bottom: 20px; }
  .portfolio-preview .case-head h3 { font-size: 24px; line-height: 1.4; margin-bottom: 10px; }
  .portfolio-preview .case-head p { max-width: 820px; line-height: 1.7; }

  .portfolio-preview .case-background.case-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 28px;
    max-width: none;
    margin: 0 0 22px;
  }
  .portfolio-preview .case-fact { min-width: 0; }
  .portfolio-preview .case-background.case-facts .case-fact h3 { font-size: 17px; line-height: 1.5; margin: 0 0 7px; }
  .portfolio-preview .case-facts .case-fact p { font-size: 14px; line-height: 1.7; margin: 0; }
  .portfolio-preview .case-facts .case-fact p + p { margin-top: 8px; }
  .portfolio-preview .case-facts .story-list { margin: 8px 0 0; }
  .portfolio-preview .case-cover .case-work { display: block; }
  .portfolio-preview .case-cover .case-work > h3,
  .portfolio-preview .case-cover .case-work > .prose > h3 { font-size: 18px; line-height: 1.5; margin: 0 0 10px; }
  .portfolio-preview .case-cover .case-work .flow { margin: 10px 0 0; }
  .portfolio-preview .flow .step { padding: 18px 16px; }
  .portfolio-preview .flow .step p { line-height: 1.7; }
  .portfolio-preview .case-foundation { max-width: 820px; margin: 0 0 20px; }

  .portfolio-preview .story-list { line-height: 1.7; margin: 8px 0 14px; }
  .portfolio-preview .story-list li + li { margin-top: 5px; }
  .portfolio-preview .story-note { margin-top: 14px; line-height: 1.7; }
  .portfolio-preview .story-section-label { margin: 18px 0 10px; }
  .portfolio-preview .story-columns { gap: 22px; margin-top: 20px; }
  .portfolio-preview .story-columns h4,
  .portfolio-preview .story-research h4,
  .portfolio-preview .story-result-copy h4 { margin-bottom: 7px; }
  .portfolio-preview .story-columns p { line-height: 1.7; }
  .portfolio-preview .story-decisions { margin-top: 20px; }
  .portfolio-preview .story-evolution { margin-top: 0; }
  .portfolio-preview .story-evolution .evo-item { gap: 24px; padding-block: 22px; }
  .portfolio-preview .story-evolution .evo-item p { line-height: 1.7; }
  .portfolio-preview .story-evolution .story-list { margin-bottom: 0; }
  .portfolio-preview .story-result-copy { margin-block: 18px; }
  .portfolio-preview .story-evaluation-layout { gap: 24px; }
  .portfolio-preview .result-followup { gap: 24px; margin-top: 20px; }
  .portfolio-preview .result-followup .story-result-copy { margin: 0; }
  .portfolio-preview .product-table { margin-top: 18px; line-height: 1.7; }
  .portfolio-preview .product-table th,
  .portfolio-preview .product-table td { padding: 12px 14px; }
  .portfolio-preview .metric-context { margin-top: 8px; }
  .portfolio-preview .walk-metrics { margin-top: 20px; }

  .portfolio-preview .shot,
  .portfolio-preview .prototype-diagram { margin-block: 20px; }
  .portfolio-preview .p3grid .shot,
  .portfolio-preview .story-evaluation-layout > .shot,
  .portfolio-preview .result-followup .shot { margin: 0; }
  .portfolio-preview .shot .cap { padding: 10px 14px; line-height: 1.65; }
  .portfolio-preview .shot .cap b { line-height: 1.7; }
  .portfolio-preview #walk .p9 .shot-grid { margin-top: 20px; }

  .portfolio-preview #advertising .ad-role-points,
  .portfolio-preview #advertising .ad-exploration-steps,
  .portfolio-preview #toudi .toudi-points,
  .portfolio-preview #toudi .toudi-principles,
  .portfolio-preview #toudi .toudi-pair,
  .portfolio-preview #toudi .toudi-fill-flow { margin-block: 20px; gap: 22px; }
  .portfolio-preview #advertising .ad-role-points p,
  .portfolio-preview #advertising .ad-step-copy p,
  .portfolio-preview #advertising .ad-authoring-step p,
  .portfolio-preview #advertising .ad-media-step p,
  .portfolio-preview #advertising .ad-exploration-step p,
  .portfolio-preview #toudi .toudi-points p,
  .portfolio-preview #toudi .toudi-principles p,
  .portfolio-preview #toudi .toudi-session-step p,
  .portfolio-preview #toudi .toudi-fill-flow li { line-height: 1.7; }
  .portfolio-preview #advertising .ad-authoring-intake { margin-block: 20px 24px; gap: 24px; }
  .portfolio-preview #advertising .ad-authoring-intake .shot,
  .portfolio-preview #toudi .toudi-pair .shot,
  .portfolio-preview #toudi .toudi-session-step .shot { margin: 0; }
  .portfolio-preview #toudi .toudi-session-steps { gap: 22px; }
  .portfolio-preview #toudi .toudi-session-step { gap: 24px; }
  .portfolio-preview .case-example { line-height: 1.7; margin-bottom: 20px; }

  @media (max-width: 800px) {
    .portfolio-preview .case-background.case-facts { grid-template-columns: 1fr; gap: 16px; }
  }
  @media (max-width: 640px) {
    .portfolio-preview .page:not(.first):not(:has(footer)) { padding-block: 24px 26px; }
    .portfolio-preview .sec-head,
    .portfolio-preview .case-head { margin-bottom: 18px; }
    .portfolio-preview .case-head h3 { font-size: 22px; }
    .portfolio-preview .product-table { font-size: 12px; }
    .portfolio-preview .product-table th,
    .portfolio-preview .product-table td { padding: 10px 7px; }
    .portfolio-preview .story-columns,
    .portfolio-preview .story-evaluation-layout,
    .portfolio-preview .result-followup,
    .portfolio-preview .story-evolution .evo-item { gap: 16px; }
    .portfolio-preview #toudi .toudi-session-step { gap: 14px; }
  }
}

@media print {
  .portfolio-preview .case-fact + .case-fact { margin-top: 4mm; }
  .portfolio-preview .case-background .case-fact h3 { margin-bottom: 2mm; }
}

@media screen {
  .portfolio-preview .case-facts .case-foundation { grid-column: 1 / -1; margin: 0; padding-top: 12px; }
  .portfolio-preview #advertising .ad-optimization ol { line-height: 1.7; }
}
@media print {
  .portfolio-preview #advertising .ad-overview .case-facts { display: grid; grid-column: 1 / -1; grid-template-columns: 1fr 1fr; gap: 5mm 7mm; }
  .portfolio-preview #advertising .ad-overview .case-fact:first-child { grid-column: 1; grid-row: 1 / 3; }
  .portfolio-preview #advertising .ad-overview .case-fact + .case-fact { margin-top: 0; }
  .portfolio-preview #walk .case-facts .case-foundation h4 { font-size: 13px; margin-bottom: 5px; }
}