/* ===== RESET & BASE ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:"Poppins",system-ui,-apple-system,sans-serif;color:#0B0B0B;background:#ffffff;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
a{color:var(--rbs-teal);text-decoration:underline;}
a:hover{color:var(--rbs-teal-hover);}
img{max-width:100%;display:block;}
button{font-family:inherit;}

/* ===== CSS VARIABLES ===== */
:root{
  --rbs-navy:#062F56;
  --rbs-navy-deep:#041e3a;
  --rbs-teal:#0f766e;
  --rbs-teal-hover:#0b5d57;
  --rbs-teal-light:rgba(15,118,110,0.1);
  --rbs-teal-bright:#14b8a6;
  --bg-light:#F5F5F5;
  --bg-alt:#ffffff;
  --text-dark:#0B0B0B;
  --text-body:#475569;
  --text-muted:#666666;
  --text-inverse-muted:#94a3b8;
  --border-light:#D7D7D7;
  --white:#ffffff;
  --radius:0;
  --shadow-card:0 1px 3px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.06);
  --shadow-hover:0 8px 24px rgba(0,0,0,0.12);
  --transition:0.2s ease;
  --alert-red:#dc2626;
  --alert-red-bg:#fef2f2;
  --alert-red-border:#fecaca;
  --alert-amber:#d97706;
  --alert-amber-bg:#fffbeb;
  --alert-amber-border:#fde68a;
  --alert-green:#16a34a;
  --alert-green-bg:#f0fdf4;
  --alert-green-border:#bbf7d0;
  --alert-blue-bg:#eff6ff;
  --alert-blue-border:#bfdbfe;
}

/* ===== ACCESSIBILITY ===== */
.skip-link{position:absolute;top:-40px;left:0;background:var(--rbs-navy);color:var(--white);padding:8px 16px;z-index:9999;font-size:14px;}
.skip-link:focus{top:0;}
:focus-visible{outline:2px solid var(--rbs-teal-bright);outline-offset:2px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ===== LAYOUT ===== */
.container{max-width:900px;margin:0 auto;padding:0 24px;}

/* ===== HEADER ===== */
.doc-header{background:var(--rbs-navy);padding:48px 24px;text-align:center;position:relative;overflow:hidden;}
.doc-header::before{content:"";position:absolute;top:-200px;right:-150px;width:500px;height:500px;background:radial-gradient(circle,rgba(13,148,136,0.12) 0%,transparent 70%);pointer-events:none;}
.doc-header .container{position:relative;z-index:1;}
.doc-header .badge{display:inline-block;font-size:11px;font-weight:700;color:var(--rbs-teal-bright);text-transform:uppercase;letter-spacing:0.12em;margin-bottom:12px;border:1px solid rgba(20,184,166,0.3);padding:4px 14px;}
.doc-header h1{font-size:36px;font-weight:800;color:var(--white);line-height:1.15;letter-spacing:-0.03em;margin-bottom:16px;}
.doc-header .subtitle{font-size:17px;color:var(--text-inverse-muted);line-height:1.7;max-width:600px;margin:0 auto;}
@media(max-width:640px){
  .doc-header h1{font-size:26px;}
  .doc-header .subtitle{font-size:15px;}
}

/* ===== SIDEBAR NAV ===== */
.page-layout{display:grid;grid-template-columns:240px 1fr;min-height:100vh;}
.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;background:var(--rbs-navy-deep);padding:24px 0;border-right:1px solid rgba(255,255,255,0.08);z-index:100;}
.sidebar-logo{width:100px;margin:0 auto 20px;filter:brightness(0) invert(1);padding:0 20px;}
.sidebar h2{font-size:11px;font-weight:700;color:var(--rbs-teal-bright);text-transform:uppercase;letter-spacing:0.12em;padding:0 20px;margin-bottom:12px;}
.sidebar-nav{list-style:none;padding:0;margin:0;}
.sidebar-nav a{display:flex;align-items:baseline;gap:8px;padding:10px 20px;font-size:13px;color:var(--text-inverse-muted);text-decoration:none;transition:all var(--transition);border-left:3px solid transparent;}
.sidebar-nav a:hover{color:var(--white);background:rgba(255,255,255,0.05);border-left-color:var(--rbs-teal-bright);}
.sidebar-nav a.active{color:var(--white);background:rgba(20,184,166,0.1);border-left-color:var(--rbs-teal-bright);font-weight:600;}
.sidebar-nav .nav-num{font-size:11px;font-weight:700;color:var(--rbs-teal-bright);min-width:16px;}
.sidebar-nav .sub-link{padding-left:36px;font-size:12px;}
.sidebar-nav .sub-link .nav-num{display:none;}
/* Sidebar search */
.search-wrap{padding:0 16px 16px;}
.search-input{width:100%;padding:8px 12px;font-size:13px;font-family:inherit;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);color:var(--white);outline:none;transition:border-color var(--transition);}
.search-input::placeholder{color:rgba(255,255,255,0.4);}
.search-input:focus{border-color:var(--rbs-teal-bright);background:rgba(255,255,255,0.12);}
.search-results{padding:0 12px 12px;max-height:50vh;overflow-y:auto;}
.search-results a{display:block;padding:8px 12px;font-size:12px;color:var(--text-inverse-muted);text-decoration:none;border-left:2px solid transparent;transition:all var(--transition);line-height:1.4;}
.search-results a:hover{color:var(--white);background:rgba(255,255,255,0.05);border-left-color:var(--rbs-teal-bright);}
.search-results .sr-section{font-size:10px;font-weight:700;color:var(--rbs-teal-bright);text-transform:uppercase;letter-spacing:0.06em;margin-top:4px;}
.search-results .sr-match{color:var(--white);font-weight:600;}
.search-no-results{padding:8px 12px;font-size:12px;color:rgba(255,255,255,0.4);font-style:italic;}
.sidebar-badge{display:block;font-size:10px;font-weight:700;color:var(--rbs-teal-bright);text-transform:uppercase;letter-spacing:0.1em;padding:16px 20px 8px;border-top:1px solid rgba(255,255,255,0.06);margin-top:12px;}
.page-main{min-width:0;}

