/* H&H Art Metal: charcoal, warm stone, and the red of the original mark. */
.metal-studio{--ink:#202323;--muted:#686d6b;--line:#bdc3c3;--accent:#ba2b30;background:#cdd1d2;color:var(--ink);font-family:Arial,Helvetica,sans-serif}
.metal-studio h1,.metal-studio h2{display:block;width:auto;white-space:normal;letter-spacing:-.045em;justify-content:initial}
.metal-studio a{color:inherit}.metal-studio section{display:block;padding:0;overflow:visible;isolation:auto}
.metal-header{max-width:1320px;margin:auto;display:flex;align-items:center;gap:36px;padding:20px 48px;border-bottom:1px solid var(--line)}
.metal-identity{display:flex;align-items:center;gap:15px;text-decoration:none;flex-shrink:0}.metal-identity img{width:62px;height:62px;object-fit:contain;mix-blend-mode:multiply}.metal-identity>span{font-size:24px;font-weight:700;letter-spacing:-.06em}.metal-identity small{display:block;font-size:9px;font-weight:500;letter-spacing:.38em;margin-top:5px}
.metal-menu{display:flex;align-items:center;gap:26px;margin-left:auto}.metal-menu a{font-size:13px;font-weight:500;text-decoration:none;padding:12px 0;white-space:nowrap}.metal-menu a:hover{color:var(--accent)}.metal-menu a[aria-current=page]{box-shadow:0 2px 0 var(--accent)}
.metal-header .languages{position:static;transform:none;flex-shrink:0;background:transparent;border:1px solid var(--line);border-radius:6px;gap:0;padding:3px}.metal-header .languages button{min-width:34px;min-height:32px;font-size:11px;border-radius:3px}.metal-header .languages button[aria-pressed=true]{background:var(--ink)}
.studio-main{display:block;min-height:0;max-width:1320px;margin:auto;padding:32px 48px 72px}
.metal-studio .eyebrow{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1.5;margin:0 0 22px;color:var(--accent)}
.metal-hero{min-height:480px;position:relative;display:flex;align-items:center;overflow:hidden;background:#171c1f;border-radius:5px;color:#fff;isolation:isolate}
.metal-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 52%;z-index:-2}.metal-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#11191af5 0%,#11191ac4 38%,#11191a15 100%);z-index:-1}
.metal-hero-copy{padding:64px;max-width:690px}.metal-hero .eyebrow{color:#dedfdb}.metal-hero h1{font-size:clamp(44px,5.5vw,78px);font-weight:400;line-height:1.04;text-wrap:balance;margin:0 0 24px}.metal-hero-copy>p:not(.eyebrow){color:#c9cfca;max-width:320px;line-height:1.7;font-size:16px}.metal-hero a{display:inline-block;margin-top:22px;text-decoration:none;font-size:13px;border-bottom:1px solid #ce4446;padding:0 0 9px}.hero-caption{position:absolute;right:26px;bottom:23px;letter-spacing:-.04em;font-size:19px}.hero-caption span{display:block;text-align:right;letter-spacing:.28em;font-size:9px;margin-top:4px;color:#c5cbc6}
.metal-studio .studio-about{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:72px 0 42px;scroll-margin-top:24px}.studio-about h2,.studio-references h2{font-size:clamp(28px,3vw,39px);line-height:1.15;font-weight:400;text-wrap:balance;max-width:430px}.about-copy{font-size:17px;line-height:1.9;color:var(--muted);margin:34px 0 0}
.process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.process-step{padding:30px 28px 30px 0}.process-step+.process-step{padding-left:28px;border-left:1px solid var(--line)}.step-index{color:var(--accent);font-size:11px;letter-spacing:.12em}.process-step h3{font-size:22px;font-weight:400;margin:24px 0 12px;letter-spacing:-.02em}.process-step p{color:var(--muted);font-size:14px;line-height:1.7;margin:0;max-width:260px}
.metal-studio .studio-references{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:54px 0 0}.studio-references>p{font-size:15px;line-height:1.8;color:var(--muted);align-self:end;max-width:360px;margin:0}
.contact-heading{display:grid;grid-template-columns:1fr 260px;gap:40px;align-items:center;padding:18px 0 40px}.contact-heading h1{font-size:clamp(36px,4.5vw,62px);font-weight:400;line-height:1.08;max-width:740px;text-wrap:balance;margin:0}.contact-heading .lead{font-size:16px;line-height:1.8;color:var(--muted);max-width:570px;margin:22px 0 0}.contact-art{background:linear-gradient(120deg,#161e21c9,#161e2140),url('laser-cutting.jpg') center/cover;min-height:206px;align-self:stretch;border-radius:4px;display:flex;flex-direction:column;justify-content:flex-end;color:white;padding:24px}.contact-art>span{font-size:30px;letter-spacing:-.045em}.contact-art>small{font-size:9px;letter-spacing:.18em;margin-top:8px;color:#e0e3df}
.contact-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);gap:44px;align-items:start}.contact-details>h2{font-size:13px;font-weight:600;letter-spacing:0;margin:0 0 18px}.metal-studio .whatsapp-contact{margin:0 0 16px;display:grid;width:100%;grid-template-columns:36px minmax(0,1fr);background:#203c31;border-radius:8px;padding:23px 25px;color:#fff;box-shadow:none;column-gap:18px}.metal-studio .whatsapp-contact:hover{background:#2d503e}.whatsapp-contact>[data-page-copy]{font-size:16px}.metal-studio .contact-number{font-size:14px;letter-spacing:.06em}.metal-studio .whatsapp-contact .contact-icon{height:32px;width:32px}
.detail-card{padding:22px 24px;border:1px solid var(--line);border-radius:8px;background:#f8f8f4;margin-bottom:16px}.detail-label{margin:0 0 13px;color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.metal-studio .email-contact{padding:0;margin:0;font-size:17px;gap:12px}.metal-studio .email-contact svg{width:22px;height:22px;color:#797f79}.address-card address{font-size:16px;line-height:1.8;font-style:normal}.metal-studio .map-link{margin-top:16px;padding:8px 0;border:0;border-radius:0;background:transparent;gap:9px;font-size:13px;text-decoration:underline;text-underline-offset:5px}.metal-studio .map-link:hover{color:var(--accent)}.metal-studio .map-link .contact-icon{width:19px;height:19px;color:var(--muted)}
.metal-studio .form-panel{background:#fff;border:1px solid #e0e2dc;border-radius:10px;padding:34px 36px;box-shadow:0 15px 40px #27332a06;border-top:3px solid var(--accent)}.form-heading{display:flex;justify-content:space-between;gap:20px;align-items:start}.form-heading h2{font-size:25px;font-weight:400;line-height:1.2;margin:0;letter-spacing:-.035em}.form-heading p{font-size:14px;color:var(--muted);line-height:1.6;margin:10px 0 0}.form-heading>svg{width:32px;height:32px;flex-shrink:0;color:#a8ada7}.metal-studio .message-form{max-width:none;margin-top:30px;gap:20px}.metal-studio .message-form label{font-size:12px;font-weight:600;letter-spacing:.015em;gap:9px}.metal-studio .message-form input,.metal-studio .message-form textarea{border-radius:5px;border:1px solid #dfe2db;background:#fafaf7;padding:14px;color:var(--ink);font:400 16px/1.5 Arial,Helvetica,sans-serif}.metal-studio .message-form textarea{min-height:140px}.metal-studio .message-form button{justify-self:stretch;border-radius:5px;background:#242b29;padding:16px;font-size:14px}.metal-studio .message-form button:hover:not(:disabled){background:var(--accent)}.metal-studio .message-form #form-status{margin:0;font-size:13px;line-height:1.6}.metal-studio .message-form #form-status:empty{display:none}.metal-studio .message-form :focus-visible{outline-color:var(--accent)}
.metal-footer{max-width:1224px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding:25px 0 35px;color:var(--muted);font-size:12px}.metal-footer a{text-decoration:none}
@media(min-width:1450px){.metal-header{padding-block:25px}.studio-main{padding-top:40px}}
@media(max-width:1000px){.metal-header{gap:22px;padding:18px 28px}.metal-menu{gap:18px}.metal-identity>span{display:none}.studio-main{padding:28px 28px 56px}.metal-hero-copy{padding:44px}.metal-hero{min-height:430px}.contact-heading{grid-template-columns:1fr 200px;gap:28px}.contact-layout{gap:25px}.metal-studio .form-panel{padding:28px}.metal-footer{margin-inline:28px}.metal-studio .studio-about,.metal-studio .studio-references{gap:35px}.detail-card,.metal-studio .whatsapp-contact{padding:22px 20px}}
@media(max-width:700px){.metal-header{flex-wrap:wrap;gap:12px;padding:12px 22px 0}.metal-identity img{width:52px;height:52px}.metal-identity>span{display:block;font-size:21px}.metal-identity small{font-size:8px}.metal-header .languages{margin-left:auto}.metal-menu{order:3;width:100%;margin:0;gap:24px;overflow-x:auto}.metal-menu a{font-size:12px;padding:13px 0}.studio-main{padding:22px 22px 42px}.metal-hero{min-height:440px}.metal-hero-copy{padding:34px 26px}.metal-hero h1{font-size:50px;max-width:340px}.metal-hero:after{background:linear-gradient(90deg,#11191ae6,#11191a65)}.metal-hero-copy>p:not(.eyebrow){font-size:15px;max-width:240px}.hero-caption{font-size:15px;right:20px;bottom:18px}.metal-studio .eyebrow{font-size:10px;margin-bottom:16px}.metal-studio .studio-about,.metal-studio .studio-references{grid-template-columns:1fr;gap:18px;padding-top:40px}.about-copy{margin:0;font-size:16px}.studio-about h2,.studio-references h2{font-size:31px}.process-grid{grid-template-columns:1fr}.process-step,.process-step+.process-step{padding:24px 0;border-left:0;display:grid;grid-template-columns:28px 1fr;column-gap:14px}.process-step+.process-step{border-top:1px solid var(--line)}.step-index{padding-top:4px}.process-step h3{margin:0 0 8px;font-size:20px}.process-step p{grid-column:2;max-width:none}.contact-heading{grid-template-columns:1fr;padding:10px 0 30px}.contact-heading h1{font-size:41px;max-width:520px}.contact-heading .lead{font-size:15px;margin-top:18px}.contact-art{display:none}.contact-layout{grid-template-columns:1fr;gap:22px}.contact-details{display:grid;grid-template-columns:1fr;gap:12px}.contact-details>h2{margin:0 0 3px}.detail-card,.metal-studio .whatsapp-contact{margin-bottom:0}.metal-studio .form-panel{padding:27px 22px}.form-heading h2{font-size:25px}.metal-footer{margin-inline:22px;flex-wrap:wrap;font-size:11px}}
@media(prefers-reduced-motion:no-preference){.metal-studio a,.metal-studio button{transition:background-color .18s,color .18s}.metal-studio{scroll-behavior:smooth}}

/* One shared, transparent brand mark across H&H headers. */
.metal-studio .metal-identity .contact-registered-logo{display:block;position:relative;line-height:1;font-size:inherit;letter-spacing:normal}
.metal-studio .metal-identity .contact-registered-logo img{width:110px;height:110px;mix-blend-mode:normal;background:transparent;display:block}
.metal-studio .registered-mark{position:absolute;top:1px;right:-7px;font:500 16px/1 Arial,Helvetica,sans-serif;color:#202323}
.metal-studio .contact-heading{grid-template-columns:1fr}
@media(max-width:700px){.metal-studio .metal-identity .contact-registered-logo img{width:88px;height:88px}.metal-studio .registered-mark{font-size:14px;right:-6px}}

/* Soft brand-color atmosphere across every H&H subpage, without logo artwork. */
body.metal-studio{
 background-color:#cdd1d2;
 background-image:radial-gradient(ellipse at 6% 8%,rgba(186,43,48,.28),transparent 48%),radial-gradient(ellipse at 92% 18%,rgba(25,29,31,.24),transparent 52%),radial-gradient(ellipse at 42% 54%,rgba(186,43,48,.16),transparent 55%),radial-gradient(ellipse at 8% 84%,rgba(25,29,31,.21),transparent 48%),radial-gradient(ellipse at 92% 100%,rgba(186,43,48,.27),transparent 48%);
 background-repeat:no-repeat;
}

@media(min-width:701px) and (max-width:1100px){.metal-header{flex-wrap:wrap;gap:12px}.metal-header .display-controls{margin-left:auto}.metal-menu{order:3;width:100%;margin:0;justify-content:flex-start;gap:26px;overflow-x:auto}}
