/* Monty Network | Case study. External CSS is required by public/_headers CSP (style-src 'self'). */
:root{--mn-bg:#0e0c0a;--mn-panel:#181410;--mn-panel2:#211a13;--mn-gold:#c69a59;--mn-cream:#f4ecdf;--mn-muted:#c8b8a5;--mn-line:#493727}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-width:320px;background:var(--mn-bg);color:var(--mn-cream);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--mn-gold);outline-offset:4px}
.case-hero{position:relative;background:radial-gradient(ellipse at 86% 34%,#403021 0%,#18130f 34%,#0e0c0a 74%);border-bottom:1px solid #372a1f}
.hero-logo,.hero-logo:visited{position:absolute;top:24px;right:5vw;z-index:2;font:clamp(22px,2.2vw,30px) Georgia,'Times New Roman',serif;color:var(--mn-cream);text-shadow:0 2px 12px #000}
.hero-logo span,.gold{color:var(--mn-gold)}
.hero-content{max-width:1120px;margin:0 auto;padding:100px 6vw 65px}
.eyebrow,.section-number{color:var(--mn-gold);font-size:11px;letter-spacing:.22em;font-weight:bold;text-transform:uppercase}
.case-hero h1{font:normal clamp(48px,6.5vw,86px)/1.04 Georgia,'Times New Roman',serif;letter-spacing:-.042em;margin:18px 0 22px;max-width:940px}
.case-hero h1 em{color:var(--mn-gold);font-style:italic;font-weight:normal}
.case-hero .lead{font-size:clamp(16px,1.6vw,19px);line-height:1.75;color:#d7c9b7;max-width:740px;margin:0}
.case-header{padding:17px 5vw;background:#15110e;border-bottom:1px solid var(--mn-line)}
.case-nav{display:flex;justify-content:center;align-items:center;gap:clamp(13px,2vw,28px);flex-wrap:wrap}
.case-nav a,.case-nav a:visited{color:var(--mn-gold);font-size:13px;line-height:1.7}
.case-nav a:hover,.case-nav a:focus-visible{color:var(--mn-cream);text-decoration:underline;text-underline-offset:5px}
.case-nav a[aria-current="page"]{color:var(--mn-cream);border-bottom:1px solid var(--mn-gold)}
.case-shell{display:grid;grid-template-columns:235px minmax(0,780px);justify-content:center;gap:clamp(36px,5vw,75px);max-width:1280px;margin:0 auto;padding:75px 6vw 110px}
.case-toc{position:sticky;top:24px;align-self:start;max-height:calc(100vh - 48px);overflow-y:auto;border:1px solid #493727;border-radius:12px;background:linear-gradient(140deg,#211a14,#15120f);padding:25px 23px}
.case-toc strong{display:block;font:normal 21px Georgia,'Times New Roman',serif;margin:0 0 14px;color:var(--mn-cream)}
.case-toc a,.case-toc a:visited{display:block;color:#cbbbaa;font-size:12px;line-height:1.65;padding:5px 0;border-left:2px solid transparent;padding-left:11px}
.case-toc a:hover{color:var(--mn-gold);border-left-color:var(--mn-gold)}
.case-article{min-width:0}
.chapter{padding:45px 0 55px;border-top:1px solid var(--mn-line);scroll-margin-top:22px}
.chapter:first-child{border-top:0;padding-top:0}
.chapter .section-number{display:block;margin-bottom:14px}
.chapter h2{font:normal clamp(34px,3.5vw,48px)/1.16 Georgia,'Times New Roman',serif;color:var(--mn-cream);letter-spacing:-.025em;margin:0 0 27px}
.chapter h2::after{content:'';display:block;width:54px;height:2px;background:var(--mn-gold);margin-top:22px}
.chapter h3{font:normal clamp(22px,2.3vw,29px)/1.25 Georgia,'Times New Roman',serif;color:var(--mn-gold);margin:34px 0 14px}
.chapter p{font-size:16px;line-height:1.85;color:#d8cabb;margin:0 0 19px}
.chapter strong{color:var(--mn-cream)}
.chapter ul{margin:12px 0 26px;padding:8px 18px 8px 36px;border-left:2px solid #604729;background:linear-gradient(90deg,#1a1510,transparent)}
.chapter li{font-size:15px;line-height:1.75;color:#dfd0bf;padding:3px 0}
.chapter li::marker{color:var(--mn-gold)}
.chapter blockquote{margin:28px 0;padding:23px 27px;border-left:3px solid var(--mn-gold);border-radius:0 10px 10px 0;background:var(--mn-panel);color:var(--mn-cream);font:italic clamp(20px,2.4vw,28px)/1.5 Georgia,'Times New Roman',serif}
.chapter pre{white-space:pre-wrap;overflow-x:auto;padding:24px 28px;border:1px solid #59422b;border-radius:12px;background:var(--mn-panel);color:var(--mn-gold);font:20px/1.65 Georgia,'Times New Roman',serif}
.chapter .case-media{margin:30px 0 36px;border:1px solid #54402c;border-radius:12px;overflow:hidden;background:#1a1510}
.chapter .case-media img{display:block;width:100%;height:auto;object-fit:contain}
.chapter .case-media figcaption{padding:12px 18px;font-size:13px;line-height:1.6;color:var(--mn-muted)}
.chapter .case-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:28px 0}
.chapter .case-media-grid .case-media{margin:0}
.case-footer{display:flex;align-items:center;justify-content:center;text-align:center;min-height:66px;padding:18px 20px;background:#15110e;border-top:1px solid var(--mn-line);color:#b6a99a}
.case-footer small{font:12px/1.7 Arial,Helvetica,sans-serif;color:#b6a99a}
.case-footer .footer-brand{color:var(--mn-cream)}
.case-footer .footer-brand span{color:var(--mn-gold)}
.case-footer .sep{color:#816b4c;padding:0 8px}
.case-footer a,.case-footer a:visited{color:var(--mn-gold)}
.case-footer a:hover{color:var(--mn-cream)}
@media(max-width:930px){.case-shell{grid-template-columns:1fr;max-width:850px;gap:22px;padding:55px 6vw 80px}.case-toc{position:static;max-height:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}.case-toc strong{grid-column:1/-1}.case-toc a{font-size:13px}.chapter{padding:40px 0}}
@media(max-width:600px){.hero-logo{top:20px;right:6vw;font-size:22px}.hero-content{padding:95px 6vw 45px}.case-hero h1{font-size:clamp(42px,11vw,61px)}.case-header{padding:14px 6vw}.case-nav{justify-content:center;gap:9px 17px}.case-nav a{font-size:12px}.case-shell{padding:38px 6vw 65px}.case-toc{display:block;padding:18px}.case-toc a{display:inline-block;padding:5px 10px 5px 0;border:0}.chapter h2{font-size:clamp(31px,8vw,40px)}.chapter .case-media-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Case study: more immediate scale, editable architecture diagrams and personal story. */
.hero-content{max-width:1320px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);align-items:center;gap:clamp(30px,5vw,75px);padding-top:105px;padding-bottom:72px}
.hero-copy{min-width:0}
.case-hero h1{font-size:clamp(47px,5.1vw,76px)}
.hero-jump,.hero-jump:visited{display:inline-flex;align-items:center;gap:15px;margin-top:25px;padding:12px 20px;border:1px solid var(--mn-gold);border-radius:5px;color:var(--mn-gold);font-size:13px;font-weight:bold}
.hero-jump:hover{background:var(--mn-gold);color:#14100c;text-decoration:none}
.hero-network{min-width:0;padding:25px;border:1px solid #795934;border-radius:15px;background:linear-gradient(135deg,#302215,#1b1611 55%,#11100e);box-shadow:0 15px 50px #0005;text-align:center}
.diagram-kicker{margin:0 0 20px!important;font-size:10px;letter-spacing:.25em;color:var(--mn-gold)}
.hero-brand-node,.hero-control-node{border:1px solid #745530;border-radius:9px;background:#18130f;padding:13px 15px;color:var(--mn-cream);box-shadow:0 3px 10px #0003}
.hero-brand-node{font:25px Georgia,serif}
.hero-brand-node span{color:var(--mn-gold)}
.hero-brand-node small,.hero-control-node small{display:block;color:var(--mn-muted);font:11px/1.6 Arial,Helvetica,sans-serif;margin-top:5px}
.diagram-connector,.arch-line{width:2px;height:25px;margin:0 auto;background:linear-gradient(var(--mn-gold),#654a2a)}
.hero-control-node{display:flex;justify-content:center;align-items:center;gap:12px;font:21px Georgia,serif;border-color:var(--mn-gold);background:#342516}
.node-badge{background:var(--mn-gold);color:#1b130b;border-radius:6px;padding:7px 9px;font:bold 13px Arial,sans-serif;letter-spacing:.06em}
.hero-nodes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.hero-nodes span{border:1px solid #59412a;background:#231b14;border-radius:6px;color:#f3debc;font:11px/1.45 Arial,Helvetica,sans-serif;padding:12px 4px}
.diagram-end{font-size:11px;color:var(--mn-muted);letter-spacing:.04em;margin:17px 0 0}
.chapter-snapshot{background:linear-gradient(145deg,#19130f,#0e0c0a 80%);border:1px solid #5b442c!important;border-radius:16px;padding:35px 30px!important;margin:10px 0 50px}
.chapter-snapshot h2{margin-bottom:18px}
.chapter-snapshot h2::after{margin-top:17px}
.snapshot-intro{max-width:675px}
.metrics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:26px 0}
.metric-card{display:flex;flex-direction:column;min-height:150px;padding:22px 19px;background:linear-gradient(145deg,#302315,#1c1610);border:1px solid #63482e;border-radius:12px}
.metric-card strong{font:normal clamp(41px,4vw,58px)/1 Georgia,serif;color:var(--mn-gold)}
.metric-card span{font:normal 17px/1.5 Georgia,serif;color:var(--mn-cream);margin:10px 0 3px}
.metric-card small{font:12px/1.5 Arial,Helvetica,sans-serif;color:var(--mn-muted)}
.snapshot-features{display:flex;gap:9px;flex-wrap:wrap;margin:17px 0 23px}
.snapshot-features span{display:inline-flex;padding:9px 12px;border:1px solid #5e4832;border-radius:40px;color:#e6d2b7;font-size:12px}
.chapter p.snapshot-note{font-size:12px;color:#baa995;line-height:1.7;margin-bottom:0}
.architecture-visual{margin:34px 0 42px}
.architecture-diagram{padding:26px 23px 16px;border:1px solid #61482f;border-radius:16px;background:radial-gradient(ellipse at 50% 0,#382819,#17130f 42%,#11100e 100%)}
.arch-level{width:min(100%,425px);margin:0 auto;padding:18px 15px;text-align:center;border:1px solid #735536;border-radius:11px;background:#241910}
.arch-level strong{display:block;font:normal 26px/1.25 Georgia,serif;color:var(--mn-cream)}
.arch-level strong span{color:var(--mn-gold)}
.arch-level small{display:block;margin-top:7px;color:var(--mn-muted);font-size:12px}
.arch-label,.arch-group-label{display:block;color:var(--mn-gold);font-size:10px;font-weight:bold;letter-spacing:.19em;margin-bottom:10px}
.arch-hub{background:#422d18;border-color:var(--mn-gold)}
.arch-group{border:1px solid #57412c;border-radius:10px;background:#1a1510;padding:15px 12px 12px;text-align:center}
.arch-group-label{margin:0 0 13px}
.arch-grid{display:grid;gap:8px}
.arch-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.arch-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.arch-box{min-width:0;min-height:86px;padding:13px 6px;background:#2d2116;border:1px solid #60472d;border-radius:8px}
.arch-box b{display:block;color:#f2dfc1;font-size:13px}
.arch-box span{display:block;color:#bfae99;font-size:11px;line-height:1.5;margin-top:8px}
.arch-delivery .arch-box{background:#242019}
.arch-note{margin:18px 0 0!important;text-align:center;color:#a99882!important;font-size:11px!important;line-height:1.6!important}
.architecture-visual figcaption{font-size:13px;line-height:1.65;color:var(--mn-muted);margin-top:12px}
.chapter-story .story-callout{display:flex;align-items:flex-start;gap:18px;background:linear-gradient(135deg,#302317,#19140f);border:1px solid #674b2d;border-radius:12px;padding:23px;margin:30px 0}
.chapter-story .story-paw{flex-shrink:0;font-size:31px;line-height:1.4}
.chapter-story .story-callout h3{font-size:23px;margin:0 0 12px}
.chapter-story .story-callout p{margin:0;font-size:15px}
.chapter .results-summary{margin-top:26px;font:italic 21px/1.6 Georgia,serif;color:var(--mn-gold)}
@media(max-width:1080px){.hero-content{grid-template-columns:minmax(0,1fr) minmax(290px,.8fr);gap:25px}.case-hero h1{font-size:clamp(43px,5.2vw,63px)}}
@media(max-width:850px){.hero-content{grid-template-columns:1fr;gap:36px}.hero-network{width:min(100%,550px);margin:0 auto}.case-hero h1{font-size:clamp(46px,8vw,72px)}.case-shell{padding-top:50px}}
@media(max-width:600px){.hero-content{padding:98px 6vw 43px}.hero-network{padding:18px 14px}.hero-nodes{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics-grid{gap:9px}.metric-card{padding:18px 13px;min-height:155px}.metric-card span{font-size:15px}.chapter-snapshot{padding:25px 17px!important}.arch-four,.arch-three{grid-template-columns:repeat(2,minmax(0,1fr))}.arch-grid{gap:7px}.arch-box{min-height:81px}.architecture-diagram{padding:16px 12px}.chapter-story .story-callout{padding:18px;gap:11px}}

/* Full-width architecture image, with a full-resolution zoom link. */
.chapter .architecture-image{margin:30px 0 45px}
.architecture-image-link{display:block;overflow:hidden;border:1px solid #755635;border-radius:12px;background:#100d09;box-shadow:0 14px 35px #0004;cursor:zoom-in}
.architecture-image-link img{display:block;width:100%;height:auto}
.architecture-image figcaption{font-size:13px;line-height:1.7;color:var(--mn-muted);margin-top:12px}
.architecture-image figcaption a,.architecture-image figcaption a:visited{color:var(--mn-gold);text-decoration:underline;text-underline-offset:3px}
.architecture-image figcaption a:hover{color:var(--mn-cream)}

/* Case study v2: tables, principle grid, modes, learning flow, chips, pillars, stats and closing call to action. */
.chapter ol{margin:12px 0 26px;padding-left:24px}
.chapter ol li{font-size:15px;line-height:1.75;color:#dfd0bf;padding:3px 0}
.chapter ol li::marker{color:var(--mn-gold);font-weight:bold}
.chapter ol.layers{padding:8px 18px 8px 40px;border-left:2px solid #604729;background:linear-gradient(90deg,#1a1510,transparent)}
.chapter .table-note{font-size:14px;color:var(--mn-muted);margin:-6px 0 12px}
.table-wrap{overflow-x:auto;margin:10px 0 30px;border:1px solid #54402c;border-radius:12px}
.case-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.55}
.case-table th{text-align:left;padding:12px 15px;background:#241a12;color:var(--mn-gold);font-size:11px;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid #54402c}
.case-table td{padding:12px 15px;color:#dfd0bf;border-bottom:1px solid #2e241a;vertical-align:top}
.case-table tbody tr:last-child td{border-bottom:0}
.case-table tbody tr:nth-child(even) td{background:#15110d}
.case-table td:first-child{color:var(--mn-cream);font-weight:bold;white-space:nowrap}
.case-table td:nth-child(2){color:var(--mn-gold);white-space:nowrap}
.chapter ul.principles,.chapter ul.chips{list-style:none;padding:0;border:0;background:none}
.chapter ul.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0 10px}
.chapter ul.principles li{padding:18px 14px;text-align:center;border:1px solid #63482e;border-radius:10px;background:linear-gradient(145deg,#2a1f15,#18130f);font:17px/1.35 Georgia,serif;color:var(--mn-cream)}
.chapter ul.chips{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 24px}
.chapter ul.chips li{padding:9px 14px;border:1px solid #5e4832;border-radius:40px;color:#e6d2b7;font-size:13px}
.modes{display:grid;gap:16px;margin:28px 0 10px}
.mode-card{padding:24px 24px 8px;border:1px solid #63482e;border-radius:14px;background:linear-gradient(145deg,#241a12,#14110e)}
.mode-label{display:inline-block;padding:5px 11px;border-radius:5px;background:var(--mn-gold);color:#1b130b;font:bold 11px Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.chapter .mode-card h3{margin:14px 0 12px;color:var(--mn-cream);font-style:italic}
.chapter ol.steps{counter-reset:step;list-style:none;padding:0}
.chapter ol.steps li{counter-increment:step;position:relative;padding:6px 0 6px 42px}
.chapter ol.steps li::before{content:counter(step);position:absolute;left:0;top:6px;width:28px;height:28px;border-radius:50%;border:1px solid var(--mn-gold);color:var(--mn-gold);font:bold 13px/26px Arial,sans-serif;text-align:center}
.chapter ol.flow{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;counter-reset:flow;margin:24px 0 28px}
.chapter ol.flow li{counter-increment:flow;position:relative;padding:18px 14px;border:1px solid #63482e;border-radius:10px;background:#1d1610;text-align:center}
.chapter ol.flow li::before{content:'0' counter(flow);display:block;color:var(--mn-gold);font:bold 11px Arial,sans-serif;letter-spacing:.2em;margin-bottom:8px}
.chapter ol.flow li:not(:last-child)::after{content:'→';position:absolute;right:-12px;top:50%;transform:translateY(-50%);color:var(--mn-gold);z-index:1;font-size:14px}
.chapter ol.flow strong{display:block;font:normal 20px Georgia,serif;color:var(--mn-cream)}
.chapter ol.flow span{display:block;font-size:13px;color:var(--mn-muted);margin-top:6px;line-height:1.5}
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0 26px}
.pillar{padding:20px 18px;border:1px solid #63482e;border-radius:12px;background:linear-gradient(145deg,#2a1f15,#17120e)}
.chapter .pillar h3{margin:0 0 10px;font-size:24px}
.chapter .pillar ul{margin:0;padding:0 0 0 18px;border:0;background:none}
.chapter .pillar li{font-size:14px}
.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 10px}
.stat-card{display:flex;flex-direction:column;padding:22px 18px;background:linear-gradient(145deg,#302315,#1c1610);border:1px solid #63482e;border-radius:12px}
.stat-card strong{font:normal clamp(36px,3.6vw,50px)/1 Georgia,serif;color:var(--mn-gold)}
.stat-card span{font:normal 16px/1.45 Georgia,serif;color:var(--mn-cream);margin:10px 0 4px}
.stat-card small{font:12px/1.5 Arial,Helvetica,sans-serif;color:var(--mn-muted)}
.case-cta{text-align:center;padding:55px 0 10px}
.chapter .cta-line{font:normal clamp(28px,3.4vw,42px)/1.25 Georgia,serif;color:var(--mn-cream);margin:0 0 26px}
.cta-line em{color:var(--mn-gold)}
.cta-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.cta-buttons a,.cta-buttons a:visited{padding:13px 20px;border:1px solid var(--mn-gold);border-radius:5px;color:var(--mn-gold);font-size:13px;font-weight:bold}
.cta-buttons a:first-child{background:var(--mn-gold);color:#14100c}
.cta-buttons a:hover{background:var(--mn-cream);border-color:var(--mn-cream);color:#14100c}
@media(max-width:700px){.pillars,.stats-grid{grid-template-columns:1fr}.chapter ul.principles{grid-template-columns:repeat(2,minmax(0,1fr))}.chapter ol.flow{grid-template-columns:repeat(2,minmax(0,1fr))}.chapter ol.flow li:nth-child(2)::after{display:none}.case-table td:first-child,.case-table td:nth-child(2){white-space:normal}.mode-card{padding:20px 18px 6px}}
@media(max-width:700px){.table-wrap{border:0;overflow:visible}.case-table thead{display:none}.case-table,.case-table tbody,.case-table tr,.case-table td{display:block;width:100%}.case-table tr{margin:0 0 10px;padding:12px 14px;border:1px solid #54402c;border-radius:10px;background:#18130f}.case-table tbody tr:nth-child(even) td{background:none}.case-table td{padding:2px 0;border:0}.case-table td:first-child{font-size:15px}.case-table td:nth-child(2){font-size:13px}.case-table td:nth-child(3){color:var(--mn-muted);margin-top:4px}}
@media(max-width:600px){.case-footer{display:block;line-height:1.9;font-size:13px}.case-footer .sep{padding:0 5px}}
/* Results lead and positioning statement */
.chapter p.results-lead{font:normal clamp(19px,2vw,23px)/1.6 Georgia,serif;color:var(--mn-cream);margin:6px 0 8px}
.chapter p.positioning{margin:30px 0 8px;padding:30px 28px;border-top:1px solid var(--mn-gold);border-bottom:1px solid var(--mn-gold);text-align:center;font:normal clamp(24px,3vw,34px)/1.4 Georgia,serif;color:var(--mn-cream);background:radial-gradient(ellipse at 50% 0,#2e2116,transparent 70%)}
.chapter p.positioning em{display:block;color:var(--mn-gold);font-style:italic}
/* Phone screenshots */
.chapter .phones{margin:30px 0 36px}
.phones-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.phones.single .phones-row{grid-template-columns:minmax(0,280px);justify-content:center}
.phones img{display:block;width:100%;height:auto;border-radius:22px;border:6px solid #241b13;outline:1px solid #6b5236;box-shadow:0 14px 30px #0006;background:#14110e}
.chapter .phones figcaption{margin-top:14px;font-size:13px;line-height:1.6;color:var(--mn-muted);text-align:center}
@media(max-width:600px){.phones-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.phones img{border-width:3px;border-radius:12px}}
/* Brand chapter screenshots */
.chapter .brand-shots{margin:28px 0 34px}
.brand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.brand-grid img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:10px;border:1px solid #5e4630;box-shadow:0 10px 24px #0005}
.brand-grid img.wide{grid-column:1/-1;height:auto}
.chapter .brand-shots figcaption{margin-top:12px;font-size:13px;line-height:1.6;color:var(--mn-muted);text-align:center}
