/* ══════════════════════════════════════════════════════
   IRONCLAD RENTALS — Construction Equipment Rental
   Theme: Industrial Editorial · Light · Amber · Charcoal
   Fonts: Antonio (display) · Karla (body)
   Palette: warm concrete · construction amber · coal
   ══════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@400;500;600;700&family=Karla:wght@300;400;500;600;700&display=swap');

:root {
  --coal:    #1b1f1a;
  --coal2:   #2a2f28;
  --coal3:   #3a403a;
  --amber:   #e8a80a;
  --amber2:  #c98a06;
  --amber3:  #f5c840;
  --amber-lo:#fdf4d6;
  --orange:  #d45c18;
  --concrete:#f5f2ec;
  --concrete2:#ede9e0;
  --concrete3:#e0dbd0;
  --stone:   #5a5850;
  --stone2:  #807a70;
  --text:    #201e1c;
  --rule:    rgba(27,31,26,.10);
  --rule2:   rgba(27,31,26,.06);
  --shadow:  0 20px 60px rgba(27,31,26,.14);
  --shadow2: 0 4px 20px rgba(27,31,26,.08);
  --ff-d:    'Antonio', Impact, sans-serif;
  --ff-b:    'Karla', system-ui, sans-serif;
  --max:     1280px;
  --ease:    cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--ff-b);background:var(--concrete);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 48px}

/* diagonal texture */
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
background-image:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='rgba(27,31,26,.025)' stroke-width='1'%3E%3Cline x1='0' y1='40' x2='40' y2='0'/%3E%3C/g%3E%3C/svg%3E");background-size:40px 40px}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:22px 0;transition:all .4s var(--ease)}
.nav.solid{background:rgba(245,242,236,.96);backdrop-filter:blur(18px) saturate(1.3);border-bottom:2px solid var(--amber);box-shadow:0 4px 20px rgba(27,31,26,.09);padding:14px 0}
.nav-inner{display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:12px;font-family:var(--ff-d);font-size:24px;font-weight:700;letter-spacing:.08em;color:var(--concrete);transition:color .3s}
.nav.solid .logo{color:var(--coal)}
.logo-mark{width:40px;height:40px;background:var(--amber);display:flex;align-items:center;justify-content:center;transform:rotate(-3deg);transition:transform .3s var(--ease)}
.logo-mark svg{width:22px;height:22px}
.nav-links{display:flex;align-items:center;gap:36px;list-style:none}
.nav-links a{font-family:var(--ff-d);font-size:15px;letter-spacing:.1em;color:rgba(245,242,236,.75);transition:color .2s}
.nav.solid .nav-links a{color:var(--stone)}
.nav-links a:hover,.nav-links a.active{color:var(--amber)}
.nav.solid .nav-links a:hover{color:var(--amber2)}
.nav-cta{font-family:var(--ff-d);font-size:14px;letter-spacing:.12em;background:var(--amber);color:var(--coal);padding:11px 26px;font-weight:700;transition:all .25s var(--ease)}
.nav-cta:hover{background:var(--amber2);transform:translateY(-2px);box-shadow:0 6px 20px rgba(232,168,10,.4)}
.burger{display:none;background:none;border:1.5px solid rgba(245,242,236,.35);color:var(--concrete);font-size:20px;cursor:pointer;padding:6px 10px}
.nav.solid .burger{border-color:var(--rule);color:var(--coal)}

