/* Biomedic Advance Osteosynthesis — shared stylesheet */
:root{
  --ink:#111214;
  --white:#FFFFFF;
  --paper:#F6F8FA;
  --line:#E4E8EB;
  --grey-text:#5C6670;
  --accent:#1D5A8C;
  --accent-2:#20C9BB;
  --navy:#0B2540;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:'Inter',sans-serif;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.container{max-width:1240px;margin:0 auto;padding:0 32px;}
.upper{text-transform:uppercase;}
.tracked{letter-spacing:0.14em;}

/* NAV */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.navwrap{display:flex;align-items:center;justify-content:space-between;padding:14px 32px;max-width:1240px;margin:0 auto;}
.navwrap .logo img{height:32px;width:auto;}
nav ul{list-style:none;display:flex;gap:26px;margin:0;padding:0;}
nav a{font-size:12px;font-weight:600;color:var(--ink);}
nav a:hover{color:var(--accent);}
nav a.active{color:var(--accent);}
.navctas{display:flex;align-items:center;gap:10px;}
.navcta{padding:11px 20px;font-size:12px;font-weight:700;}
.navcta.store{background:var(--ink);color:#fff !important;}
.navcta.store:hover{background:var(--accent);}
.navcta.quote{border:1.5px solid var(--ink);color:var(--ink) !important;}
.navcta.quote:hover{border-color:var(--accent);color:var(--accent) !important;}
@media(max-width:960px){nav ul{display:none;}}

/* PAGE HERO (subpages) */
.pagehero{padding:56px 0 54px;border-bottom:1px solid var(--line);}
.pagehero .crumb{font-size:11px;font-weight:700;color:var(--accent);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:16px;}
.pagehero h1{font-size:clamp(36px,5.4vw,64px);font-weight:900;letter-spacing:-0.03em;line-height:1;margin:0 0 20px;max-width:760px;}
.pagehero p{font-size:15.5px;color:var(--grey-text);line-height:1.7;max-width:560px;}
.pagehero.dark{background:var(--navy);color:#fff;border-bottom:none;}
.pagehero.dark .crumb{color:var(--accent-2);}
.pagehero.dark p{color:#B7CBDC;}

/* HOME HERO */
.hero{padding:52px 0 0;}
.hero .split{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
@media(max-width:900px){.hero .split{grid-template-columns:1fr;}}
.hero h1{font-size:clamp(42px,6.4vw,84px);font-weight:900;line-height:0.96;letter-spacing:-0.03em;margin:0;}
.hero h1 span{color:var(--accent);}
.hero-sub{max-width:440px;font-size:15px;color:var(--grey-text);line-height:1.65;margin-top:22px;}
.hero-ctas{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap;}
.btn{display:inline-flex;align-items:center;gap:8px;padding:15px 26px;font-weight:700;font-size:13px;}
.btn-dark{background:var(--ink);color:#fff;}
.btn-dark:hover{background:var(--accent);}
.btn-outline{border:1.5px solid var(--ink);}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);}
.hero-photo{background:var(--paper);overflow:hidden;}
.hero-photo img{width:100%;height:100%;object-fit:cover;}
.hero-tagrow{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-top:1px solid var(--line);margin-top:44px;}
.hero-tag{font-size:11px;font-weight:600;color:var(--grey-text);}
.hero-tag a:hover{color:var(--accent);}
@media(max-width:700px){.hero-tagrow{flex-wrap:wrap;gap:10px;}}

/* STATS */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.stats .container{display:grid;grid-template-columns:repeat(3,1fr);}
@media(max-width:880px){.stats .container{grid-template-columns:1fr 1fr;}}
.stat{padding:28px 0;border-left:1px solid var(--line);padding-left:26px;}
.stat:first-child{border-left:none;padding-left:0;}
.stat .n{font-size:32px;font-weight:800;letter-spacing:-0.02em;}
.stat .l{font-size:11px;color:var(--grey-text);margin-top:4px;font-weight:600;}

/* SECTIONS */
section.line{padding:96px 0;}
section.line.tight{padding:64px 0;}
section.line.on-paper{background:var(--paper);}
section.line.dark{background:var(--navy);color:#fff;}
section.line.dark .rowhead h2{color:#fff;}
section.line.dark .rowhead p{color:#9FB6C9;}
.rowhead{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:46px;gap:24px;flex-wrap:wrap;}
.rowhead .eyebrow{font-size:11px;font-weight:700;color:var(--accent);margin-bottom:14px;}
.rowhead h2{font-size:clamp(28px,4vw,48px);font-weight:900;letter-spacing:-0.02em;line-height:1;margin:0;max-width:640px;}
.rowhead p{font-size:14.5px;color:var(--grey-text);max-width:300px;line-height:1.65;}
.service-intro{max-width:760px;font-size:15px;color:var(--grey-text);line-height:1.75;margin-bottom:36px;}

/* LINE CARDS (home overview) */
.linegrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media(max-width:880px){.linegrid{grid-template-columns:1fr 1fr;}}
.linecard{background:#fff;padding:36px 28px;transition:background .2s;}
.linecard:hover{background:var(--paper);}
.linecard .num{font-size:12px;color:var(--accent);font-weight:700;margin-bottom:20px;}
.linecard h3{font-size:19px;font-weight:800;margin:0 0 10px;letter-spacing:-0.01em;}
.linecard p{font-size:13.5px;color:var(--grey-text);line-height:1.6;margin:0 0 20px;}
.linecard .go{font-size:12px;font-weight:700;color:var(--ink);}
.linecard:hover .go{color:var(--accent);}

/* ABOUT */
.about-split{display:grid;grid-template-columns:0.9fr 1.1fr;gap:56px;align-items:center;}
@media(max-width:900px){.about-split{grid-template-columns:1fr;}}
.about-split .ph{background:var(--paper);overflow:hidden;aspect-ratio:4/3.2;}
.about-split .ph img{width:100%;height:100%;object-fit:cover;}
.about-copy p{font-size:15px;color:var(--grey-text);line-height:1.75;margin:0 0 18px;}
.about-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px;}
.fact{border-top:1px solid var(--line);padding-top:14px;}
.fact .k{font-size:11px;color:var(--grey-text);font-weight:600;text-transform:uppercase;letter-spacing:0.06em;}
.fact .v{font-size:15px;font-weight:700;margin-top:4px;}

/* PHOTO GRID */
.photogrid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);margin-bottom:2px;}
@media(max-width:880px){.photogrid{grid-template-columns:1fr 1fr;}}
.pg-item{background:#fff;position:relative;overflow:hidden;aspect-ratio:1/1;}
.pg-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.pg-item:hover img{transform:scale(1.06);}
.pg-label{position:absolute;left:0;bottom:0;right:0;padding:14px 16px;background:linear-gradient(0deg,rgba(0,0,0,0.7),transparent);color:#fff;}
.pg-label .t{font-weight:800;font-size:14px;}
.pg-label .s{font-size:10.5px;color:#E4E8EB;margin-top:2px;}

/* SPLIT LAYOUTS */
.split2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
@media(max-width:880px){.split2{grid-template-columns:1fr;gap:36px;}}
.split2.reverse .visual{order:2;}
@media(max-width:880px){.split2.reverse .visual{order:0;}}
.visual{background:var(--paper);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);}
.visual.on-dark{background:#132C46;border-color:rgba(255,255,255,0.12);}
.visual svg{width:80%;height:80%;}

/* ITEM LIST */
.itemlist{display:flex;flex-direction:column;}
.item{padding:22px 0;border-top:1px solid var(--line);}
.item:last-child{border-bottom:1px solid var(--line);}
.item-top{display:flex;justify-content:space-between;align-items:baseline;}
.item h3{font-size:18px;font-weight:800;margin:0;letter-spacing:-0.01em;}
.item .idx{font-size:12px;color:var(--accent);font-weight:700;}
.item p{font-size:13.5px;color:var(--grey-text);line-height:1.65;margin-top:8px;max-width:460px;}
.dark .item{border-top:1px solid rgba(255,255,255,0.14);}
.dark .item:last-child{border-bottom:1px solid rgba(255,255,255,0.14);}
.dark .item h3{color:#fff;}
.dark .item p{color:#9FB6C9;}
.dark .item .idx{color:var(--accent-2);}

/* SPEC TABLE (subpages) */
.spectable{width:100%;border-collapse:collapse;margin-top:8px;}
.spectable tr{border-top:1px solid var(--line);}
.spectable tr:last-child{border-bottom:1px solid var(--line);}
.spectable td{padding:14px 0;font-size:13.5px;}
.spectable td:first-child{color:var(--grey-text);width:40%;}
.spectable td:last-child{font-weight:700;}

/* SERVICES */
.servrow{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);}
@media(max-width:880px){.servrow{grid-template-columns:1fr;}}
.servrow.four{grid-template-columns:repeat(4,1fr);}
@media(max-width:960px){.servrow.four{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.servrow.four{grid-template-columns:1fr;}}
.servcol{padding:34px 30px 34px 0;border-left:1px solid var(--line);}
.servcol:first-child{border-left:none;padding-left:0;}
@media(max-width:880px){.servcol{border-left:none;padding-left:0;border-top:1px solid var(--line);}
  .servcol:first-child{border-top:none;}}
.servcol .num{font-size:13px;color:var(--accent);font-weight:700;margin-bottom:14px;}
.servcol h3{font-size:16.5px;font-weight:800;margin:0 0 8px;}
.servcol p{font-size:13.5px;color:var(--grey-text);line-height:1.6;}

/* FAQ */
.faqlist{max-width:760px;}
details{border-top:1px solid var(--line);padding:18px 0;}
details:last-child{border-bottom:1px solid var(--line);}
summary{font-weight:700;font-size:15px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;}
summary::-webkit-details-marker{display:none;}
summary::after{content:"+";font-size:20px;color:var(--accent);font-weight:400;}
details[open] summary::after{content:"–";}
details p{font-size:13.5px;color:var(--grey-text);line-height:1.7;margin:12px 0 0;max-width:620px;}

/* STORE BAND */
.storeband{background:var(--paper);padding:64px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.storeband .container{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;}
.storeband h2{font-size:clamp(22px,3.2vw,34px);font-weight:900;letter-spacing:-0.02em;margin:0 0 8px;max-width:480px;}
.storeband p{font-size:14px;color:var(--grey-text);max-width:440px;margin:0;}

/* CTA */
.cta{padding:100px 0;text-align:center;}
.cta h2{font-size:clamp(30px,5vw,60px);font-weight:900;letter-spacing:-0.02em;line-height:1.02;margin:0 auto 28px;max-width:820px;}
.cta .hero-ctas{justify-content:center;}

/* FOOTER */
footer{border-top:1px solid var(--line);padding:52px 0 24px;}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;margin-bottom:46px;}
@media(max-width:880px){.fgrid{grid-template-columns:1fr 1fr;}}
footer .flogo img{height:28px;margin-bottom:14px;}
footer h4{font-size:11px;font-weight:700;color:var(--grey-text);margin-bottom:16px;}
footer p.fdesc{font-size:13.5px;color:var(--grey-text);line-height:1.7;max-width:300px;}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
footer ul a,footer ul li{font-size:13.5px;}
footer ul a:hover{color:var(--accent);}
.fbottom{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:11.5px;color:var(--grey-text);}

/* SOCIAL ROW */
.social-row{display:flex;gap:10px;margin-top:18px;}
.social-row a{width:34px;height:34px;border:1px solid rgba(255,255,255,0.18);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:border-color .15s,background .15s;}
.social-row a:hover{border-color:var(--accent);background:rgba(255,255,255,0.04);}
.social-row svg{width:16px;height:16px;fill:#B7CBDC;}
.social-row a:hover svg{fill:var(--accent);}

/* WHATSAPP FLOAT */
.wa-float{
  position:fixed;bottom:22px;right:22px;z-index:60;
  width:56px;height:56px;border-radius:50%;background:#25D366;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,0.22);transition:transform .15s;
}
.wa-float:hover{transform:scale(1.06);}
.wa-float svg{width:28px;height:28px;fill:#fff;}
@media(max-width:600px){.wa-float{width:50px;height:50px;bottom:16px;right:16px;}}

/* IMAGE BAND (photo strip within a section) */
.imgband{width:100%;height:380px;overflow:hidden;background:var(--paper);}
.imgband img{width:100%;height:100%;object-fit:cover;display:block;}
@media(max-width:700px){.imgband{height:220px;}}
.imgband.small{height:240px;}
@media(max-width:700px){.imgband.small{height:180px;}}