/* Shared visual system derived from the demo overview. */
body:is(.hub,.vet,.medical,.craft){--paper:#11171d;--ink:#f4f5f4;--muted:#aab5bd;--accent:#bfd9e9;--line:#ffffff24;--surface:#202931;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;color-scheme:dark}
body:is(.vet,.medical,.craft) :is(h1,h2,h3){font-family:'DM Sans',sans-serif;font-weight:500;letter-spacing:-.045em}
body:is(.vet,.medical,.craft) :is(h1 em,h2 em,.big-type em,.sub-intro em){font-family:inherit;font-style:normal;font-weight:inherit;color:var(--accent)}
body:is(.vet,.medical,.craft) .eyebrow{color:var(--muted)}
body:is(.vet,.medical,.craft) .brand{font-family:'DM Sans',sans-serif;letter-spacing:-.035em;font-weight:700}
body:is(.vet,.medical,.craft) :is(.brand-dot,.medical-mark){color:var(--accent)}
body:is(.vet,.medical,.craft) .demo-bar{background:var(--card);color:var(--muted);border-bottom:1px solid var(--line)}
body:is(.vet,.medical,.craft) .header{border-bottom:1px solid var(--line);min-height:108px}
body:is(.hub,.vet,.medical,.craft) .button{background:var(--accent);color:var(--on-accent);border:1px solid transparent;border-radius:10px;font-weight:600}
body:is(.vet,.medical,.craft) .text-link{color:var(--accent);font-size:14px}
body:is(.vet,.medical,.craft) :is(.vet-hero,.medical-hero,.craft-hero){grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(35px,5vw,80px);padding-block:75px 80px;align-items:center}
body:is(.vet,.medical,.craft) :is(.vet-hero,.medical-hero,.craft-hero) h1{font-size:clamp(48px,5.25vw,80px);line-height:1.09;font-weight:500}
body:is(.vet,.medical,.craft) :is(.vet-photo,.medical-photo,.craft-hero figure){padding:0;margin:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--card);align-self:stretch}
body:is(.vet,.medical,.craft) :is(.vet-photo img,.medical-photo img,.craft-hero img){height:560px;border-radius:0}
body:is(.vet,.medical,.craft) :is(.photo-note,.medical-photo>span,.craft-hero figcaption){position:static;display:flex;align-items:center;min-height:80px;background:var(--card);color:var(--ink);padding:20px 24px;border-radius:0;box-shadow:none;font-size:14px}
body:is(.vet,.medical,.craft) .photo-note p{color:var(--muted)}
body:is(.vet,.medical,.craft) .photo-note>span{color:var(--accent);font-size:30px}
body:is(.vet,.medical,.craft) .hero-points span{border-color:var(--accent)}
body:is(.vet,.medical,.craft) :is(.page-card,.service-grid article,.medical-grid article){border:1px solid var(--line);border-radius:16px;background:var(--card);padding:32px}
body:is(.vet,.medical,.craft) :is(.page-card h3,.service-grid h3,.medical-grid h3){font-size:30px;font-weight:500}
body:is(.vet,.medical,.craft) a.page-card:hover{background:var(--surface);transform:translateY(-5px)}
body:is(.vet,.medical,.craft) .medical-grid{gap:24px;background:transparent;border:0}
body:is(.vet,.medical,.craft) .service-icon{background:var(--surface);color:var(--accent)}
body:is(.vet,.medical,.craft) .vet-services{background:transparent}
body:is(.vet,.medical,.craft) :is(.visit,.appointment-feature){background:var(--card);border:1px solid var(--line);border-radius:16px;color:var(--ink)}
body:is(.vet,.medical,.craft) .visit-card{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:12px;transform:none}
body:is(.vet,.medical,.craft) .visit p:not(.eyebrow){color:var(--muted)}
body:is(.vet,.medical,.craft) :is(.notice-panel,.emergency){border:1px solid var(--line);border-radius:16px;background:var(--card)}
body:is(.vet,.medical,.craft) .medical-statement{background:var(--card);border-block:1px solid var(--line);color:var(--ink)}
body:is(.vet,.medical,.craft) .editorial-photo img{border-radius:16px;border:1px solid var(--line)}
body:is(.vet,.medical,.craft) .craft-feature>img{border-radius:16px;border:1px solid var(--line)}
body:is(.vet,.medical,.craft) .project-cards article{padding:24px;gap:40px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
body:is(.vet,.medical,.craft) :is(.project-cards article>img,.detail-crop){border-radius:10px}
body:is(.vet,.medical,.craft) .sub-intro{padding-block:80px 65px}
body:is(.vet,.medical,.craft) .sub-intro h1{font-size:clamp(44px,5.7vw,88px)}
body:is(.vet,.medical,.craft) .craft-cta h2{font-size:clamp(50px,6vw,88px)}
body:is(.hub,.vet,.medical,.craft) dialog{background:var(--paper);color:var(--ink);border-radius:16px}
body:is(.hub,.vet,.medical,.craft) dialog h2{font-size:34px;font-weight:500}
body:is(.hub,.vet,.medical,.craft) .slots input:checked+span{color:var(--on-accent)}
body:is(.hub,.vet,.medical,.craft) .form-error{color:#ffb1aa}
body:is(.vet,.medical,.craft) .whatsapp-contact{background:var(--surface);color:var(--accent);border-color:#ffffff35;box-shadow:0 6px 24px #0004}
body:is(.vet,.medical,.craft) .whatsapp-contact:hover{background:var(--card)}
body:is(.vet,.medical,.craft) .whatsapp-preview{background:var(--surface);color:var(--ink);border-color:#ffffff24}
body:is(.vet,.medical,.craft) .whatsapp-preview p{color:var(--accent)}
body:is(.hub,.vet,.medical,.craft) :focus-visible{outline-color:var(--accent)}
@media(max-width:1000px){body:is(.vet,.medical,.craft) .header{min-height:90px}body:is(.vet,.medical,.craft) .header nav{background:var(--card)}}
@media(max-width:800px){body:is(.vet,.medical,.craft) :is(.vet-hero,.medical-hero,.craft-hero){grid-template-columns:minmax(0,1fr);padding-block:45px 60px;gap:35px}body:is(.vet,.medical,.craft) :is(.vet-hero,.medical-hero,.craft-hero) h1{font-size:clamp(44px,8vw,68px)}body:is(.vet,.medical,.craft) :is(.vet-photo,.medical-photo,.craft-hero figure){width:100%;max-width:none}body:is(.vet,.medical,.craft) :is(.vet-photo img,.medical-photo img,.craft-hero img){height:400px}body:is(.vet,.medical,.craft) .sub-intro{padding-block:45px}body:is(.vet,.medical,.craft) .project-cards article{gap:25px}}
@media(max-width:500px){body:is(.vet,.medical,.craft) :is(.vet-hero,.medical-hero,.craft-hero) h1{font-size:clamp(38px,10.6vw,51px)}body:is(.vet,.medical,.craft) .sub-intro h1{font-size:clamp(35px,9.5vw,46px)}body:is(.vet,.medical,.craft) :is(.vet-photo img,.medical-photo img,.craft-hero img){height:310px}body:is(.vet,.medical,.craft) :is(.page-card,.service-grid article,.medical-grid article){padding:25px}body:is(.vet,.medical,.craft) :is(.page-card h3,.service-grid h3,.medical-grid h3){font-size:27px}body:is(.vet,.medical,.craft) .project-cards article{padding:17px}body:is(.hub,.vet,.medical,.craft) dialog h2{font-size:29px}body:is(.vet,.medical,.craft) :is(.photo-note,.medical-photo>span,.craft-hero figcaption){padding:17px;font-size:12px;min-height:65px}}