/* HERO */
.hero{position:relative;height:100vh;min-height:700px;overflow:hidden;display:flex;align-items:flex-end}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;transform:scale(1.05);animation:zoomIn 14s var(--ease) forwards;filter:brightness(.78) contrast(1.05)}
.hero-tint{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(20,22,18,.5) 0%,rgba(20,22,18,.08) 35%,rgba(20,22,18,.75) 75%,rgba(20,22,18,.97) 100%),linear-gradient(to right,rgba(20,22,18,.7) 0%,transparent 55%)}
.hero-stripe{position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(to bottom,var(--amber),var(--amber2))}
.hero-warning{position:absolute;bottom:0;left:0;right:0;height:5px;background:repeating-linear-gradient(90deg,var(--amber) 0px,var(--amber) 24px,var(--coal) 24px,var(--coal) 48px)}
.hero-cut{position:absolute;bottom:-2px;left:0;right:0;height:80px;background:var(--concrete);clip-path:polygon(0 60%,100% 0%,100% 100%,0% 100%)}
.hero-content{position:relative;z-index:2;width:100%;padding-bottom:90px;animation:slideUp .85s var(--ease) .15s both}
.h-tag{display:inline-flex;align-items:center;gap:12px;font-family:var(--ff-d);font-size:12px;letter-spacing:.22em;color:var(--amber);margin-bottom:18px}
.h-tag::before{content:'■';font-size:8px}
.hero-h1{font-family:var(--ff-d);font-weight:700;font-size:clamp(54px,9vw,130px);line-height:.95;letter-spacing:.01em;color:var(--concrete);max-width:900px;margin-bottom:24px}
.hero-h1 .amber{color:var(--amber)}
.hero-desc{font-size:18px;color:rgba(245,242,236,.7);font-weight:300;max-width:520px;line-height:1.7;margin-bottom:40px}
.hero-acts{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--ff-d);font-size:16px;letter-spacing:.1em;padding:15px 32px;cursor:pointer;border:0;transition:all .25s var(--ease)}
.btn-amber{background:var(--amber);color:var(--coal);font-weight:700}
.btn-amber:hover{background:var(--amber2);transform:translateY(-2px);box-shadow:0 8px 28px rgba(232,168,10,.45)}
.btn-coal{background:var(--coal);color:var(--concrete)}
.btn-coal:hover{background:var(--coal2);transform:translateY(-2px)}
.btn-ghost-w{background:transparent;color:var(--concrete);border:2px solid rgba(245,242,236,.4)}
.btn-ghost-w:hover{border-color:var(--amber);color:var(--amber)}
.btn-outline{background:transparent;color:var(--coal);border:2px solid var(--coal)}
.btn-outline:hover{background:var(--coal);color:var(--concrete)}
.hero-stats{display:flex;gap:0;margin-top:48px;padding-top:32px;border-top:1px solid rgba(245,242,236,.12);flex-wrap:wrap}
.hstat{padding-right:36px;margin-right:36px;border-right:1px solid rgba(245,242,236,.12)}
.hstat:last-child{border-right:0}
.hstat-n{font-family:var(--ff-d);font-size:46px;color:var(--amber);line-height:1}
.hstat-l{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,242,236,.4);margin-top:4px}

/* QUOTE BAR */
.qbar{background:var(--coal);border-bottom:3px solid var(--amber);position:relative;z-index:10}
.qbar-inner{display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:stretch;min-height:74px}
.qf{padding:15px 26px;border-right:1px solid rgba(245,242,236,.1);display:flex;flex-direction:column;justify-content:center}
.qf-label{font-family:var(--ff-d);font-size:10px;letter-spacing:.2em;color:rgba(245,242,236,.35);margin-bottom:4px}
.qf select,.qf input{background:none;border:0;outline:none;font-family:var(--ff-b);font-size:15px;font-weight:600;color:var(--concrete);cursor:pointer;width:100%}
.qf select option{color:var(--text)}
.qf-btn{background:var(--amber);color:var(--coal);font-family:var(--ff-d);font-size:16px;letter-spacing:.12em;padding:0 40px;border:0;cursor:pointer;white-space:nowrap;font-weight:700;transition:background .25s}
.qf-btn:hover{background:var(--amber2)}

/* TICKER */
.tick{background:var(--concrete2);border-bottom:1px solid var(--rule2);overflow:hidden}
.tick-inner{display:flex;white-space:nowrap;animation:ticker 32s linear infinite}
.tick-item{flex-shrink:0;padding:13px 44px;font-family:var(--ff-d);font-size:14px;letter-spacing:.1em;color:var(--stone2);display:inline-flex;align-items:center;gap:18px}
.tick-item.hi{color:var(--amber2)}
.td{color:var(--amber);font-size:7px}

/* SECTION */
.sec{padding:110px 0;position:relative}
.tag{display:inline-flex;align-items:center;gap:10px;font-family:var(--ff-d);font-size:12px;letter-spacing:.2em;color:var(--amber2);margin-bottom:14px}
.tag::before{content:'';width:22px;height:3px;background:var(--amber)}
.sec-h{font-family:var(--ff-d);font-weight:700;font-size:clamp(40px,5.5vw,76px);line-height:.95;letter-spacing:.02em;color:var(--coal)}
.sec-h .a{color:var(--amber2)}
.sec-sub{font-size:17px;color:var(--stone);line-height:1.78;max-width:540px}

