/* leoyumar.com — design v2.1 (2026-10-21 1:15 PM ET): blue → light steel blue-gray signature gradient, warm coral secondary */
:root{
  --blue:#3451e6;--steel:#8fa8c8;--steel-2:#a9bcd3;--steel-text:#5b7699;--cyan:#0ea5e9;--coral:#ff6b4a;
  --grad:linear-gradient(120deg,#3451e6 0%,#7d93b2 60%,#a9bcd3 100%);
  --grad-strong:linear-gradient(120deg,#3451e6 0%,#4f6d93 100%);
  --grad-text:linear-gradient(120deg,#3451e6 0%,#4a6b94 60%,#5b7699 100%);
  --grad-soft:linear-gradient(120deg,rgba(52,81,230,.12),rgba(143,168,200,.18) 55%,rgba(255,107,74,.10));
  --bg:#ffffff;--text:#14151f;--muted:#4f5263;--faint:#6b6e80;--line:rgba(20,21,40,.10);
  --card:#ffffff;--card-glass:rgba(255,255,255,.72);--nav:rgba(255,255,255,.7);
  --tint-a:linear-gradient(180deg,#f6f8fd 0%,#f1f5fa 100%);
  --tint-b:radial-gradient(1200px 500px at 85% 0%,rgba(14,165,233,.07),transparent 60%),radial-gradient(900px 500px at 0% 100%,rgba(143,168,200,.14),transparent 60%),#ffffff;
  --tint-c:linear-gradient(160deg,#eff3fd 0%,#edf2f8 55%,#fdf4f1 100%);
  --shadow:0 1px 2px rgba(20,21,40,.04),0 10px 30px -12px rgba(40,40,90,.18);
  --shadow-hover:0 2px 6px rgba(20,21,40,.05),0 24px 48px -16px rgba(52,81,230,.28);
  --accent:#3451e6;--link:#3349d6;
  --max:1120px;--radius:24px;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter","Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
  --blob-o:.55;
}
:root[data-theme=dark]{
  --bg:#070a12;--text:#f4f4fb;--muted:#b4b6c8;--faint:#9a9db2;--line:rgba(255,255,255,.10);
  --card:#101624;--card-glass:rgba(18,26,42,.62);--nav:rgba(8,12,20,.7);
  --tint-a:linear-gradient(180deg,#0a0f1a 0%,#0e1624 100%);
  --tint-b:radial-gradient(1200px 500px at 85% 0%,rgba(14,165,233,.10),transparent 60%),radial-gradient(900px 500px at 0% 100%,rgba(125,147,178,.14),transparent 60%),#070a12;
  --tint-c:linear-gradient(160deg,#0b1226 0%,#101a2b 55%,#1c1416 100%);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 36px -14px rgba(0,0,0,.7);
  --shadow-hover:0 2px 6px rgba(0,0,0,.4),0 28px 56px -18px rgba(52,81,230,.5);
  --accent:#8ea2ff;--link:#a5b4ff;--blob-o:.5;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#070a12;--text:#f4f4fb;--muted:#b4b6c8;--faint:#9a9db2;--line:rgba(255,255,255,.10);
  --card:#101624;--card-glass:rgba(18,26,42,.62);--nav:rgba(8,12,20,.7);
  --tint-a:linear-gradient(180deg,#0a0f1a 0%,#0e1624 100%);
  --tint-b:radial-gradient(1200px 500px at 85% 0%,rgba(14,165,233,.10),transparent 60%),radial-gradient(900px 500px at 0% 100%,rgba(125,147,178,.14),transparent 60%),#070a12;
  --tint-c:linear-gradient(160deg,#0b1226 0%,#101a2b 55%,#1c1416 100%);
  --shadow:0 1px 2px rgba(0,0,0,.4),0 14px 36px -14px rgba(0,0,0,.7);
  --shadow-hover:0 2px 6px rgba(0,0,0,.4),0 28px 56px -18px rgba(52,81,230,.5);
  --accent:#8ea2ff;--link:#a5b4ff;--blob-o:.5}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:64px;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;letter-spacing:-.011em;overflow-x:hidden}
a{color:var(--link);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px;position:relative;z-index:1}
.ic{flex:none;vertical-align:middle}.ic.sm{width:18px;height:18px}
.grad-text{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
:root[data-theme=dark] .grad-text{background:linear-gradient(120deg,#8ea2ff,#a9bcd3 55%,#cfdbe9)!important;-webkit-background-clip:text!important;background-clip:text!important}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .grad-text{background:linear-gradient(120deg,#8ea2ff,#a9bcd3 55%,#cfdbe9);-webkit-background-clip:text;background-clip:text}}
/* nav */
.nav{position:sticky;top:0;z-index:50;background:var(--nav);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:56px}
.brand{font-weight:650;font-size:17px;color:var(--text);letter-spacing:-.02em;display:inline-flex;align-items:center;gap:10px}.brand:hover{text-decoration:none}
.brand::before{content:"LY";display:inline-grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--grad-strong);color:#fff;font-size:11px;font-weight:700;letter-spacing:0}
.links{display:flex;gap:28px;align-items:center}
.links a{color:var(--text);opacity:.78;font-size:14px;position:relative}.links a:hover{opacity:1;text-decoration:none}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--grad);transform:scaleX(0);transition:transform .25s}
.links a:hover::after{transform:scaleX(1)}
.icon-btn{background:none;border:0;color:var(--text);opacity:.8;cursor:pointer;padding:8px;border-radius:10px;font:inherit;display:inline-flex}
.icon-btn:hover{opacity:1;background:var(--line)}
.menu-btn{display:none}
@media (max-width:760px){
  .menu-btn{display:inline-flex}
  .links{position:absolute;top:56px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--bg);border-bottom:1px solid var(--line);padding:8px 24px 16px;display:none}
  .links.open{display:flex}
  .links a{font-size:17px;padding:12px 0;width:100%;border-bottom:1px solid var(--line)}
  .links a::after{display:none}
  .links a:last-of-type{border-bottom:0}
}
/* sections */
section{padding:112px 0;position:relative;overflow:hidden}
.tint-a{background:var(--tint-a)}.tint-b{background:var(--tint-b)}.tint-c{background:var(--tint-c)}
.eyebrow{font-size:14px;font-weight:650;margin:0 0 12px;letter-spacing:.02em;text-transform:uppercase;color:var(--accent)}
.eyebrow.pill{display:inline-flex;align-items:center;gap:8px;text-transform:none;letter-spacing:0;font-size:14px;padding:6px 14px;border-radius:999px;background:var(--card-glass);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--text)}
.eyebrow.pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 4px rgba(255,107,74,.18)}
h1,h2,h3{letter-spacing:-.035em;line-height:1.04;margin:0}
h1{font-size:clamp(48px,7.6vw,92px);font-weight:750}
h2{font-size:clamp(36px,5.2vw,60px);font-weight:720;margin-bottom:20px}
h3{font-size:21px;font-weight:650;letter-spacing:-.02em;line-height:1.2;margin-bottom:8px}
.lead{font-size:clamp(19px,2.2vw,23px);color:var(--muted);line-height:1.45;max-width:640px;letter-spacing:-.015em}
p{margin:0 0 16px}
/* blobs */
.hero-bg,.band-bg,.doc-hero{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:var(--blob-o);will-change:transform}
.b1{width:560px;height:560px;background:#5b7bff;top:-160px;right:-80px;animation:float1 16s ease-in-out infinite}
.b2{width:460px;height:460px;background:#8fa8c8;top:140px;right:260px;animation:float2 19s ease-in-out infinite}
.b3{width:380px;height:380px;background:#ff8a65;bottom:-160px;left:-80px;opacity:calc(var(--blob-o)*.7);animation:float3 22s ease-in-out infinite}
.grain{position:absolute;inset:0;background-image:radial-gradient(rgba(30,45,80,.06) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000,transparent 85%);-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%)}
:root[data-theme=dark] .grain{background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px)}
@keyframes float1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-40px,40px) scale(1.08)}}
@keyframes float2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(50px,-30px) scale(.94)}}
@keyframes float3{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,-40px)}}
/* hero */
.hero{padding:104px 0 128px;background:var(--bg)}
.hero .hero-bg{transform:translate3d(0,var(--py,0px),0)}
.hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.hero .lead{margin:24px 0 34px}
.photo-wrap{position:relative}
.photo-glow{position:absolute;inset:-18px;border-radius:40px;background:var(--grad);filter:blur(36px);opacity:.45;animation:pulse 8s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.38;transform:scale(.98)}50%{opacity:.55;transform:scale(1.02)}}
.photo{position:relative;border-radius:32px;overflow:hidden;aspect-ratio:4/5;padding:4px;background:var(--grad);box-shadow:var(--shadow)}
.photo picture,.photo img{width:100%;height:100%;border-radius:28px;object-fit:cover}
.loc{display:flex;align-items:center;gap:6px;color:var(--faint);font-size:15px;margin-top:24px}
.center .loc{justify-content:center}
.ctas{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:980px;padding:13px 24px;font-size:17px;font-weight:550;border:1px solid transparent;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,background .25s,border-color .25s}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn-primary{background:var(--grad-strong);color:#fff;box-shadow:0 8px 24px -8px rgba(52,81,230,.55)}
.btn-primary:hover{box-shadow:0 14px 34px -8px rgba(52,81,230,.7)}
.btn-ghost{color:var(--text);background:var(--card-glass);border-color:var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-ghost:hover{border-color:rgba(52,81,230,.4);box-shadow:0 10px 24px -12px rgba(52,81,230,.45)}
.btn .ic.sm:last-child{transition:transform .25s}.btn:hover .ic.sm:last-child{transform:translateX(3px)}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr;gap:44px}.hero{padding:48px 0 88px}.photo-wrap{max-width:400px;order:-1}section{padding:84px 0}.b1{width:380px;height:380px}.b2{width:300px;height:300px;right:40px}}
/* cards */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:52px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.card{position:relative;background:var(--card);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow);border:1px solid var(--line)}
.card p{color:var(--muted);margin:0}
.lift{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.lift:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover)}
.card.lift:hover{border-color:rgba(52,81,230,.35)}
.tag{font-size:12px;font-weight:650;color:var(--faint);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px;display:block}
.chip{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:14px;color:#fff;margin-bottom:20px;box-shadow:0 10px 20px -10px rgba(40,60,140,.55)}
.chip.c1{background:linear-gradient(135deg,#3451e6,#4f6d93)}
.chip.c2{background:linear-gradient(135deg,#0284c7,#3451e6)}
.chip.c3{background:linear-gradient(135deg,#e85a3c,#c2410c)}
.chip.w{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);box-shadow:none;margin:0}
@media (max-width:900px){.grid,.grid.two{grid-template-columns:1fr}}
/* glass + gradient border projects */
.card.glass{background:linear-gradient(var(--card-glass),var(--card-glass)) padding-box,linear-gradient(135deg,rgba(52,81,230,.55),rgba(143,168,200,.55) 50%,rgba(255,107,74,.45)) border-box;border:1.5px solid transparent;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;flex-direction:column;padding:36px}
.card.glass p{margin-bottom:22px}
.card-top{display:flex;align-items:center;gap:14px;margin-bottom:14px}.card-top .chip{margin:0}.card-top .tag{margin:0}
.points{list-style:none;padding:0;margin:auto 0 0;border-top:1px solid var(--line)}
.points li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;color:var(--text)}
.points li:last-child{border-bottom:0;padding-bottom:0}
.chk{flex:none;margin-top:2px;width:20px;height:20px;padding:3px;border-radius:50%;background:var(--grad-strong);color:#fff}
/* about */
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:72px}
.about-copy{position:relative;padding-left:28px;border-left:3px solid;border-image:var(--grad) 1}
.about-copy p{font-size:19px;color:var(--muted);line-height:1.65}
@media (max-width:860px){.about{grid-template-columns:1fr;gap:20px}.about-copy{padding-left:20px}}
/* contact band */
.band{background:linear-gradient(125deg,#2743c4 0%,#34509e 45%,#3f5f8c 75%,#4a6b94 100%);color:#fff;padding:120px 0}
:root[data-theme=dark] .band{background:linear-gradient(125deg,#14215e 0%,#1a2b52 45%,#22344f 75%,#2a3d57 100%)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .band{background:linear-gradient(125deg,#14215e 0%,#1a2b52 45%,#22344f 75%,#2a3d57 100%)}}
.band .eyebrow{color:#fff}
.band h2{color:#fff;font-size:clamp(44px,7vw,84px)}
.band .lead{color:#fff}
.band .loc{color:#fff}
.b4{width:520px;height:520px;background:#1e3a8a;top:-220px;left:-120px;opacity:.45;animation:float1 18s ease-in-out infinite}
.b5{width:480px;height:480px;background:#ff6b4a;bottom:-300px;right:-160px;opacity:.18;animation:float2 21s ease-in-out infinite}
.center{text-align:center}.center .lead{margin:0 auto}
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:820px;margin:52px auto 0;text-align:left}
.ccard{display:flex;gap:18px;align-items:center;padding:24px 26px;border-radius:var(--radius);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#fff}
.ccard:hover{text-decoration:none;background:rgba(255,255,255,.14);box-shadow:0 24px 48px -18px rgba(0,0,0,.45)}
.ccard .tag{color:#fff;margin-bottom:4px}
.ccard .addr{display:block;font-size:19px;font-weight:600;word-break:break-word}
.ccard .note{display:block;font-size:14px;color:#fff;margin-top:4px}
@media (max-width:640px){.contact-grid{grid-template-columns:1fr}}
.socials{display:flex;gap:14px;justify-content:center;margin-top:36px;flex-wrap:wrap}
.btn-white{background:#fff;color:#2743c4;font-size:18px;padding:16px 30px;box-shadow:0 12px 30px -10px rgba(0,0,0,.4)}
.btn-white:hover{box-shadow:0 18px 40px -10px rgba(0,0,0,.5)}
.btn-glass{color:#fff;background:rgba(8,20,60,.22);border-color:rgba(255,255,255,.45);font-size:18px;padding:16px 28px}
.btn-glass:hover{background:rgba(8,20,60,.32)}
/* legal pages */
main:has(> .doc){position:relative;background:var(--tint-a)}
.doc-hero{height:420px;bottom:auto}
.doc-hero .b1{width:420px;height:420px;top:-200px;right:-60px;opacity:calc(var(--blob-o)*.6)}
.doc-hero .b2{width:340px;height:340px;top:-160px;right:340px;opacity:calc(var(--blob-o)*.5)}
.doc{position:relative;z-index:1;max-width:800px;margin:0 auto;padding:72px 24px 104px}
.doc h1{font-size:clamp(38px,5.4vw,56px);margin-bottom:14px}
.doc>h1{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-bottom:4px}
:root[data-theme=dark] .doc>h1{background:linear-gradient(120deg,#8ea2ff,#a9bcd3 55%,#cfdbe9);-webkit-background-clip:text;background-clip:text}
.doc h2{font-size:23px;margin:44px 0 12px;letter-spacing:-.02em;padding-left:14px;border-left:3px solid;border-image:var(--grad) 1}
.doc p,.doc li{color:var(--muted);font-size:17px;line-height:1.7}
.doc strong{color:var(--text)}
.doc ul{padding-left:22px}.doc li::marker{color:var(--blue)}
.msg{background:var(--card);border-radius:18px 18px 18px 6px;padding:16px 20px;font-size:15px;color:var(--text)!important;border:1px solid var(--line);box-shadow:var(--shadow);margin:12px 0;max-width:620px}
.meta{color:var(--faint)!important;font-size:15px!important}
.box{background:linear-gradient(var(--card),var(--card)) padding-box,var(--grad) border-box;border:1.5px solid transparent;border-radius:var(--radius);padding:24px 28px;margin:24px 0;box-shadow:var(--shadow)}
/* footer */
footer{background:var(--bg);color:var(--faint);font-size:13px;padding:30px 0 38px;border-top:1px solid var(--line)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
footer a{color:var(--muted)}footer a:hover{color:var(--text)}footer nav{display:flex;gap:18px;flex-wrap:wrap}
.brand-mark{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:7px;background:var(--grad-strong);color:#fff;font-size:9px;font-weight:700;margin-right:6px;vertical-align:middle}
/* reveal: content is visible by default; only hidden once JS confirms it can reveal */
.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}
.js .grid .reveal:nth-child(2){transition-delay:.08s}.js .grid .reveal:nth-child(3){transition-delay:.16s}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  .blob,.photo-glow{animation:none!important}
  .hero .hero-bg{transform:none!important}
  .lift:hover,.btn:hover{transform:none}
}
:focus-visible{outline:3px solid #3451e6;outline-offset:3px;border-radius:8px}
.contact-grid.one{grid-template-columns:1fr;max-width:460px}