/* Mobile: sidebar becomes top bar */
@media(max-width:900px){
  .page-layout{grid-template-columns:1fr;}
  .sidebar{position:fixed;bottom:0;top:auto;left:0;right:0;height:auto;max-height:35vh;overflow-y:auto;border-right:0;border-top:2px solid var(--rbs-teal);padding:12px 0;display:none;z-index:200;}
  .sidebar.open{display:block;}
  .sidebar-logo{display:none;}
  .sidebar h2{margin-top:4px;}
  .sidebar-nav a{padding:8px 20px;}
  .mob-nav-toggle{display:flex;position:fixed;bottom:16px;right:16px;z-index:201;background:var(--rbs-teal);color:var(--white);border:none;width:48px;height:48px;align-items:center;justify-content:center;font-size:20px;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,0.3);}
}
@media(min-width:901px){
  .mob-nav-toggle{display:none;}
}

/* ===== MAIN CONTENT ===== */
.doc-body{padding:0 24px;}
.doc-body .container{padding-top:48px;padding-bottom:48px;}

/* ===== SECTIONS ===== */
.doc-section{margin-bottom:56px;scroll-margin-top:24px;}
.doc-section h2{font-size:26px;font-weight:700;color:var(--rbs-navy);letter-spacing:-0.02em;margin-bottom:8px;padding-bottom:12px;border-bottom:3px solid var(--rbs-teal);}
.section-num{font-size:14px;font-weight:700;color:var(--rbs-teal);text-transform:uppercase;letter-spacing:0.1em;display:block;margin-bottom:4px;}
.doc-section h3{font-size:19px;font-weight:600;color:var(--text-dark);margin:32px 0 12px;}
.doc-section h4{font-size:16px;font-weight:600;color:var(--text-dark);margin:24px 0 8px;}
.doc-section p{font-size:15px;color:var(--text-body);line-height:1.7;margin-bottom:16px;}
.doc-section ul,.doc-section ol{font-size:15px;color:var(--text-body);line-height:1.7;margin:0 0 16px 24px;}
.doc-section li{margin-bottom:6px;}