/* FEATURES */
.feat-bg{background:var(--concrete2)}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:60px}
.fc{background:var(--concrete);padding:42px 36px;position:relative;border-top:3px solid transparent;transition:border-color .3s,transform .3s var(--ease),box-shadow .3s}
.fc:hover{border-top-color:var(--amber);transform:translateY(-5px);box-shadow:var(--shadow)}
.fc-icon{width:56px;height:56px;background:var(--amber-lo);border:1.5px solid rgba(232,168,10,.25);display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.fc-icon svg{width:28px;height:28px;color:var(--amber2)}
.fc-n{font-family:var(--ff-d);font-size:11px;letter-spacing:.2em;color:var(--amber2);margin-bottom:12px;display:block}
.fc h3{font-family:var(--ff-d);font-size:24px;letter-spacing:.04em;color:var(--coal);margin-bottom:10px}
.fc p{font-size:14px;color:var(--stone);line-height:1.75}

/* EQUIPMENT CARDS */
.eq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px}
.eq{background:var(--concrete);border:1px solid var(--rule2);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s}
.eq:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.eq-img{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--concrete2)}
.eq-img svg,.eq-img img{width:100%;height:100%}
.eq-img img{object-fit:cover;transition:transform .6s var(--ease)}
.eq:hover .eq-img img{transform:scale(1.06)}
.eq-badge{position:absolute;top:14px;left:14px;background:var(--amber);color:var(--coal);font-family:var(--ff-d);font-size:11px;letter-spacing:.12em;padding:5px 14px;font-weight:700}
.eq-body{padding:26px}
.eq-cat{font-family:var(--ff-d);font-size:11px;letter-spacing:.14em;color:var(--amber2);margin-bottom:6px}
.eq-body h3{font-family:var(--ff-d);font-size:26px;letter-spacing:.04em;color:var(--coal);margin-bottom:8px}
.eq-body p{font-size:14px;color:var(--stone);line-height:1.65;margin-bottom:16px}
.eq-specs{display:flex;gap:14px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--rule2);border-bottom:1px solid var(--rule2);margin-bottom:18px}
.eq-spec{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--coal)}
.eq-spec svg{width:13px;height:13px;color:var(--amber2);flex-shrink:0}
.eq-pr{display:flex;justify-content:space-between;align-items:center}
.eq-price{font-family:var(--ff-d);font-size:28px;color:var(--coal)}
.eq-price small{font-size:14px;color:var(--stone)}

/* SPLIT */
.split{display:grid;grid-template-columns:1fr 1fr}
.split-img{position:relative;overflow:hidden;min-height:560px}
.split-img img{width:100%;height:100%;object-fit:cover;filter:brightness(.82)}
.split-badge{position:absolute;top:32px;left:32px;background:var(--amber);color:var(--coal);font-family:var(--ff-d);font-size:13px;letter-spacing:.14em;padding:10px 18px;font-weight:700}
.split-img::after{content:'';position:absolute;top:0;right:-2px;bottom:0;width:70px;background:var(--concrete);clip-path:polygon(100% 0%,100% 100%,0% 100%)}
.split-text{background:var(--concrete);padding:72px 68px 72px 72px;display:flex;flex-direction:column;justify-content:center}
.split-text p{font-size:16px;color:var(--stone);line-height:1.82;margin-bottom:18px}
.pq{font-family:var(--ff-d);font-size:22px;letter-spacing:.03em;color:var(--coal);padding:20px 0 20px 22px;border-left:4px solid var(--amber);margin:28px 0;line-height:1.35}
.pq .a{color:var(--amber2)}
.nums{display:flex;gap:32px;margin-top:32px;padding-top:28px;border-top:1px solid var(--rule2)}
.num .n{font-family:var(--ff-d);font-size:46px;color:var(--amber);line-height:1;letter-spacing:.02em}
.num .l{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--stone2);margin-top:4px}

