/* Live palettes, pointer glow and color interactions. */
:root{--live-primary:#155de0;--live-secondary:#087e92;--live-accent:#e45d35;--live-pale:#edf4ff;--live-soft:#e5fbfa;--live-warm:#fff1e9;--live-glow:#9ebcff;--live-glow2:#78e3d6;--live-border:#d3e1f4;--live-dark:#1748aa;--live-ink:#17354c;--live-muted:#516978;--blue:var(--live-primary);--navy:var(--live-dark);--accent:var(--live-accent);--ink:var(--live-ink);--muted:var(--live-muted);--line:var(--live-border)}
:root[data-palette="violet"]{--live-primary:#773bdd;--live-secondary:#bb287c;--live-accent:#bd600d;--live-pale:#f5eeff;--live-soft:#fff0f7;--live-warm:#fff7df;--live-glow:#d2afff;--live-glow2:#ffa9db;--live-border:#e4d8f7;--live-dark:#5826ad;--live-ink:#352345;--live-muted:#6a5877}
:root[data-palette="tropical"]{--live-primary:#087865;--live-secondary:#236fe1;--live-accent:#cf4f40;--live-pale:#e7fbf3;--live-soft:#eaf4ff;--live-warm:#fff1ec;--live-glow:#77e5bd;--live-glow2:#98cdff;--live-border:#cce9df;--live-dark:#075b4d;--live-ink:#173d34;--live-muted:#526f66}
body{color:var(--live-ink)}h1,h2,h3{color:var(--live-ink)}p{color:var(--live-muted)}
.hero{--pointer-x:80%;--pointer-y:30%;background:radial-gradient(ellipse at var(--pointer-x) var(--pointer-y),var(--live-glow) 0,transparent 50%),radial-gradient(ellipse at 10% 100%,var(--live-glow2) 0,transparent 48%),linear-gradient(120deg,#fff,var(--live-pale));transition:background-color .4s}
.hero h1 em{color:var(--live-primary);background:linear-gradient(110deg,var(--live-primary),var(--live-secondary),var(--live-primary));background-size:200% auto;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:color-flow 9s ease-in-out infinite}
.hero .eyebrow,.eyebrow,.card-number,.date{color:var(--live-primary)}
.hero .lead,.hero .intro,.contact-layout>div>p{color:var(--live-muted)}
.hero .text-link,.text-link,.contact-layout>div>a,.project-footer{color:var(--live-primary)}
.hero .text-link:hover,.text-link:hover,.contact-layout>div>a:hover{color:var(--live-accent)}
.brand{color:var(--live-primary)}.brand>span{color:var(--live-ink)}
nav a:not(.nav-contact){position:relative}nav a:not(.nav-contact):after{content:'';position:absolute;bottom:-6px;left:0;width:100%;height:2px;background:var(--live-accent);transform:scaleX(0);transform-origin:left;transition:transform .25s}nav a:hover:after,nav a.is-current:after{transform:scaleX(1)}nav a:hover,nav a.is-current{color:var(--live-primary)}
.button,.hero .button,form .button,.nav-contact,#back-top{color:white;background:linear-gradient(115deg,var(--live-primary),var(--live-secondary));background-size:200% 200%;border-color:transparent;box-shadow:0 6px 20px #17354c20;transition:background-position .35s,box-shadow .35s,transform .25s}
.button:hover,.hero .button:hover,form .button:hover,.nav-contact:hover,#back-top:hover{color:#fff;background:linear-gradient(115deg,var(--live-primary),var(--live-secondary));background-size:200% 200%;background-position:100% 100%;transform:translateY(-3px);box-shadow:0 9px 26px #17354c30}
.hero-visual{background:linear-gradient(135deg,var(--live-glow2),var(--live-glow),var(--live-soft));border-color:var(--live-border);border-bottom-color:var(--live-accent)}.portrait-label>span:last-child,.visual-note{color:var(--live-primary)}.credentials,.credentials span:first-child{color:var(--live-accent)}
.stats-band{background:linear-gradient(110deg,var(--live-primary),var(--live-secondary));border-bottom-color:var(--live-glow2)}.stats strong{color:white}.stats p{color:#fff}.stats>div{transition:background .25s,transform .25s;border-radius:7px}.stats>div:hover{background:#ffffff15;transform:translateY(-3px)}
.tinted{background:linear-gradient(135deg,var(--live-soft),var(--live-pale))}
.expertise-grid article{border-top-color:var(--live-primary)}.expertise-grid article:nth-child(2){border-top-color:var(--live-secondary)}.expertise-grid article:nth-child(3){border-top-color:var(--live-accent)}.expertise-grid article:nth-child(4){border-top-color:var(--live-primary)}
.expertise-grid article,.project-pair article,.gallery-item{transition:background .35s,border-color .35s,box-shadow .35s,transform .25s}
.expertise-grid article:hover{background:var(--live-pale);border-color:var(--live-primary);box-shadow:0 12px 30px #17354c18}.expertise-grid article:hover .card-number{color:var(--live-accent)}
.feature-project>div{background:linear-gradient(135deg,#fff,var(--live-pale))}.project-pair article:first-child{background:var(--live-warm);border-top-color:var(--live-accent)}.project-pair article:last-child{background:var(--live-soft);border-top-color:var(--live-secondary)}.project-pair article:hover{background:var(--live-pale);transform:translateY(-4px);box-shadow:0 12px 30px #17354c15}
.tags span{color:var(--live-primary);background:var(--live-pale);border-color:var(--live-border)}.timeline article{border-left-color:var(--live-border)}.timeline article:before{background:var(--live-primary);box-shadow:0 0 0 5px var(--live-pale)}
.gallery-section{background:linear-gradient(130deg,var(--live-soft),var(--live-pale),var(--live-warm));border-color:var(--live-border)}.gallery-section .eyebrow{color:var(--live-primary)}.gallery-section .section-heading>p,.gallery-caption{color:var(--live-muted)}.gallery-item:hover{background:var(--live-pale);border-color:var(--live-primary)}.gallery-enlarge{background:var(--live-accent);color:white;transition:background .25s,transform .25s}.gallery-item:hover .gallery-enlarge{background:var(--live-primary);transform:rotate(45deg)}
.qualifications h3{color:var(--live-primary)}.faq summary:after{background:var(--live-soft);color:var(--live-primary)}.faq details[open]{background:var(--live-pale);border-radius:7px;padding:18px 12px;border-color:var(--live-primary)}
.contact-section{background:radial-gradient(ellipse at 5% 100%,var(--live-glow2),transparent 65%),linear-gradient(120deg,var(--live-pale),var(--live-soft),var(--live-warm));border-top-color:var(--live-glow2)}.contact-section .eyebrow{color:var(--live-primary)}.photo-stage button{background:var(--live-primary)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline-color:var(--live-primary)}
.palette-inline{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:25px}.palette-inline>span{font-size:11px;font-weight:600;color:var(--live-muted);margin-right:4px}.palette-choice{display:flex;gap:7px;align-items:center;border:1px solid var(--live-border);border-radius:30px;background:#ffffffcf;padding:8px 12px;font-size:11px;line-height:1.4;cursor:pointer;color:var(--live-ink);transition:transform .2s,border-color .2s,background .2s}.palette-choice:hover{transform:translateY(-2px);border-color:var(--live-primary)}.palette-choice[aria-pressed="true"]{background:white;border:2px solid var(--live-primary);padding:7px 11px;box-shadow:0 3px 10px #17354c12}.palette-swatch{width:17px;height:17px;border-radius:50%;display:inline-block;background:linear-gradient(135deg,#155de0 50%,#09afc0 50%)}[data-set-palette="violet"] .palette-swatch{background:linear-gradient(135deg,#773bdd 50%,#f279bb 50%)}[data-set-palette="tropical"] .palette-swatch{background:linear-gradient(135deg,#087865 50%,#ff8c76 50%)}
#palette-toggle{position:fixed;left:22px;bottom:22px;z-index:25;background:#fff;border:1px solid var(--live-border);border-radius:30px;padding:10px 15px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:600;color:var(--live-ink);cursor:pointer;box-shadow:0 5px 22px #17354c18}#palette-toggle:hover{border-color:var(--live-primary);transform:translateY(-2px)}.palette-icon{width:19px;height:19px;border-radius:50%;background:conic-gradient(#155de0,#20c7c1,#ff977c,#a465ef,#155de0)}
#palette-panel{position:fixed;left:22px;bottom:80px;z-index:26;background:#fff;border:1px solid var(--live-border);border-radius:12px;padding:20px;box-shadow:0 10px 40px #17354c25;width:280px;max-width:calc(100vw - 44px)}#palette-panel[hidden]{display:none}#palette-panel h3{font-size:16px;margin-bottom:6px}#palette-panel p{font-size:11px;margin-bottom:14px}#palette-panel .palette-choice{width:100%;margin-top:9px;text-align:left}#palette-panel .palette-choice[aria-pressed="true"]:after{content:'✓';margin-left:auto;color:var(--live-primary)}
@keyframes color-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@media(max-width:760px){.palette-inline{gap:7px}.palette-inline>span{width:100%}nav a:after{bottom:0}nav .nav-contact:hover{color:white}#palette-toggle{left:16px;bottom:20px}#palette-panel{left:16px;bottom:77px}.hero{padding-left:24px;padding-right:24px}}
@media(prefers-reduced-motion:reduce){.hero h1 em{animation:none}*{transition:none!important}}
