/* TITAN.ATLAS: older pages inside the home page template (Lauren, 2026-10-25).
   Everything is scoped to .desk-page so the studio pages are untouched. Colours and type come from the studio
   tokens (--bg, --white, --muted, --orange, --blue, --line). */

.desk-page{--card:linear-gradient(145deg,#101925,#080c13);--card-line:rgba(255,255,255,.12);--soft:#c6d0dc}
.desk-page .desk-block{padding:72px 0;border-top:1px solid #ffffff15}
.desk-page .desk-block:first-of-type{border-top:0}

/* type */
.desk-page .desk-block h2{font-size:clamp(26px,3vw,40px);line-height:1.16;letter-spacing:-.03em;font-weight:430;max-width:26ch;margin:0 0 18px;color:var(--white)}
.desk-page .desk-block h3{font-size:clamp(19px,1.7vw,25px);line-height:1.25;letter-spacing:-.02em;font-weight:480;margin:0 0 10px;color:var(--white)}
.desk-page .desk-block h4{font-size:15px;margin:0 0 8px;color:var(--white)}
.desk-page .desk-block p,.desk-page .desk-block li,.desk-page .desk-block dd,.desk-page .desk-block td{color:var(--muted);font-size:15px;line-height:1.75}
.desk-page .desk-block p{max-width:70ch}
.desk-page .desk-block strong,.desk-page .desk-block b{color:var(--white);font-weight:600}
.desk-page .desk-block em{color:var(--orange);font-style:normal}
.desk-page .desk-block a:not(.button):not(.btn){color:var(--white);text-decoration:underline;text-decoration-color:rgba(255,106,31,.6);text-underline-offset:4px}
.desk-page .desk-block a:not(.button):not(.btn):hover{color:var(--orange)}
.desk-page .desk-block ul,.desk-page .desk-block ol{padding-left:1.2em;margin:12px 0 18px}
.desk-page .desk-block li{margin:6px 0}
.desk-page .desk-block hr{border:0;border-top:1px solid var(--card-line);margin:28px 0}
.desk-page .desk-block code,.desk-page .desk-block kbd,.desk-page .desk-block pre{font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
.desk-page .desk-block code{font-size:12.5px;color:var(--soft);background:#ffffff0d;border-radius:5px;padding:2px 6px;word-break:break-word}
.desk-page .desk-block pre{background:#05080d;border:1px solid var(--card-line);border-radius:12px;padding:16px 18px;overflow:auto;color:var(--soft);font-size:12.5px;line-height:1.6}
.desk-page .muted,.desk-page .desk-block .muted{color:#77879d}
.desk-page .lede{font-size:17px;color:var(--soft)}
.desk-page .eyebrow{margin:0 0 14px}
.desk-page .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:34px}
.desk-page .section-head h2{margin-bottom:0}
.desk-page .section-head>p{max-width:36ch;font-size:13px;color:#77879d}

/* hero extras */
.desk-page .desk-hero.has-aside{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:center}
.desk-page .desk-hero .hero-aside{border:1px solid var(--card-line);border-radius:16px;background:var(--card);padding:26px}
.desk-page .desk-hero .hero-aside *{max-width:none}
.desk-page .desk-hero .actions{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin:28px 0 0}
.desk-page .desk-hero .page-hero-bottom p{color:var(--soft)}
.desk-page .hub-subnav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;padding:18px 0;margin:0 0 6px;border-bottom:1px solid #ffffff15;font-size:12px;width:min(1452px,calc(100% - 112px));margin-inline:auto}
.desk-page .hub-subnav .hub-subnav-label{font-size:10px;font-weight:600;letter-spacing:1.8px;text-transform:uppercase;color:var(--muted);margin-right:8px}
.desk-page .hub-subnav a{color:#c6d0dc;padding:4px 0;border-bottom:1px solid transparent}
.desk-page .hub-subnav a:hover,.desk-page .hub-subnav a[aria-current=page]{color:var(--white);border-bottom-color:var(--orange)}

/* buttons and links */
.desk-page .button,.desk-page .btn{font-family:inherit}
.desk-page .button.secondary,.desk-page .btn.secondary,.desk-page .button.ghost,.desk-page .btn.ghost{background:transparent;color:var(--white);border:1px solid var(--card-line)}
.desk-page .button.secondary:hover,.desk-page .btn.secondary:hover{border-color:var(--orange)}
.desk-page .btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;border:1px solid transparent;border-radius:50px;background:var(--orange);color:#110e0b;font-size:12px;font-weight:650;padding:14px 22px;line-height:1.2;text-decoration:none}
.desk-page .text-link{color:var(--white);font-size:12.5px;text-decoration:underline;text-decoration-color:rgba(255,106,31,.6);text-underline-offset:4px}
.desk-page .actions{display:flex;gap:18px 24px;flex-wrap:wrap;align-items:center;margin-top:22px}
.desk-page .arrow{font-size:inherit}

/* forms */
.desk-page .contact-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:start}
.desk-page .brief-form,.desk-page form.card,.desk-page .contact-form{border:1px solid var(--card-line);border-top:2px solid var(--orange);border-radius:16px;padding:clamp(24px,4vw,44px);background:var(--card)}
.desk-page .brief-form label,.desk-page .desk-block form label{display:block;font-size:12px;color:var(--muted);margin:22px 0 8px}
.desk-page .brief-form>label:first-of-type{margin-top:0}
.desk-page .desk-block input,.desk-page .desk-block select,.desk-page .desk-block textarea{width:100%;border:1px solid #536170;background:#080c13;color:var(--white);font:inherit;font-size:14px;padding:14px;border-radius:7px;min-height:48px}
.desk-page .desk-block textarea{min-height:110px;resize:vertical}
.desk-page .desk-block input:focus-visible,.desk-page .desk-block select:focus-visible,.desk-page .desk-block textarea:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.desk-page .desk-block input::placeholder,.desk-page .desk-block textarea::placeholder{color:#6f7d90}
.desk-page .brief-form .button,.desk-page .desk-block form button.button{width:100%;margin-top:22px;min-height:48px}
.desk-page .note{font-size:12px;color:var(--muted);line-height:1.6;margin-top:16px;min-height:40px;max-width:none}
.desk-page .contact-aside h3{margin-top:0}
.desk-page .contact-aside hr{margin:30px 0}

/* cards */
.desk-page .cards-3,.desk-page .meet-grid,.desk-page .card-grid,.desk-page .tx-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:8px}
.desk-page .meet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.desk-page .info-card,.desk-page .meet-card,.desk-page .principle-band,.desk-page .tier,.desk-page .plan,.desk-page .card{border:1px solid var(--card-line);border-radius:16px;background:var(--card);padding:clamp(22px,2.4vw,32px)}
.desk-page .info-card h3,.desk-page .meet-card h3{margin-top:0}
.desk-page .info-card p,.desk-page .meet-card p{max-width:none}
.desk-page .principle-band{margin-top:30px;border-left:2px solid var(--orange)}
.desk-page .principle-band p{max-width:none}
.desk-page .tx-foot{margin-top:18px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.desk-page .badge,.desk-page .status,.desk-page .planned,.desk-page .validation,.desk-page .design,.desk-page .source,.desk-page .solid{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--card-line);border-radius:99px;padding:3px 10px;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:transparent;line-height:1.5}
.desk-page .badge.solid,.desk-page .status.solid{border-color:rgba(255,106,31,.5);color:#ffb18b}

/* tables and lists of facts */
.desk-page .desk-block table{width:100%;border-collapse:collapse;margin:14px 0 22px;font-size:14px}
.desk-page .desk-block th,.desk-page .desk-block td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--card-line);vertical-align:top}
.desk-page .desk-block th{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#77879d;white-space:nowrap}
.desk-page .desk-block tbody tr:hover{background:#ffffff06}
.desk-page .desk-block dl{display:grid;grid-template-columns:minmax(120px,200px) 1fr;gap:10px 24px;margin:12px 0}
.desk-page .desk-block dt{color:var(--white);font-size:13px}
.desk-page .evidence-item{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--card-line)}
.desk-page .evidence-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);margin-top:9px;flex:none}
.desk-page details{border:1px solid var(--card-line);border-radius:12px;padding:14px 18px;margin:12px 0;background:#ffffff05}
.desk-page summary{cursor:pointer;color:var(--white);font-size:14px}
.desk-page .disclosure{margin-top:14px}

/* steps / tabs / notes */
.desk-page .step{border:1px solid var(--card-line);border-radius:12px;padding:14px 16px;background:#ffffff05}
.desk-page .desk-block button:not(.button){font:inherit;font-size:12px;color:var(--soft);background:transparent;border:1px solid var(--card-line);border-radius:10px;padding:9px 14px}
.desk-page .desk-block button[aria-selected=true],.desk-page .desk-block button.active{border-color:var(--orange);color:var(--white)}
.desk-page [role=note],.desk-page .callout{border-left:2px solid var(--orange);padding:14px 18px;background:#ffffff06;border-radius:0 12px 12px 0}

/* media placeholders (for-you pages) */
.desk-page figure{margin:30px 0}
.desk-page figure img,.desk-page .desk-block img{max-width:100%;height:auto;border-radius:14px}

/* the Atlas journal timeline keeps its own structure; put it on the dark page */
.desk-page .archive,.desk-page .entries,.desk-page .entry{color:var(--muted)}
.desk-page .entry{border:1px solid var(--card-line);border-radius:14px;background:var(--card);padding:22px 24px;margin:14px 0}
.desk-page .entry-time,.desk-page .entry-meta{color:#77879d;font-size:11px;letter-spacing:.1em}

@media(max-width:900px){
  .desk-page .desk-block{padding:52px 0}
  .desk-page .contact-grid,.desk-page .desk-hero.has-aside{grid-template-columns:1fr}
  .desk-page .cards-3,.desk-page .tx-tiles,.desk-page .meet-grid,.desk-page .card-grid{grid-template-columns:1fr}
  .desk-page .hub-subnav{width:calc(100% - 40px)}
  .desk-page .desk-block table{display:block;overflow-x:auto}
  .desk-page .desk-block dl{grid-template-columns:1fr}
}

/* heroes with a side panel */
.desk-page .desk-hero.has-aside .hero-main{min-width:0}
.desk-page .desk-hero.has-aside .hero-main .page-hero-bottom{max-width:60ch}

/* self-contained pages (the journal) keep their own layout; make the page itself dark like the studio */
.desk-journal{background:var(--bg);color:var(--white)}
.desk-journal .hero{min-height:0}
.desk-journal .hero:before{display:none}

/* small pieces: the 404 route list, worked-example boxes, scrollbars */
.desk-page .trace{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.desk-page .trace article{border:1px solid var(--card-line);border-radius:14px;padding:22px;background:var(--card)}
.desk-page .trace .step{display:block;border:0;background:transparent;padding:0;margin:0 0 10px;color:var(--orange);font-size:12px;letter-spacing:.15em}
.desk-page .trace h3{margin:0 0 6px}
.desk-page .result-box,.desk-page .specimen-note{border:1px solid var(--card-line);border-left:2px solid var(--orange);border-radius:0 14px 14px 0;background:#ffffff06;padding:20px 24px;margin:18px 0}
.desk-page .specimen-note{font-size:13px;color:#77879d}
.desk-page .example-tools{margin:16px 0}
.desk-page *{scrollbar-color:#2a3a4d transparent}
@media(max-width:900px){.desk-page .trace{grid-template-columns:1fr}}

/* the template's generic article-page <button> rule would hollow out real buttons: put them back */
.desk-page button.button{background:var(--orange);color:#110e0b;border:1px solid transparent;border-radius:50px;padding:16px 24px;font-size:12px;font-weight:650}
.desk-page button.button.secondary,.desk-page button.button.ghost{background:transparent;color:var(--white);border:1px solid var(--card-line)}