/* PROJECTS */
.proj-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:56px}
.proj{position:relative;overflow:hidden;aspect-ratio:16/10;cursor:pointer}
.proj.tall{aspect-ratio:unset;grid-row:span 2}
.proj img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease),filter .4s;filter:saturate(.8) brightness(.85)}
.proj:hover img{transform:scale(1.06);filter:saturate(1) brightness(.9)}
.proj-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,22,18,.92) 0%,rgba(20,22,18,.3) 55%,transparent 100%)}
.proj-body{position:absolute;bottom:0;left:0;right:0;padding:28px}
.proj-cat{font-family:var(--ff-d);font-size:11px;letter-spacing:.18em;color:var(--amber3);margin-bottom:8px}
.proj-body h3{font-family:var(--ff-d);font-size:26px;letter-spacing:.03em;color:var(--concrete);margin-bottom:6px}
.proj-body p{font-size:13px;color:rgba(245,242,236,.65)}
.proj-num{position:absolute;top:20px;right:24px;font-family:var(--ff-d);font-size:56px;color:rgba(245,242,236,.08);line-height:1}

/* TESTIMONIALS */
.testi-bg{background:var(--coal)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:60px}
.tc{background:rgba(245,242,236,.05);padding:42px 36px;border:1px solid rgba(245,242,236,.07);position:relative;transition:background .3s}
.tc:hover{background:rgba(245,242,236,.08)}
.tc::before{content:'"';position:absolute;top:16px;left:28px;font-family:var(--ff-d);font-size:72px;color:var(--amber);opacity:.25;line-height:1}
.tc-stars{display:flex;gap:3px;margin-bottom:20px}
.tc-stars span{color:var(--amber);font-size:14px}
.tc-q{font-size:15px;color:rgba(245,242,236,.8);line-height:1.72;margin-bottom:28px;font-weight:300;font-style:italic}
.tc-name{font-family:var(--ff-d);font-size:17px;letter-spacing:.06em;color:var(--concrete)}
.tc-co{font-family:var(--ff-d);font-size:11px;letter-spacing:.12em;color:var(--amber);margin-top:4px}

/* CTA BAND */
.cta-band{position:relative;overflow:hidden;background:var(--amber);padding:80px 0}
.cta-band::before,.cta-band::after{content:'';position:absolute;left:0;right:0;height:8px;background:repeating-linear-gradient(90deg,var(--coal) 0px,var(--coal) 24px,var(--amber2) 24px,var(--amber2) 48px)}
.cta-band::before{top:0}
.cta-band::after{bottom:0}
.cta-band .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto;gap:64px;align-items:center}
.cta-band h2{font-family:var(--ff-d);font-size:clamp(38px,5vw,70px);letter-spacing:.02em;color:var(--coal);line-height:.95}
.cta-band p{font-size:17px;color:rgba(27,31,26,.65);margin-top:14px;line-height:1.7}
.cta-form{display:flex;flex-direction:column;gap:12px;min-width:340px}
.cta-inp{padding:16px 20px;background:var(--coal);border:0;font-family:var(--ff-b);font-size:15px;color:var(--concrete);outline:none}
.cta-inp::placeholder{color:rgba(245,242,236,.4)}
.cta-inp:focus{background:var(--coal2)}
.cta-go{padding:16px 24px;background:var(--coal);color:var(--amber);font-family:var(--ff-d);font-size:16px;letter-spacing:.12em;border:0;cursor:pointer;font-weight:700;transition:background .25s}
.cta-go:hover{background:var(--coal2)}

/* FOOTER */
footer{background:var(--coal2);color:var(--concrete);padding:80px 0 36px;border-top:3px solid var(--amber)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:56px}
.foot-logo{font-family:var(--ff-d);font-size:26px;letter-spacing:.1em;color:var(--concrete);margin-bottom:14px}
.foot-logo span{color:var(--amber)}
.foot-desc{font-size:14px;color:rgba(245,242,236,.45);line-height:1.75;max-width:270px}
.foot-socials{display:flex;gap:10px;margin-top:20px}
.soc{width:38px;height:38px;background:rgba(245,242,236,.08);border:1px solid rgba(245,242,236,.12);display:flex;align-items:center;justify-content:center;color:rgba(245,242,236,.5);transition:all .2s}
.soc:hover{background:var(--amber);border-color:var(--amber);color:var(--coal)}
.soc svg{width:15px;height:15px}
.foot-h{font-family:var(--ff-d);font-size:12px;letter-spacing:.2em;color:var(--amber);margin-bottom:16px}
.foot-links{list-style:none}
.foot-links li{margin-bottom:10px}
.foot-links a{font-size:14px;color:rgba(245,242,236,.45);transition:color .2s}
.foot-links a:hover{color:var(--amber)}
.foot-links li:not(:has(a)){font-size:14px;color:rgba(245,242,236,.4)}
.foot-bottom{border-top:1px solid rgba(245,242,236,.08);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:13px;color:rgba(245,242,236,.3)}
.foot-bottom a{color:rgba(245,242,236,.3);transition:color .2s}
.foot-bottom a:hover{color:var(--amber)}

