/* Livio Trades: the familiar Livio layout, with a quiet sea-glass palette. */
:root { --paper:#070e12; --ink:#f1f7f6; --muted:#aabfc3; --blue:#a2d9d0; --panel:#102024; }
.brand { letter-spacing:-1.15px; }
.brand>span { font-size:.83em; letter-spacing:-.8px; margin-top:3px; }
.brand-dot { color:#9bdbcc; }
.gradient-text { background-image:linear-gradient(105deg,#deeee9 5%,#a2d9d0 48%,#92bccd 92%); }
.button { border-color:#c2e8de85; background:linear-gradient(115deg,#d5eee5,#addbd1 60%,#a9cbd8); box-shadow:inset 0 1px 0 #fff8,0 5px 24px #7dc6b916; }
.header nav a { color:#b0c3c7; }
.header nav a[aria-current="location"] { background:#a7dbcf12; color:#dcefe9; box-shadow:inset 0 0 0 1px #c4eadf20; }
.hero { background:radial-gradient(ellipse at 18% 38%,#397c7720,transparent 48%),radial-gradient(ellipse at 86% 28%,#497a8b1c,transparent 46%); }
.hero::after { border-color:#b1e1d513; box-shadow:0 0 90px #7ccbba08,inset 0 0 90px #85b9ce08; }
.hero h1 { font-size:clamp(42px,5.3vw,76px); }
.hero .lead { color:#b0c1c6; }
.hero-foot { color:#a5b9be; }
.benefits article::before { background:linear-gradient(90deg,#addecf80,#9acbd320,transparent); }
.benefit-icon { color:#b4dace; }
.community-section { background:linear-gradient(115deg,#14282a70,#070e12 65%); }
.text-link { border-bottom-color:#a9dbc745; }
.event-note { border-color:#b9e5d51c; background:radial-gradient(ellipse at 100% 0%,#659d9628,transparent 70%),linear-gradient(140deg,#1630338c,#0c1a2080); }
.event-note::before,.event-note::after { border-color:#b8e2d518; }
.event-note::after { box-shadow:0 0 75px #8ccfba12; }
.event-note h3 { max-width:16ch; }
.event-note dt { color:#aec6c5; }
.event-note dd,.event-note>a { color:#cee7df; }
.record-panel { border-color:#c5e8dc24; background:radial-gradient(ellipse at 100% 0%,#67a39b21,transparent 65%),linear-gradient(145deg,#142a2c99,#0c171dcc); }
.record-metrics .record-gain dd { color:#c6e7dc; }
.record-source-row a,.record-provenance a { color:#cfe9e1; }
.faq-list details[open] { border-color:#a6dbca66; }
.faq-list summary span { border-color:#b8dfce28; color:#c5e8da; }
.join-section { border-color:#b6dfd326; background:radial-gradient(ellipse at 50% -45%,#84c8b63b,transparent 73%),linear-gradient(135deg,#112627,#122028 90%); }
.join-section::before { border-color:#c3e5d940; box-shadow:0 0 55px #b4dfcf15,0 12px 65px #7cc9b918; }
.join-section .destination-note { color:#bdcfcf; }
.sticky-join { border-color:#bcded530; background:radial-gradient(ellipse at 0 0,#35766e45,transparent 65%),linear-gradient(115deg,#102326f5,#152025f5); }
.sticky-join .sticky-join-button { box-shadow:0 4px 18px #89cbb820,inset 0 1px 0 #fff5; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline-color:#a9dfce; }
@media(hover:hover) and (pointer:fine) {
  .header nav a:hover { background:#a7dbcf0e; }
  .button:hover:not(:disabled) { box-shadow:inset 0 1px 0 #fff8,0 8px 32px #99cdbb26; }
  .faq-list summary:hover { color:#c4e6d9; }
}
@media(max-width:760px) {
  .hero h1 { font-size:clamp(33px,8.65vw,48px); line-height:1.14; }
  .hero .lead { max-width:28ch; }
  .hero .hero-cta { font-size:16px; gap:8px; }
}
@media(max-width:360px) {
  .hero h1 { font-size:30px; }
  .hero .hero-cta { font-size:15px; padding-inline:10px; }
}

/* Personal introduction with two overlapping Instagram reel cards. */
.meet-livio { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); align-items:center; gap:clamp(32px,5vw,72px); scroll-margin-top:28px; }
.meet-livio-copy { min-width:0; }
.meet-livio-eyebrow { margin:0 0 22px; font-size:12px; line-height:1.6; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#a2d9d0; }
.meet-livio .meet-livio-copy h2 { margin:0 0 25px; font-size:clamp(42px,5vw,64px); line-height:1.06; }
.meet-livio-intro { margin:0 0 24px; font-size:clamp(21px,2.1vw,26px); line-height:1.45; letter-spacing:-.025em; color:#e0ece8; }
.meet-livio-copy .body-copy { margin:0 0 18px; font-size:18px; line-height:1.75; max-width:47ch; }
.meet-livio-links { display:flex; align-items:flex-start; flex-direction:column; gap:12px; margin-top:28px; }
.meet-livio-links a { display:inline-flex; align-items:center; gap:12px; min-height:44px; font-size:16px; line-height:1.5; }
.meet-livio-community { color:#b0c5c5; }
.livio-social { min-width:0; }
.social-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); align-items:start; padding:24px 18px 28px; isolation:isolate; }
.social-card { display:block; min-width:0; grid-row:1; border-radius:22px; box-shadow:0 18px 45px #0008; transition:transform .25s ease; }
.social-card:first-child { grid-column:1/8; transform:rotate(-7deg); }
.social-card:last-child { grid-column:6/13; margin-top:78px; transform:rotate(7deg); z-index:1; }
.social-card:focus-visible { z-index:2; }
.social-card-image { position:relative; overflow:hidden; aspect-ratio:9/16; border:1px solid #d2eee638; border-radius:22px; background:#132426; }
.social-card-image::after { content:''; position:absolute; inset:60% 0 0; background:linear-gradient(transparent,#040b11d9); pointer-events:none; }
.social-card-image img { display:block; height:100%; width:100%; object-fit:cover; }
.social-card-type { position:absolute; z-index:1; top:13px; left:13px; display:flex; align-items:center; gap:6px; padding:6px 10px; border:1px solid #ffffff33; border-radius:30px; background:#0b1519b3; color:#fff; font-size:12px; }
.social-card-open { position:absolute; z-index:1; bottom:20px; left:16px; display:flex; align-items:center; gap:8px; color:#fff; font-size:13px; font-weight:500; }
.reel-note { margin:20px 0 0; text-align:center; color:#aabfc3; font-size:13px; letter-spacing:.015em; }
.reel-note span { margin-left:6px; color:#a2d9d0; }
@media(hover:hover) { .meet-livio-community:hover { color:#e0eee9; } .social-card:first-child:hover { transform:rotate(-4deg) translateY(-6px); z-index:2; } .social-card:last-child:hover { transform:rotate(4deg) translateY(-6px); } }
@media(prefers-reduced-motion:reduce) { .social-card { transition:none; } }
@media(max-width:760px) {
 .meet-livio { grid-template-columns:1fr; gap:32px; }
 .meet-livio-eyebrow { margin-bottom:18px; font-size:11px; }
 .meet-livio .meet-livio-copy h2 { font-size:44px; margin-bottom:22px; }
 .meet-livio-intro { font-size:23px; }
 .meet-livio-links { margin-top:22px; }
 .livio-social { width:100%; max-width:480px; justify-self:center; }
 .social-grid { padding:20px 16px 22px; }
 .social-card:last-child { margin-top:54px; }
 .social-card,.social-card-image { border-radius:16px; }
 .social-card-type { top:9px; left:9px; font-size:11px; padding:4px 7px; }
 .social-card-type svg { width:16px; height:16px; }
 .social-card-open { left:10px; bottom:14px; font-size:11px; gap:5px; }
 .reel-note { margin-top:12px; font-size:12px; }
}