/* ============================================================ L&M Property Sourcing — UPGRADE LAYER (Jul 2026) Premium polish: rounded geometry, depth, imagery frames. Loaded last in on every page. Non-destructive overrides. ============================================================ */ :root{ --lm-r: 16px; --lm-r-sm: 12px; --lm-r-lg: 26px; --lm-gold: #D4AF37; --lm-navy: #0A192F; --lm-shadow: 0 22px 60px -28px rgba(10,25,47,.55); --lm-shadow-sm: 0 10px 30px -18px rgba(10,25,47,.40); --lm-ease: cubic-bezier(.2,.7,.2,1); } /* ---- rounded geometry on all media + boxes ---- */ img:not([src$=".svg"]):not(.no-round), video:not(.hero-video):not(.no-round){ border-radius: var(--lm-r) !important; } .card,.step,.tile,.panel,.disc,.dcard,.pcard,.scard,.feature, .faq-item,.stat,.chip,.badge,.pill,blockquote,table,figure, .lmt-m,.box,.note,.callout{ border-radius: var(--lm-r-sm) !important; } .field input,.field textarea,.field select, input[type=text],input[type=email],input[type=tel],input[type=number], select,textarea{ border-radius: var(--lm-r-sm) !important; } .btn,button{ border-radius: 999px !important; } /* ---- refined depth + motion on cards ---- */ .card,.step,.faq-item,.tile,.panel,.feature,.disc,.dcard,.pcard,.scard{ transition: transform .4s var(--lm-ease), box-shadow .4s var(--lm-ease); } .card:hover,.step:hover,.tile:hover,.feature:hover, .disc:hover,.dcard:hover,.pcard:hover,.scard:hover{ transform: translateY(-5px); box-shadow: var(--lm-shadow); } /* ---- buttons ---- */ .btn,button{ transition: transform .25s var(--lm-ease), box-shadow .25s, background .25s, color .25s; } .btn:hover,button:hover{ transform: translateY(-2px); } .btn-gold{ box-shadow: 0 12px 28px -14px rgba(212,175,55,.65); } .btn-gold:hover{ box-shadow: 0 18px 36px -14px rgba(212,175,55,.75); } /* ---- inputs focus ring ---- */ input:focus,textarea:focus,select:focus{ outline: none !important; border-color: var(--lm-gold) !important; box-shadow: 0 0 0 3px rgba(212,175,55,.26) !important; } /* ---- image frame utility ---- */ .lm-figure{ position: relative; border-radius: var(--lm-r-lg); overflow: hidden; box-shadow: var(--lm-shadow); background: #0F2240; } .lm-figure img{ width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0 !important; transition: transform 1.1s var(--lm-ease); } .lm-figure:hover img{ transform: scale(1.045); } .lm-figure::after{ content:""; position:absolute; inset:0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(212,175,55,.28); pointer-events:none; } .lm-figure.tall{ aspect-ratio: 3/4; } .lm-figure.wide{ aspect-ratio: 16/9; } .lm-figure.band{ aspect-ratio: 4/3; } /* image + text band */ .lm-band{ display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(26px,4vw,60px); align-items:center; max-width:1120px; margin: 0 auto; } .lm-band.reverse .lm-figure{ order: 2; } @media(max-width:840px){ .lm-band{ grid-template-columns:1fr; } .lm-band.reverse .lm-figure{ order: 0; } } /* full-width image strip */ .lm-strip{ border-radius: var(--lm-r-lg); overflow:hidden; box-shadow: var(--lm-shadow); aspect-ratio: 21/7; position:relative; } .lm-strip img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:0 !important; } .lm-strip::after{ content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(10,25,47,.72), rgba(10,25,47,.15) 55%, rgba(10,25,47,0)); } .lm-strip .lm-strip-cap{ position:absolute; left: clamp(20px,4vw,52px); top:50%; transform:translateY(-50%); color:#FAF7F0; max-width: 520px; z-index:2; } .lm-strip .lm-strip-cap .k{ color: var(--lm-gold); font-size:.72rem; letter-spacing:3px; text-transform:uppercase; font-weight:700; } .lm-strip .lm-strip-cap h3{ font-family: Georgia, serif; font-weight:400; font-size: clamp(1.5rem,3vw,2.3rem); margin:.3em 0 0; line-height:1.12; } /* ---- faceless team desk cards ---- */ .lm-desk{ background: rgba(255,255,255,.03); border:1px solid rgba(212,175,55,.22); padding: 30px 26px; text-align:center; } .lm-desk .mono{ width:64px; height:64px; margin:0 auto 16px; border-radius:50%; display:grid; place-items:center; font-family: Georgia, serif; font-size:1.5rem; color:#0A192F; background: linear-gradient(145deg, #E5C04F, #D4AF37); box-shadow: 0 10px 24px -12px rgba(212,175,55,.7); } .lm-desk h3{ font-family: Georgia, serif; color:#FAF7F0; font-size:1.3rem; margin:0; font-weight:600; } .lm-desk .role{ display:block; font-size:.68rem; letter-spacing:1.6px; text-transform:uppercase; color:#D4AF37; font-weight:700; margin-top:8px; } .lm-desk .role-desc{ color:#aeb8c6; font-size:.92rem; margin-top:12px; line-height:1.55; } /* subtle reveal on scroll-in (progressive; no JS dependency) */ @media (prefers-reduced-motion: no-preference){ .lm-reveal{ opacity:0; transform: translateY(18px); animation: lmRise .9s var(--lm-ease) forwards; } @keyframes lmRise{ to{ opacity:1; transform:none; } } }