/* PAGE HEADER */
.ph{padding:150px 0 80px;background:var(--coal);position:relative;overflow:hidden;border-bottom:4px solid var(--amber)}
.ph::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='rgba(232,168,10,.06)' stroke-width='1'%3E%3Cline x1='0' y1='0' x2='60' y2='60'/%3E%3Cline x1='60' y1='0' x2='0' y2='60'/%3E%3C/g%3E%3C/svg%3E");background-size:60px 60px}
.ph .wrap{position:relative;z-index:1}
.ph-tag{font-family:var(--ff-d);font-size:12px;letter-spacing:.22em;color:var(--amber);margin-bottom:16px;display:flex;align-items:center;gap:10px}
.ph-tag::before{content:'■';font-size:8px}
.ph h1{font-family:var(--ff-d);font-size:clamp(46px,7vw,90px);color:var(--concrete);margin-bottom:18px;line-height:.95;letter-spacing:.02em}
.ph .lead{font-size:18px;color:rgba(245,242,236,.6);max-width:520px;line-height:1.7}

/* FORM */
.form-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:start}
.fg{margin-bottom:20px}
.fg label{display:block;font-family:var(--ff-d);font-size:12px;letter-spacing:.16em;color:var(--coal);margin-bottom:8px}
.fg input,.fg select,.fg textarea{width:100%;padding:13px 16px;background:var(--concrete2);border:2px solid var(--rule);font-family:var(--ff-b);font-size:15px;color:var(--text);outline:none;transition:border-color .2s}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--amber)}
.fg textarea{resize:vertical;min-height:120px}
.info-box{margin-bottom:28px}
.info-box h4{font-family:var(--ff-d);font-size:20px;letter-spacing:.06em;color:var(--coal);margin-bottom:6px}
.info-box p,.info-box a{font-size:15px;color:var(--stone)}
.info-box a:hover{color:var(--amber2)}

/* TEAM */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:60px}
.team-card{text-align:center}
.team-portrait{width:150px;height:150px;margin:0 auto 20px;overflow:hidden;border:3px solid var(--concrete2);box-shadow:var(--shadow2)}
.team-portrait svg{width:100%;height:100%}
.team-card h3{font-family:var(--ff-d);font-size:24px;letter-spacing:.06em;color:var(--coal);margin-bottom:4px}
.team-role{font-family:var(--ff-d);font-size:11px;letter-spacing:.16em;color:var(--amber2);margin-bottom:12px}
.team-card p{font-size:14px;color:var(--stone);line-height:1.7;max-width:280px;margin:0 auto}

/* REVEAL */
.rev{opacity:0;transform:translateY(24px);transition:opacity .75s var(--ease),transform .75s var(--ease)}
.rev.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

/* ANIMATIONS */
@keyframes zoomIn{from{transform:scale(1.05)}to{transform:scale(1)}}
@keyframes slideUp{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* RESPONSIVE */
@media(max-width:960px){
  .nav-links{display:none}.burger{display:block}
  .split{grid-template-columns:1fr;grid-template-rows:400px auto}
  .split-img::after{display:none}
  .split-text{padding:48px 36px}
  .feat-grid,.testi-grid,.team-grid{grid-template-columns:1fr 1fr}
  .eq-grid{grid-template-columns:1fr 1fr}
  .proj-grid{grid-template-columns:1fr}
  .proj.tall{aspect-ratio:16/10;grid-row:span 1}
  .cta-band .wrap{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .qbar-inner{grid-template-columns:1fr 1fr;grid-template-rows:auto auto}
  .wrap{padding:0 24px}
  .sec{padding:72px 0}
}
@media(max-width:600px){
  .feat-grid,.testi-grid,.team-grid,.eq-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .hero-h1{font-size:52px}
  .hstat{border-right:0;margin-right:0}
}