/* ===== TABLES ===== */
.table-wrap{overflow-x:auto;margin:16px 0 24px;}
table{width:100%;border-collapse:collapse;font-size:14px;background:var(--white);border:1px solid var(--border-light);}
th{background:var(--rbs-navy);color:var(--white);font-weight:600;text-align:left;padding:12px 16px;font-size:13px;text-transform:uppercase;letter-spacing:0.04em;}
td{padding:12px 16px;border-bottom:1px solid var(--border-light);color:var(--text-body);vertical-align:top;}
tr:last-child td{border-bottom:0;}
tr:nth-child(even) td{background:#fafafa;}
.table-compact td,.table-compact th{padding:8px 12px;font-size:13px;}

/* ===== ALERT BOXES ===== */
.alert{padding:16px 20px;margin:16px 0 24px;font-size:14px;line-height:1.6;border-left:4px solid;}
.alert-danger{background:var(--alert-red-bg);border-color:var(--alert-red);color:#991b1b;}
.alert-warning{background:var(--alert-amber-bg);border-color:var(--alert-amber);color:#92400e;}
.alert-success{background:var(--alert-green-bg);border-color:var(--alert-green);color:#166534;}
.alert-info{background:var(--alert-blue-bg);border-color:#3b82f6;color:#1e40af;}
.alert strong{font-weight:700;}

/* ===== SCREENSHOTS ===== */
.screenshot{margin:20px 0 28px;border:1px solid var(--border-light);box-shadow:var(--shadow-card);overflow:hidden;}
.screenshot img{width:100%;height:auto;display:block;}
.screenshot-caption{background:#fafafa;padding:10px 16px;font-size:13px;color:var(--text-muted);border-top:1px solid var(--border-light);}
.screenshot-details{margin:20px 0 28px;}
.screenshot-details summary{font-size:13px;color:var(--text-muted);cursor:pointer;padding:8px 0;user-select:none;}
.screenshot-details summary:hover{color:var(--rbs-teal);}
.screenshot-details[open] summary{margin-bottom:8px;}
.screenshot-details .screenshot{margin:0;}

/* ===== SECTION NOTES ===== */
.section-note{font-size:13px;color:var(--text-muted);font-style:italic;margin-bottom:20px;}

/* ===== CODE ===== */
code{overflow-wrap:break-word;word-break:break-all;font-family:"Consolas","Monaco",monospace;font-size:0.9em;background:rgba(0,0,0,0.06);padding:2px 5px;}

/* ===== RESPONSE TEMPLATES ===== */
.response-template{background:#f8fafc;border:1px solid var(--border-light);padding:20px 24px;margin:12px 0 24px;position:relative;}
.response-template::before{content:"SUGGESTED RESPONSE";position:absolute;top:-1px;left:16px;background:var(--rbs-teal);color:var(--white);font-size:10px;font-weight:700;letter-spacing:0.1em;padding:3px 10px;}
.response-template p{font-size:14px;color:var(--text-dark);line-height:1.7;margin-bottom:10px;}
.response-template p:last-child{margin-bottom:0;}
.response-template ol,.response-template ul{font-size:14px;margin:8px 0 12px 20px;}

/* ===== INTERNAL NOTES ===== */
.internal-note{background:#fffbeb;border:1px dashed var(--alert-amber-border);padding:12px 16px;margin:8px 0 20px;font-size:13px;color:#92400e;line-height:1.6;}
.internal-note::before{content:"INTERNAL NOTE: ";font-weight:700;}

/* ===== COLLAPSIBLE SECTIONS ===== */
.collapse-item{border-bottom:1px solid var(--border-light);}
.collapse-item:first-child{border-top:1px solid var(--border-light);}
.collapse-btn{width:100%;background:transparent;border:0;padding:18px 48px 18px 0;text-align:left;font-size:16px;font-weight:600;color:var(--text-dark);cursor:pointer;position:relative;transition:color var(--transition);}
.collapse-btn:hover{color:var(--rbs-teal);}
.collapse-btn::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:22px;font-weight:300;color:var(--text-muted);transition:transform 0.2s;}
.collapse-item.open .collapse-btn::after{content:"-";}
.collapse-body{max-height:0;overflow:hidden;transition:max-height 0.3s ease;}
.collapse-item.open .collapse-body{max-height:2000px;}
.collapse-content{padding:0 0 20px;}
.collapse-content p{font-size:14px;margin-bottom:10px;}

/* ===== COMPARISON TABLE ===== */
.compare-table td:first-child{font-weight:600;color:var(--text-dark);width:30%;}
@media(min-width:641px){.compare-table td:first-child{white-space:nowrap;}}
.compare-table .vs-col{width:35%;}

/* ===== STATUS BADGES ===== */
.badge-works{display:inline-block;background:#166534;color:var(--white);font-size:11px;font-weight:700;padding:2px 8px;text-transform:uppercase;letter-spacing:0.06em;}
.badge-broken{display:inline-block;background:#991b1b;color:var(--white);font-size:11px;font-weight:700;padding:2px 8px;text-transform:uppercase;letter-spacing:0.06em;}
.badge-partial{display:inline-block;background:#92400e;color:var(--white);font-size:11px;font-weight:700;padding:2px 8px;text-transform:uppercase;letter-spacing:0.06em;}
.badge-404{display:inline-block;background:#991b1b;color:var(--white);font-size:11px;font-weight:700;padding:2px 8px;text-transform:uppercase;letter-spacing:0.06em;}

/* ===== QUICK REF GRID ===== */
.quick-ref{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0 28px;}
.quick-ref-card{background:var(--white);border:1px solid var(--border-light);padding:20px;box-shadow:var(--shadow-card);}
.quick-ref-card h4{font-size:13px;font-weight:700;color:var(--rbs-teal);text-transform:uppercase;letter-spacing:0.08em;margin:0 0 8px;}
.quick-ref-card p{font-size:14px;color:var(--text-body);margin:0;line-height:1.5;}
@media(max-width:640px){
  .quick-ref{grid-template-columns:1fr;}
}

/* ===== FOOTER ===== */
.doc-footer{background:var(--rbs-navy);padding:32px 24px;text-align:center;}
.doc-footer p{font-size:13px;color:var(--text-inverse-muted);margin:4px 0;}
.doc-footer a{color:var(--rbs-teal-bright);}

/* ===== PRINT ===== */
@media print{
  .doc-header{padding:24px;background:#062F56 !important;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .toc{display:none;}
  .collapse-item.open .collapse-body,.collapse-body{max-height:none !important;overflow:visible;}
  .collapse-btn::after{display:none;}
  .screenshot{break-inside:avoid;}
  .alert{break-inside:avoid;}
}