/* The Trivial Company — ornamental iron landing page, October 2026 */
.iron-page { background:var(--navy); color:#f5f8f9; }
.iron-page em { font-style:normal; color:var(--gold); }
.iron-container { max-width:var(--max); margin:0 auto; }
.iron-hero { background:radial-gradient(ellipse at 18% 8%,#163348 0%,#07131d 54%,#050d14 100%); }
.iron-hero-inner { max-width:var(--max); margin:0 auto; padding:clamp(32px,5vw,72px) var(--pad) clamp(46px,6vw,88px); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.98fr); gap:clamp(32px,4vw,80px); align-items:center; min-height:590px; }
.iron-breadcrumb { display:flex; flex-wrap:wrap; gap:13px; align-items:center; margin-bottom:clamp(34px,5vw,62px); font-size:11px; letter-spacing:.09em; color:#a6bdc9; }
.iron-breadcrumb a { text-decoration:none; }
.iron-breadcrumb a:hover { color:var(--gold); }
.iron-eyebrow { margin:0 0 16px; font-size:11px; line-height:1.5; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.iron-eyebrow span { margin:0 8px; color:#7f9ba8; }
.iron-hero h1 { margin:0; font-size:clamp(54px,5.7vw,92px); font-weight:900; letter-spacing:-.065em; line-height:.98; max-width:700px; text-wrap:balance; }
.iron-hero-statement { margin:26px 0 0; font-size:clamp(20px,2.25vw,30px); font-weight:700; line-height:1.22; }
.iron-hero-description { max-width:520px; margin:19px 0 0; color:#b7c9d3; line-height:1.7; font-size:16px; }
.iron-actions { margin-top:32px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.iron-hero-visual { margin:0; position:relative; min-width:0; }
.iron-hero-visual:before { content:""; position:absolute; top:-15px; right:-15px; width:38%; height:38%; border-top:2px solid var(--gold); border-right:2px solid var(--gold); pointer-events:none; }
.iron-hero-visual img { width:100%; height:clamp(345px,38vw,525px); object-fit:cover; object-position:center; border:1px solid rgba(255,255,255,.16); }
.iron-hero-visual figcaption { position:absolute; left:0; bottom:0; right:0; display:flex; align-items:center; gap:13px; padding:17px 20px; text-transform:uppercase; font-size:11px; font-weight:800; letter-spacing:.14em; background:linear-gradient(0deg,rgba(2,11,16,.9),rgba(2,11,16,.58)); }
.iron-hero-visual figcaption span:last-child { margin-left:auto; color:var(--gold); }
.iron-caption-mark { color:var(--gold); }
.iron-intro { background:#f0f3f2; color:#092130; padding:clamp(66px,7vw,112px) var(--pad); }
.iron-intro-top { display:grid; grid-template-columns:1.1fr .75fr; gap:clamp(20px,7vw,120px); align-items:end; }
.iron-eyebrow--dark { color:#866600; }
.iron-intro h2,.iron-gallery h2,.iron-contact h2 { margin:0; font-size:clamp(37px,4.3vw,65px); line-height:1.04; font-weight:900; letter-spacing:-.055em; }
.iron-intro h2 em,.iron-contact h2 em { color:#ad870a; }
.iron-intro-top>p { color:#526977; font-size:clamp(16px,1.3vw,18px); line-height:1.7; margin:0; }
.iron-services { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:clamp(34px,5vw,72px); }
.iron-service { border-top:3px solid #b79a24; background:#fff; padding:25px 25px 30px; min-height:206px; box-shadow:0 15px 28px rgba(14,38,53,.07); }
.iron-service>span { color:#8a772c; font-weight:800; font-size:11px; letter-spacing:.12em; }
.iron-service h3 { margin:24px 0 12px; font-size:21px; letter-spacing:-.04em; }
.iron-service p { margin:0; line-height:1.65; font-size:14px; color:#506674; }
.iron-gallery { background:#0a1a26; padding:clamp(64px,7vw,112px) var(--pad); }
.iron-gallery-heading { display:flex; justify-content:space-between; gap:40px; align-items:end; margin-bottom:35px; }
.iron-gallery-heading>p { color:#a9bfcb; line-height:1.7; max-width:330px; font-size:14px; margin:0; }
.iron-work-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; }
.iron-work-card { margin:0; min-width:0; grid-column:span 4; border:1px solid #2c4759; background:#0e2533; }
.iron-work-card--wide { grid-column:span 6; }
.iron-work-card>a { display:block; position:relative; overflow:hidden; text-decoration:none; aspect-ratio:1.22; background:#152c3b; }
.iron-work-card--wide>a { aspect-ratio:1.6; }
.iron-work-card img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.iron-work-card a:hover img,.iron-work-card a:focus-visible img { transform:scale(1.045); }
.iron-zoom { position:absolute; bottom:14px; right:14px; font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; background:#f5c62f; color:#07131d; padding:10px 12px; opacity:0; transform:translateY(6px); transition:all .25s ease; }
.iron-work-card a:hover .iron-zoom,.iron-work-card a:focus-visible .iron-zoom { opacity:1; transform:translateY(0); }
.iron-work-card figcaption { display:flex; align-items:center; gap:15px; padding:18px 20px; font-size:13px; font-weight:700; letter-spacing:.01em; }
.iron-work-card figcaption span { color:#f5c62f; font-size:11px; font-weight:900; }
.iron-contact { background:#e8edef; color:#102d42; padding:clamp(66px,7vw,110px) var(--pad); }
.iron-contact-inner { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:45px; align-items:center; }
.iron-contact h2 { max-width:740px; }
.iron-contact p:not(.iron-eyebrow) { max-width:690px; font-size:16px; line-height:1.7; color:#526b79; }
.iron-contact .iron-scope-note { margin:30px 0 0; font-size:12px!important; color:#667984!important; }
.iron-contact-actions { display:flex; flex-direction:column; align-items:stretch; gap:16px; min-width:225px; }
.iron-contact .button.primary { background:#f5c62f; color:#07131d; border-color:#d8a900; }
.iron-phone { font-size:13px; font-weight:700; text-align:center; text-decoration:none; }
.iron-phone:hover { text-decoration:underline; }
.iron-page a:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
@media(max-width:1000px) { .iron-hero-inner { grid-template-columns:1fr 1fr; gap:30px; } .iron-hero h1 { font-size:clamp(46px,6vw,72px); } }
@media(max-width:760px) { .iron-hero-inner { display:flex; flex-direction:column; align-items:stretch; min-height:auto; padding-top:32px; } .iron-breadcrumb { margin-bottom:35px; } .iron-hero-visual:before { right:0; } .iron-hero-visual img { height:420px; } .iron-intro-top { grid-template-columns:1fr; } .iron-services { grid-template-columns:1fr; } .iron-service { min-height:0; } .iron-gallery-heading { align-items:start; flex-direction:column; gap:16px; } .iron-work-card,.iron-work-card--wide { grid-column:span 6; } .iron-contact-inner { grid-template-columns:1fr; } .iron-contact-actions { align-items:flex-start; } }
@media(max-width:520px) { .iron-hero h1 { font-size:clamp(49px,12vw,63px); } .iron-hero-visual img { height:310px; } .iron-hero-visual:before { display:none; } .iron-work-grid { gap:16px; } .iron-work-card,.iron-work-card--wide { grid-column:span 12; } .iron-work-card>a,.iron-work-card--wide>a { aspect-ratio:1.28; } .iron-zoom { opacity:1; transform:none; } .iron-intro,.iron-gallery,.iron-contact { padding-top:65px; padding-bottom:65px; } .iron-contact-actions { align-items:stretch; } .iron-contact-actions .button { width:100%; } }
@media(prefers-reduced-motion:reduce) { .iron-work-card img,.iron-zoom { transition:none; } }