:root {
  --ink: #111315;
  --ink-2: #1a1d20;
  --paper: #f3f1eb;
  --muted: #9ba0a5;
  --line: rgba(17,19,21,.14);
  --orange: #ff5a1f;
  --orange-dark: #d73e08;
  --white: #fff;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Inter, Arial, sans-serif; font-size: 16px; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
.site-header { height: 86px; padding: 0 clamp(22px, 5vw, 76px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; background: rgba(243,241,235,.94); backdrop-filter: blur(14px); }
.brand { display: inline-flex; align-items: center; gap: 11px; font-family: "Barlow Condensed", sans-serif; font-size: 1.55rem; font-weight: 700; letter-spacing: .02em; line-height: .8; }
.brand strong { color: var(--orange); }
.brand small { display: block; font: 600 .61rem/1 Inter, sans-serif; letter-spacing: .18em; text-transform: uppercase; margin-top: 6px; color: #6b7074; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; background: var(--orange); color: var(--white); font-weight: 800; transform: skew(-7deg); }
nav { display: flex; align-items: center; gap: 32px; font-size: .88rem; font-weight: 600; }
nav a { border-bottom: 1px solid transparent; }
nav a:hover { border-color: var(--orange); }
.header-cta { background: var(--ink); color: var(--white); padding: 12px 19px; font-size: .85rem; font-weight: 700; }
.hero { min-height: 680px; display: grid; grid-template-columns: 1.02fr .98fr; padding: clamp(60px,8vw,120px) clamp(22px,5vw,76px) 68px; overflow: hidden; }
.hero-copy { align-self: center; max-width: 760px; position: relative; z-index: 2; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 25px; font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow span { width: 28px; height: 3px; background: var(--orange); }
h1,h2 { font-family: "Barlow Condensed", Impact, sans-serif; letter-spacing: -.035em; line-height: .87; margin: 0; text-transform: uppercase; }
h1 { font-size: clamp(4.7rem, 8.1vw, 8.4rem); }
h1 em,h2 em { color: var(--orange); font-style: normal; }
.hero-lead { max-width: 620px; margin: 33px 0; font-size: clamp(1rem,1.3vw,1.18rem); color: #4f5559; }
.hero-actions { display: flex; align-items: center; gap: 28px; }
.button { display: inline-flex; align-items: center; justify-content: space-between; min-width: 210px; padding: 15px 18px; font-weight: 700; }
.button-primary { background: var(--orange); color: var(--white); }
.button-primary:hover { background: var(--orange-dark); }
.text-link { font-weight: 700; }
.text-link span { color: var(--orange); margin-left: 6px; }
.hero-visual { position: relative; min-height: 480px; align-self: center; }
.rock-photo { position:absolute; inset:5% -18% 0 2%; width:116%; height:95%; object-fit:cover; object-position:57% center; clip-path:polygon(19% 3%,100% 0,94% 100%,0 91%); filter:saturate(.72) contrast(1.04); box-shadow:0 36px 80px rgba(0,0,0,.28); }
.product-card { width:180px; min-height:205px; position:absolute; left:9%; bottom:1%; z-index:2; padding:20px; color:white; background:var(--orange); box-shadow:0 25px 45px rgba(0,0,0,.32); display:flex; flex-direction:column; justify-content:space-between; }
.product-top { font:700 .68rem/1 Inter; letter-spacing:.12em; }
.product-center { display:flex; align-items:flex-end; line-height:.8; }.product-center strong { font:800 5.6rem/.75 "Barlow Condensed"; }.product-center span { font-weight:700; margin-left:5px; }
.product-bottom { font-size:.62rem; font-weight:700; letter-spacing:.08em; line-height:1.4; }
.metric { position:absolute; z-index:3; padding:15px 18px; background:var(--paper); border-left:4px solid var(--orange); box-shadow:0 14px 30px rgba(0,0,0,.18); }
.metric strong,.metric span { display:block; }.metric strong { font:800 2rem/1 "Barlow Condensed"; }.metric span { font-size:.72rem; color:#555; margin-top:5px; }
.metric-a { right:-2%; top:13%; }.metric-b { right:8%; bottom:7%; }
.proof-strip { display:grid; grid-template-columns:repeat(4,1fr); margin:0 clamp(22px,5vw,76px); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.proof-strip div { position:relative; padding:27px 20px 27px 44px; border-right:1px solid var(--line); }.proof-strip div:last-child { border-right:0; }
.proof-strip span { position:absolute; left:0; top:28px; color:var(--orange); font:700 .75rem/1 Inter; }
.proof-strip strong,.proof-strip small { display:block; }.proof-strip strong { font-size:.9rem; }.proof-strip small { color:#71767a; margin-top:4px; }
.section { padding:clamp(88px,10vw,150px) clamp(22px,7vw,110px); }
.process { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(55px,8vw,130px); }
.section-heading h2,.calc-copy h2,.contact h2,.app-intro h2 { font-size:clamp(3.4rem,6vw,6.1rem); }
.section-heading>p:last-child,.calc-copy>p { max-width:520px; color:#62676b; margin-top:27px; }
.steps { list-style:none; padding:0; margin:0; }
.steps li { display:grid; grid-template-columns:65px 1fr; gap:20px; padding:25px 0; border-top:1px solid var(--line); }
.steps li:last-child { border-bottom:1px solid var(--line); }
.steps>li>span { color:var(--orange); font:700 .8rem/1 Inter; padding-top:6px; }
.steps strong { font:700 1.7rem/1 "Barlow Condensed"; text-transform:uppercase; }.steps p { margin:8px 0 0; color:#666c70; }
.applications { background:var(--ink); color:var(--white); padding:clamp(80px,9vw,135px) clamp(22px,7vw,110px); }
.eyebrow.light { color:#c3c7c9; }.app-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; }.app-intro .eyebrow { align-self:flex-start; }
.app-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#3a3e41; margin-top:70px; border:1px solid #3a3e41; }
.app-grid article { background:var(--ink-2); padding:38px 34px; min-height:260px; display:flex; flex-direction:column; justify-content:flex-end; transition:.25s ease; }.app-grid article:hover { background:#22262a; transform:translateY(-4px); }
.app-grid article>span { color:var(--orange); font-size:.68rem; font-weight:700; letter-spacing:.15em; margin-bottom:auto; }.app-grid h3 { font:700 2rem/1 "Barlow Condensed"; text-transform:uppercase; margin:35px 0 14px; }.app-grid p { color:#aeb3b6; margin:0; }
.calculator { display:grid; grid-template-columns:1fr .85fr; gap:clamp(50px,9vw,130px); align-items:center; }
.tech-note { display:flex; justify-content:space-between; gap:25px; max-width:530px; margin-top:35px; padding:17px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.tech-note span { color:#666c70; text-align:right; }
.calc-panel { background:white; padding:clamp(28px,4vw,48px); box-shadow:0 25px 65px rgba(17,19,21,.1); border-top:5px solid var(--orange); }
.calc-panel>label { display:block; font-weight:700; margin-bottom:13px; }.input-row { display:grid; grid-template-columns:56px 1fr 56px; border:1px solid #d8d8d5; }
.input-row input { width:100%; min-width:0; border:0; border-left:1px solid #d8d8d5; border-right:1px solid #d8d8d5; text-align:center; font:800 2rem/1 "Barlow Condensed"; background:white; color:var(--ink); }.input-row button { border:0; background:#f2f1ed; font-size:1.4rem; cursor:pointer; }.input-row button:hover { background:#e8e6e0; }
.result { margin-top:32px; background:var(--ink); color:white; padding:28px; }.result>span { color:#aeb3b6; font-size:.75rem; text-transform:uppercase; letter-spacing:.12em; }.result strong { display:block; margin-top:9px; color:var(--orange); }.result strong b { font:800 4.8rem/.85 "Barlow Condensed"; }.result strong small { font:700 1.8rem/1 "Barlow Condensed"; }.result p { margin:16px 0 0; color:#c7cacc; }
.disclaimer { font-size:.75rem; color:#777d80; line-height:1.5; margin:16px 0 0; }
.contact { background:var(--orange); color:white; padding:clamp(70px,9vw,120px) clamp(22px,7vw,110px); display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(50px,9vw,140px); align-items:end; }
.contact .eyebrow span { background:var(--ink); }.contact .eyebrow.light { color:white; }.contact-copy>p { font-size:1.1rem; max-width:520px; }
.contact-button { display:flex; align-items:center; justify-content:space-between; width:min(100%,390px); margin-top:28px; padding:17px 19px; background:var(--ink); color:white; font-weight:700; }.contact-button:hover { background:#25282b; }
.contact-person { border-top:1px solid rgba(255,255,255,.5); margin-top:30px; padding-top:20px; }.contact-person span,.contact-person strong,.contact-person small { display:block; }.contact-person span { font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; }.contact-person strong { font-size:1.1rem; margin-top:7px; }.contact-person small { color:#ffe0d4; }
footer { padding:35px clamp(22px,5vw,76px); display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:30px; background:#090a0b; color:#8f9598; font-size:.78rem; }.footer-brand { color:white; }.footer-brand .brand-mark { width:32px; height:32px; }.footer-brand small { color:#777d80; }
@media (max-width: 900px) {
  nav { display:none; }.hero { grid-template-columns:1fr; padding-top:75px; }.hero-visual { min-height:430px; margin-top:35px; }.proof-strip { grid-template-columns:1fr 1fr; }.proof-strip div:nth-child(2) { border-right:0; }.proof-strip div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .process,.calculator,.contact { grid-template-columns:1fr; }.app-intro { display:block; }.app-grid { grid-template-columns:1fr; }.app-grid article { min-height:210px; }
}
@media (max-width: 600px) {
  .site-header { height:72px; }.header-cta { display:none; }.hero { min-height:0; }.hero-lead { margin:25px 0; }.hero-actions { align-items:flex-start; flex-direction:column; gap:20px; }.hero-visual { min-height:350px; }.rock-photo { inset:2% -38% 3% 0; width:138%; height:95%; }.product-card { width:145px; min-height:170px; left:2%; }.product-center strong { font-size:4.6rem; }.metric { padding:12px 14px; }.metric-a { right:-3%; top:10%; }.metric-b { right:0; bottom:4%; }
  .proof-strip { grid-template-columns:1fr; }.proof-strip div { border-right:0; border-bottom:1px solid var(--line); }.proof-strip div:last-child { border-bottom:0; }
  .section-heading h2,.calc-copy h2,.contact h2,.app-intro h2 { font-size:clamp(3rem,15vw,4.5rem); }.tech-note { flex-direction:column; gap:4px; }.tech-note span { text-align:left; }
  footer { grid-template-columns:1fr; gap:14px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }
/* Official brand and original customer media. */
section[id] { scroll-margin-top: 105px; }
.logo-window { display:flex; align-items:center; justify-content:center; overflow:hidden; width:190px; height:62px; background:white; }
.logo-window img { display:block; width:190px; height:190px; max-width:none; }
.hero { gap:40px; }
h1 { font-size:clamp(3.5rem,6.6vw,7.5rem); line-height:.98; }
h2 { line-height:.98; }
.hero-visual.fracture-demo { margin:0; min-height:0; background:var(--ink); color:white; overflow:hidden; box-shadow:0 20px 50px #11131520; }
.fracture-video { display:block; width:100%; aspect-ratio:16/9; object-fit:contain; background:#191b1d; }
.fracture-demo figcaption { padding:24px 28px; }
.fracture-demo figcaption>span { font-size:.875rem; color:#ff8b62; letter-spacing:.12em; font-weight:700; }
.fracture-demo figcaption p { margin:10px 0; font-size:1.25rem; }
.fracture-demo figcaption small { font-size:.875rem; color:#bdc2c7; line-height:1.5; display:block; }
.eyebrow,.disclaimer,.contact-person span { font-size:.875rem; }
.gallery-section { background:#e9e7e1; }
.gallery-heading { display:grid; grid-template-columns:1.2fr 1fr; gap:50px; align-items:end; margin-bottom:45px; }
.gallery-heading h2,.clients h2 { font-size:clamp(3.2rem,5.5vw,5.8rem); }
.gallery-heading>p { max-width:460px; color:#565c60; }
.gallery-layout { display:grid; grid-template-columns:1.55fr 1fr; gap:28px; align-items:start; }
.gallery { background:var(--ink); color:white; min-width:0; }
.gallery-stage { height:490px; }
.gallery-slide { margin:0; height:100%; position:relative; padding-bottom:52px; }
.gallery-slide[hidden] { display:none; }
.gallery-slide img { display:block; width:100%; height:100%; object-fit:contain; }
.gallery-slide figcaption { position:absolute; bottom:0; left:0; right:0; padding:12px 20px; font-size:.875rem; }
.gallery-controls { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:15px 18px; border-top:1px solid #464b50; }
.gallery-controls button { border:1px solid #646a70; background:transparent; color:white; font:600 .875rem/1.5 Inter,Arial,sans-serif; padding:9px 13px; min-height:42px; cursor:pointer; }
.gallery-controls button:hover { background:#363b40; }
#gallery-count { font-size:.875rem; font-variant-numeric:tabular-nums; }
#gallery-pause { margin-left:auto; }
.client-video { margin:0; background:white; }
.client-video video { display:block; width:100%; height:490px; object-fit:contain; background:#111315; }
.client-video figcaption { padding:19px 24px; }
.client-video figcaption strong,.client-video figcaption span { display:block; }
.client-video figcaption span { margin-top:4px; color:#666c70; font-size:.875rem; }
.clients { padding-top:90px; padding-bottom:90px; }
.client-logos { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; margin-top:45px; }
.client-logos figure { background:white; margin:0; padding:22px 15px 16px; display:flex; flex-direction:column; align-items:center; justify-content:space-between; text-align:center; gap:15px; }
.client-logos img { width:100%; height:85px; object-fit:contain; }
.client-logos figcaption { font-size:.875rem; color:#51575b; }
.environment-note { display:grid; grid-template-columns:.8fr 1.2fr; gap:45px; margin-top:50px; padding:32px 0 0; border-top:1px solid var(--line); }
.environment-note h3 { margin:0; font-size:1.5rem; line-height:1.3; }
.environment-note p { margin:0; color:#565c60; }
.calc-copy h2 { font-size:clamp(3rem,5.3vw,5.7rem); }
.calculator { align-items:start; }
.calc-panel .spacing-label { margin-top:24px; font-size:.95rem; }
.spacing-input { border:1px solid #d8d8d5; padding:12px 14px; width:100%; font:600 1.1rem/1.5 Inter,Arial,sans-serif; border-radius:0; }
.input-row { min-height:64px; }
.calc-error { color:#a52b15; font-size:.875rem; margin:12px 0 0; }
.calc-error:empty { display:none; }
.calc-details { border-top:1px solid var(--line); margin-top:24px; padding-top:20px; }
.calc-details summary { font-weight:600; cursor:pointer; }
.calc-details p { color:#62676b; font-size:.95rem; }
.result .holes-result { font-size:1.125rem; color:white; }
.result .holes-result b { font-size:1.5rem; }
.result>span { font-size:.875rem; }
.tech-note { flex-direction:column; gap:5px; }
.tech-note span { text-align:left; }
:focus-visible { outline:3px solid #0059ba; outline-offset:4px; }
@media(max-width:1050px) { nav { gap:18px; }.hero { grid-template-columns:1fr 1fr; }.client-logos { grid-template-columns:repeat(3,minmax(0,1fr)); }.gallery-stage,.client-video video { height:430px; } }
@media(max-width:900px) { .hero { grid-template-columns:1fr; }.hero-visual.fracture-demo { margin-top:15px; }.gallery-heading { grid-template-columns:1fr; gap:15px; }.gallery-layout { grid-template-columns:1fr; }.gallery-stage { height:480px; }.client-video video { height:480px; }.environment-note { grid-template-columns:1fr; gap:20px; } }
@media(max-width:600px) { .header-cta { display:block; padding:10px 12px; font-size:.875rem; }.logo-window { width:152px; height:52px; }.logo-window img { width:152px; height:152px; }.hero { padding-top:50px; gap:28px; }.hero h1 { font-size:clamp(3rem,11vw,4.5rem); }.client-logos { grid-template-columns:repeat(2,minmax(0,1fr)); }.client-logos figure:last-child { grid-column:1/-1; }.client-logos figure:last-child img { max-width:200px; }.gallery-stage { height:410px; }.gallery-controls { padding:12px; gap:8px; }.gallery-controls button { padding:8px 10px; }.gallery-heading h2,.clients h2 { font-size:3.2rem; }.result { padding:24px 20px; }.result strong b { font-size:3.8rem; }.result strong small { font-size:1.5rem; } }
/* Blend the unaltered official logo into the page surface. */
.logo-window { background:transparent; }
.logo-window img { mix-blend-mode:multiply; }
footer { background:var(--paper); color:#555d62; border-top:1px solid var(--line); }
.process-guide { display:block; }
.process-heading { display:grid; grid-template-columns:1.3fr .7fr; gap:50px; align-items:end; }
.process-heading h2 { font-size:clamp(3rem,5.5vw,5.8rem); }
.process-heading>p { color:#62676b; margin:0; max-width:450px; }
.preparation-note { margin:36px 0; padding:22px 26px; background:#e6e3dc; border-left:4px solid var(--orange); }
.preparation-note>strong { font-size:1rem; }
.preparation-note p { margin:5px 0 0; }
.procedure-cards { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; align-items:stretch; }
.procedure-card { background:white; overflow:hidden; min-width:0; }
.procedure-photo { position:relative; overflow:hidden; height:320px; background:#ddd; }
.procedure-photo img { position:absolute; display:block; max-width:none; height:auto; }
.photo-drilling img { width:214%; left:0; top:-10%; }
.photo-cleaning img { width:183%; left:0; top:-12%; }
.photo-filling img { width:181%; left:0; top:-10%; }
.photo-result img { width:100%; height:100%; object-fit:cover; object-position:center; }
.procedure-content { padding:30px; }
.step-title { display:flex; gap:16px; align-items:flex-start; margin-bottom:20px; }
.step-title>span { flex:none; background:var(--orange); color:white; width:44px; height:44px; display:grid; place-items:center; font-weight:700; font-size:1.1rem; }
.step-title h3 { font-family:"Barlow Condensed",Impact,sans-serif; font-size:2rem; line-height:1.05; text-transform:uppercase; margin:2px 0 0; }
.procedure-content>p { color:#53595d; margin:16px 0; }
.procedure-content p strong { color:var(--ink); }
.step-tip { margin-top:24px; padding:20px; background:#f3f1eb; border-left:3px solid #949a9e; }
.step-tip p { margin:8px 0 0; color:#53595d; }
.important-tip { border-left-color:var(--orange); }
.pattern-diagrams { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:20px; }
.pattern-diagrams figure { margin:0; text-align:center; }
.pattern-diagrams svg { display:block; width:100%; height:auto; }
.pattern-diagrams figcaption { font-size:.875rem; font-weight:600; }
.procedure-content .pattern-caption { font-size:.875rem; color:#697075; }
.process-help { display:flex; align-items:center; justify-content:space-between; gap:30px; border-top:1px solid var(--line); padding-top:26px; margin-top:36px; }
.process-help p { margin:0; max-width:550px; }
.process-help .button { flex:none; }
@media(min-width:1400px) { .procedure-photo { height:380px; } }
@media(max-width:900px) { .process-heading { grid-template-columns:1fr; gap:24px; }.procedure-cards { grid-template-columns:1fr; }.procedure-photo { height:380px; }.photo-drilling img { top:-15%; }.photo-cleaning img { top:-20%; }.photo-filling img { top:-15%; } }
@media(max-width:600px) { .process-heading h2 { font-size:clamp(2.7rem,11vw,4rem); }.procedure-photo { height:280px; }.procedure-content { padding:24px 20px; }.step-title h3 { font-size:1.85rem; }.step-tip { padding:16px; }.process-help { flex-direction:column; align-items:flex-start; }.preparation-note { padding:20px; }.photo-drilling img,.photo-filling img { top:-10%; }.photo-cleaning img { top:-12%; } }
/* Keep the action in view while excluding the original poster text. */
.procedure-photo:not(.photo-result) img { top:50%; transform:translateY(-65%); }
