/* FIBOVO FIELD GUIDE — original editorial layout for engineering procurement.
   Photographs in /assets/photos have their own independently documented licences.
   This sheet does not alter RFQ handling, policy, supplier or company identity. */
:root{--fib-ink:#14232b;--fib-deep:#102e34;--fib-line:#cfdbd6;--fib-warm:#f1f3ed;--fib-mint:#b4e1d2;--fib-sage:#2c6f60}
html{scroll-padding-top:24px}
body{background:#f6f7f3;color:var(--fib-ink)}
.topline{background:#162d32}
.header{background:#fff;border-bottom:1px solid #c8d8d3;position:relative;z-index:5}
.header-row{min-height:85px}
.header .logo{font-weight:900;letter-spacing:-1.2px}
.header .nav a{color:#27414b;letter-spacing:.015em}
.header .nav-cta{background:#213d42;border-radius:2px}
.header .nav-cta:hover{background:#386960}
.field-hero{background:#eff2ed;color:#162b30;overflow:hidden}
.field-hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:4.5%;min-height:680px;align-items:stretch}
.field-hero-copy{padding:97px 0 80px;position:relative}
.technical-eyebrow{display:flex;align-items:center;gap:12px;font-size:10px;font-weight:850;letter-spacing:1.85px;color:#426b66}
.technical-dash{width:30px;height:2px;background:#208777;flex:0 0 30px}
.hero-edition{margin-left:auto;color:#7b938e;font-size:9px}
.field-hero h1{font-size:clamp(50px,5.3vw,92px);letter-spacing:-.065em;line-height:.98;margin:54px 0 30px;font-weight:850;max-width:700px}
.field-hero h1 em{display:inline-block;color:#20826d;font-style:normal}
.field-lead{font-size:clamp(17px,1.45vw,21px);font-weight:540;line-height:1.55;max-width:535px;color:#1b3238;margin:0 0 15px}
.field-context{color:#597078;font-size:13px;line-height:1.85;max-width:530px}
.field-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 54px}
.field-button{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:52px;font-size:12px;letter-spacing:.015em;font-weight:850;padding:15px 19px;transition:background .15s,color .15s}
.field-button.solid{background:#163d41;color:#f4fbf7}.field-button.solid:hover{background:#2f7b69}
.field-button.outline{color:#23433e;background:transparent;border:1px solid #a7bbb2}.field-button.outline:hover{background:#e1eae2}
.field-hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:575px}
.field-hero-metrics>div{border-top:1px solid #9fb7ab;padding-top:10px;display:flex;align-items:start;gap:13px}
.field-hero-metrics b{font-size:10px;color:#16806c;letter-spacing:.13em}
.field-hero-metrics span{font-size:11px;color:#627a75;line-height:1.4}
.field-hero-image{min-height:650px;position:relative;margin:0;overflow:hidden;background:#a7b7b4}
.field-hero-image::after{position:absolute;content:"";inset:40% 0 0;background:linear-gradient(180deg,transparent 10%,#05272cba 100%);pointer-events:none}
.field-hero-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% 31%;filter:saturate(.85)}
.field-hero-image figcaption{position:absolute;bottom:31px;left:29px;right:25px;z-index:2;display:flex;align-items:end;justify-content:space-between;gap:15px;color:#fff;font-size:12px;line-height:1.5}
.field-hero-image figcaption span:first-child{border-top:2px solid #ace8d3;padding-top:12px;letter-spacing:1.35px;font-weight:800;font-size:10px;white-space:nowrap}
.field-hero-image figcaption span:last-child{text-align:right;font-size:11px;color:#f0f6f2}
.image-side-label{position:absolute;z-index:2;top:25px;right:26px;background:#ecf4ebea;padding:12px 16px;font-weight:900;letter-spacing:1.2px;font-size:9px}
.field-hero-rail{background:#152f33;color:#c6e3da}
.field-hero-rail>.wrap{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}
.field-hero-rail span{font-size:10px;font-weight:850;letter-spacing:1.3px}
.field-hero-rail span:nth-child(2){color:#67beaa}
.engineering-section{background:#fff;padding:100px 0 115px}
.field-kicker{font-size:10px;letter-spacing:2px;color:#218471;font-weight:850;margin-bottom:17px}
.engineering-intro{display:grid;grid-template-columns:1.12fr .88fr;gap:70px;align-items:end;margin-bottom:62px}
.engineering-intro h2,.materials-heading h2{font-size:clamp(43px,4.9vw,72px);font-weight:820;letter-spacing:-.058em;line-height:1.07;margin:0;color:#192d34}
.engineering-intro>p{font-size:14px;line-height:1.95;color:#5d747b;max-width:470px;margin:0 0 7px}
.engineering-lines{border-bottom:1px solid #d0dcd8}
.engineering-line{display:grid;grid-template-columns:83px 1fr 42px;gap:20px;align-items:center;min-height:123px;border-top:1px solid #d0dcd8;color:#1c3740;padding:17px 6px;text-decoration:none}
.engineering-line:hover{background:#f5f8f4}
.engineering-number{color:#27917b;font-size:12px;font-weight:850;align-self:center}
.engineering-line strong{display:block;font-size:clamp(19px,2vw,28px);font-weight:750;letter-spacing:-.02em;margin:0 0 8px}
.engineering-line small{font-size:12px;color:#7d9193}
.engineering-arrow{justify-self:end;font-size:25px;color:#2c776d}
.materials-section{background:#f2f5f0;padding:104px 0 90px}
.materials-heading{display:grid;grid-template-columns:1fr .75fr;gap:70px;align-items:end;margin-bottom:62px}
.materials-intro{max-width:465px}
.materials-intro p{font-size:14px;line-height:1.85;color:#5f7577;margin:0 0 22px}
.materials-intro a,.dossier-link{display:inline-flex;justify-content:space-between;align-items:center;gap:25px;text-decoration:none;color:#1c7469;font-size:12px;letter-spacing:.02em;font-weight:850;border-bottom:1px solid #8fafa1;padding-bottom:11px}
.material-dossier{display:grid;grid-template-columns:.9fr 1.1fr;border-top:1px solid #aebfb7;min-height:570px;gap:5%;padding:36px 0 54px;scroll-margin-top:25px}
.material-dossier+.material-dossier{padding-top:55px}
.dossier-copy{padding:14px 0 30px;display:flex;flex-direction:column;align-items:flex-start}
.dossier-overline{display:flex;justify-content:space-between;width:100%;gap:20px;color:#397e6f;letter-spacing:1.3px;font-size:10px;font-weight:850;margin:0 0 41px}
.dossier-overline span:last-child{color:#80958e}
.dossier-copy h3{font-size:clamp(30px,3vw,48px);line-height:1.11;letter-spacing:-.046em;color:#132c35;margin:0 0 20px;font-weight:780;max-width:490px}
.dossier-copy>p{font-size:13px;line-height:1.85;color:#617880;max-width:460px;margin-bottom:30px}
.product-spec-list{margin:0 0 28px;padding:0;width:100%;border-top:1px solid #ccdad1}
.product-spec-list>div{border-bottom:1px solid #ccdad1;padding:14px 0;display:grid;grid-template-columns:1fr;gap:4px}
.product-spec-list dt{font-size:13px;font-weight:800;color:#1b3b41}
.product-spec-list dd{font-size:11px;color:#698080;margin:0;line-height:1.6}
.dossier-link{margin-top:auto}
.dossier-gallery{display:grid;grid-template-columns:1.12fr .88fr;grid-template-rows:repeat(2,1fr);gap:9px;min-height:520px}
.field-photo{position:relative;margin:0;overflow:hidden;background:#d6e0da;min-height:200px}
.field-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center;filter:saturate(.88);transition:transform .35s ease}
.field-photo:hover img{transform:scale(1.045)}
.field-photo::after{content:"";position:absolute;bottom:0;left:0;right:0;height:86px;background:linear-gradient(transparent,#091a20a8);pointer-events:none}
.field-photo figcaption{position:absolute;z-index:1;bottom:17px;left:17px;right:12px;font-weight:850;color:#fff;letter-spacing:.6px;font-size:11px;line-height:1.4}
.photo-feature{grid-row:span 2;min-height:445px}
.gallery-cables .photo-feature img{object-position:49% 34%}
.gallery-cables .photo-secondary:nth-child(2) img{object-position:51% 44%}
.gallery-passive .photo-feature img{object-position:48% 49%}
.gallery-passive .photo-secondary:nth-child(2) img{object-position:48% 48%}
.gallery-connectors{grid-template-columns:1.25fr .75fr;grid-template-rows:1fr;min-height:480px}
.gallery-connectors .photo-feature{grid-row:auto;min-height:460px}
.gallery-connectors .photo-feature img{object-position:50% 50%}
.connector-worksheet{background:#163f3e;color:#dff0e9;padding:39px 26px;display:flex;flex-direction:column;justify-content:center;gap:15px}
.connector-worksheet>span{color:#8ad3c1;font-size:10px;letter-spacing:1.4px;font-weight:900;margin-bottom:12px}
.connector-worksheet>div{border-bottom:1px solid #3b706b;padding-bottom:15px;color:#81bead;font-size:11px}
.connector-worksheet strong{display:block;font-size:17px;color:#fff;margin-top:6px;line-height:1.35}
.connector-worksheet p{font-size:11px;color:#8abbb5;line-height:1.6;margin:10px 0 0}
.photo-disclosure{margin:13px 0 0;padding:20px 0;border-top:1px solid #bacdc3;font-size:11px;line-height:1.8;color:#71847f}
.photo-disclosure a{color:#276e65;text-decoration:underline;text-underline-offset:2px}
/* The existing working BOM planner and live RFQ form keep their original field IDs, hooks and handlers. */
.planner{background:#122f33}
.planner h2{font-weight:790;letter-spacing:-.045em}
.planner-form{background:#f7faf5;color:#19343a;border-radius:2px;border-color:#d1e2d8}
.planner-form label{color:#1a3d43}
.planner-form .disclaimer{color:#718884}
.bom-results{border-radius:2px;border-color:#467777;background:#184b50}
.inquiry{background:#fff}
.inquiry h2{font-weight:790;letter-spacing:-.046em}
.inquiry-grid{grid-template-columns:.85fr 1.15fr;gap:7%}
.inquiry-form{border-radius:1px;background:#f5f8f6}
.inquiry-form input,.inquiry-form select,.inquiry-form textarea{border-radius:2px}
.process{background:#e5ede7}
.process .section-head h2{font-size:clamp(37px,4vw,59px);letter-spacing:-.045em}
.process .steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid #aec5b9}
.process .step{min-height:180px;border-bottom:1px solid #aec5b9;border-right:1px solid #aec5b9;background:transparent;border-radius:0}
.process .step:nth-child(2n){border-right:none}
.process .step>b{font-family:monospace;color:#278d7a}
.footer{background:#142b2e}
/* Staged image credit page uses the same brand system but a text-forward reference layout. */
.credit-guide{min-height:100vh;padding:70px 0 110px;background:#f5f6f2}
.credit-guide h1{font-size:clamp(43px,6vw,75px);letter-spacing:-.055em;line-height:1.1;margin-bottom:20px}
.credit-guide>div>p{max-width:760px;font-size:14px;line-height:1.9;color:#536f76}
.credit-guide table{border-collapse:collapse;width:100%;font-size:12px;margin:40px 0}
.credit-guide th{text-align:left;background:#e0e9e2;padding:17px 13px}
.credit-guide td{padding:17px 13px;border-bottom:1px solid #d0ddd6;vertical-align:top}
.credit-guide td a{color:#266c64;text-decoration:underline}
@media(max-width:1080px){
 .field-hero-grid{grid-template-columns:1fr .88fr;gap:3%}
 .field-hero-copy{padding:72px 0}
 .field-hero h1{font-size:clamp(50px,5.8vw,74px)}
 .field-hero-image{min-height:600px}
 .material-dossier{grid-template-columns:.92fr 1.08fr;gap:3%}
 .dossier-gallery{min-height:440px}
 .hero-edition{display:none}
}
@media(max-width:780px){
 .field-hero-grid{display:flex;flex-direction:column;gap:0}
 .field-hero-copy{padding:67px 0 40px}
 .field-hero h1{font-size:clamp(50px,10vw,74px);margin:33px 0 25px}
 .field-hero-image{height:410px;min-height:410px;flex-shrink:0;margin:0 -18px}
 .field-hero-image img{object-position:center 38%}
 .field-hero-rail>.wrap{padding-top:18px;padding-bottom:18px;gap:9px}
 .field-hero-rail span{font-size:9px}
 .engineering-section{padding:70px 0 75px}
 .engineering-intro{grid-template-columns:1fr;gap:22px;margin-bottom:34px}
 .engineering-line{min-height:105px;grid-template-columns:43px 1fr 30px;gap:10px}
 .materials-section{padding:70px 0}
 .materials-heading{grid-template-columns:1fr;gap:25px;margin-bottom:42px}
 .material-dossier{grid-template-columns:1fr;min-height:0;gap:0;padding:29px 0 45px}
 .dossier-copy{padding:5px 0 30px}
 .dossier-overline{margin-bottom:22px}
 .dossier-copy h3{max-width:670px}
 .dossier-gallery{min-height:430px;height:430px}
 .gallery-connectors{min-height:350px;height:350px}
 .gallery-connectors .photo-feature{min-height:350px}
 .dossier-link{margin-top:14px}
 .credit-guide table{font-size:11px}
}
@media(max-width:450px){
 .technical-eyebrow{font-size:8px;gap:8px;letter-spacing:1.3px}
 .technical-dash{width:19px;flex-basis:19px}
 .field-hero h1{font-size:49px;letter-spacing:-.067em}
 .field-lead{font-size:17px}
 .field-hero-actions{flex-direction:column;gap:9px;margin-bottom:37px}
 .field-button{width:100%}
 .field-hero-metrics{gap:9px}
 .field-hero-metrics>div{gap:5px;flex-direction:column}
 .field-hero-metrics span{font-size:10px}
 .field-hero-image{height:410px;min-height:410px}
 .image-side-label{right:14px;top:18px;padding:8px 11px;font-size:8px}
 .field-hero-image figcaption{left:16px;right:14px;bottom:16px;font-size:9px;gap:7px}
 .field-hero-image figcaption span:last-child{font-size:8px}
 .field-hero-rail span{font-size:8px}
 .engineering-intro h2,.materials-heading h2{font-size:42px}
 .engineering-line strong{font-size:20px}
 .engineering-line small{font-size:10px}
 .dossier-copy h3{font-size:34px}
 .dossier-gallery{height:385px;min-height:385px;gap:6px}
 .photo-feature{min-height:385px}
 .field-photo figcaption{font-size:9px;left:9px;bottom:9px}
 .gallery-connectors{height:318px;min-height:318px}
 .gallery-connectors .photo-feature{min-height:318px}
 .connector-worksheet{padding:18px 10px;gap:6px}
 .connector-worksheet>span{font-size:8px;margin-bottom:5px}
 .connector-worksheet strong{font-size:12px}
 .connector-worksheet>div{font-size:8px;padding-bottom:8px}
 .connector-worksheet p{font-size:9px}
 .process .steps{grid-template-columns:1fr}
 .process .step{border-right:none}
 .credit-guide table{display:block;overflow-x:auto}
}
@media(prefers-reduced-motion:reduce){.field-photo img{transition:none}}