/* ===== RAINCLOUD shared additions (nav, footer, sub-page components) ===== */
/* NAV */
nav .nav-links { gap: 28px; }
nav .nav-links a { color: var(--text-secondary); }
nav .nav-links a:hover { color: var(--accent-blue); }
nav .nav-links a:hover::after { background: var(--accent-blue); }
nav .nav-links .nav-cta { color: var(--text-primary); font-size: 0.68rem; padding: 9px 20px; border: 1px solid var(--text-primary); transition: all .3s ease; }
nav .nav-links .nav-cta:hover { background: var(--text-primary); color: var(--bg-primary); }
nav .nav-links .nav-cta::after { display: none; }
.has-dropdown { position: relative; }
.has-dropdown > a::after { display: none; }
.has-dropdown > a .caret { display:inline-block; margin-left:6px; width:6px; height:6px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.dropdown { display: none; position: absolute; top: 100%; left: -20px; padding-top: 14px; min-width: 220px; z-index: 200; list-style: none; margin: 0; }
.dropdown::before { content:''; position:absolute; top:14px; left:0; right:0; bottom:0; background: var(--bg-secondary); border: 1px solid rgba(255,255,255,0.08); z-index:-1; }
.dropdown li { padding: 0; }
.dropdown li a { display: block; padding: 9px 22px; font-size: 0.72rem; color: var(--text-secondary); text-transform: none; letter-spacing: 0.02em; white-space: nowrap; }
.dropdown li a::after { display: none; }
.dropdown li a:hover { color: var(--text-primary); background: rgba(255,255,255,0.03); }
.has-dropdown:hover .dropdown, .has-dropdown:focus-within .dropdown { display: block; }
@media (max-width: 768px) {
  .nav-links.open { max-height: calc(100vh - 60px); overflow-y: auto; }
  .dropdown { position: static; display: none; padding: 0 0 0 16px; min-width: 0; margin: 4px 0; }
  .dropdown::before { display:none; }
  .dropdown li a { padding: 7px 0; font-size: 0.8rem; }
  .nav-links.open .has-dropdown.expanded > .dropdown { display: block; }
  nav .nav-links .nav-cta { display:inline-block; text-align:center; }
}
/* FOOTER */
footer.sf { border-top: 1px solid var(--border-subtle); padding: 56px 0 40px; background: var(--bg-primary); }
footer.sf .sf-top { display: grid; grid-template-columns: 1.1fr 2fr; gap: 40px; align-items: start; }
footer.sf .sf-logo { font-family: var(--font-heading); font-weight: 300; font-size: 0.95rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--text-tertiary); }
footer.sf .sf-logo em { font-style: normal; color: var(--text-tertiary); font-weight: 200; }
footer.sf .sf-tag { margin-top: 12px; font-size: .78rem; color: var(--text-tertiary); max-width: 280px; }
footer.sf .sf-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
footer.sf .sf-h { font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: var(--text-tertiary); margin-bottom: 12px; font-weight: 600; }
footer.sf ul { list-style: none; display: block; padding: 0; margin: 0; }
footer.sf li { margin-bottom: 8px; }
footer.sf li a { font-size: 0.78rem; color: var(--text-secondary); transition: color .3s ease; }
footer.sf li a:hover { color: var(--text-primary); }
footer.sf .sf-copy { margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--border-subtle); font-size: .68rem; color: var(--text-tertiary); }
@media (max-width: 768px) { footer.sf .sf-top { grid-template-columns: 1fr; } footer.sf .sf-cols { grid-template-columns: 1fr 1fr; } }
/* INSTEAD OF */
.instead { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border-subtle); }
.instead-row { background: var(--bg-primary); padding: clamp(24px, 2.8vw, 36px); }
.alt .instead-row { background: var(--bg-secondary); }
.instead-row .io { font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--text-tertiary); margin-bottom: 8px; }
.instead-row h3 { font-size: 1.05rem; margin-bottom: 12px; }
.instead-row p { font-size: .84rem; line-height: 1.65; }
.instead-row .tradeoff { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-subtle); font-size: .78rem; color: var(--text-tertiary); }
.instead-row .tradeoff b { color: var(--text-secondary); font-weight: 500; }
@media (max-width: 900px) { .instead { grid-template-columns: 1fr; } }
/* PAIRS */
.pairs { display: flex; flex-wrap: wrap; gap: 12px 14px; align-items: center; }
.pairs .pl { font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: var(--text-tertiary); margin-right: 10px; font-weight: 600; }
.pair-chip { font-size: .78rem; color: var(--text-primary); border: 1px solid var(--border-medium); padding: 10px 18px; transition: all .3s; }
.pair-chip:hover { border-color: var(--accent-blue); color: var(--accent-blue); }
.pairs-wrap { padding: 36px 0; border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
/* button arrow sizing (svg had no intrinsic size) */
.btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; flex: none; }
.btn { white-space: nowrap; }
@media (max-width: 480px) { .btn { white-space: normal; } }
.tier-card { position: relative; }
.tier-badge { position: absolute; top: 16px; right: 16px; margin: 0; }
.hero .container { width: 100%; }
.cards.c1 { --cols: 1; }
.text-link { display: inline-block; color: var(--text-primary); border-bottom: 1px solid var(--border-medium); padding-bottom: 1px; transition: color .3s, border-color .3s; }
.text-link:hover { color: var(--accent-blue); border-color: var(--accent-blue); }