/* Secondary landing pages (fason hub, materials, sectors, hammadde). Loaded after fonts.css + page.css */
html{scroll-padding-top:84px;}
body{background:var(--ink); color:var(--bone); font-family:'Inter',Arial,sans-serif; text-align:center;}
.wrap{max-width:1100px; margin:0 auto; padding:0 32px; width:100%;}
.wrap.narrow{max-width:760px;}
.skip{position:fixed; left:8px; top:8px; transform:translateY(-200%); z-index:2000; background:var(--brass); color:var(--ink); padding:10px 16px; font-weight:700; font-size:13px;}
.skip:focus{transform:none;}

/* top navigation */
.topnav{position:sticky; top:0; z-index:1000; background:rgba(10,9,8,.86); backdrop-filter:blur(14px); border-bottom:1px solid var(--line);}
.nav-in{display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:14px; padding-bottom:14px;}
.brand img{height:44px; width:auto;}
.links{display:flex; gap:30px;}
.links a{font-size:12px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:var(--smoke);}
.links a:hover{color:var(--brass-bright);}
.cta{border:1px solid var(--brass); color:var(--brass-bright); padding:10px 22px; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;}
.cta:hover{background:var(--brass); color:var(--ink);}
@media(max-width:820px){ .links{display:none;} .nav-in{padding-top:10px; padding-bottom:10px;} .brand img{height:38px;} }

/* hero */
.hero-s{padding:70px 0 80px; background:radial-gradient(ellipse 70% 60% at 50% 0%, rgba(198,162,77,.09), transparent 70%);}
.crumbs{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:6px 10px; font-size:12.5px; color:var(--smoke); margin-bottom:34px;}
.crumbs a:hover{color:var(--brass-bright);}
.crumbs i{font-style:normal; color:var(--brass-deep);}
.crumbs span{color:var(--bone);}
.hero-s h1{font-size:clamp(38px,6.4vw,80px); line-height:.95; max-width:920px; margin:0 auto 22px;}
.hero-s .lede{max-width:640px; margin-bottom:34px;}
.hero-s .btn-row, .sec .btn-row{justify-content:center;}

/* trust bar */
.trust{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--ink-2);}
.trust ul{list-style:none; margin:0 auto; max-width:none; display:grid; grid-template-columns:repeat(4,1fr);}
.trust li{max-width:none; margin:0; padding:24px 20px; border-left:1px solid var(--line); font-size:13px; color:var(--smoke); line-height:1.5; text-align:center;}
.trust li:first-child{border-left:none;}
.trust li b{display:block; font-family:'Big Shoulders Display',Arial,sans-serif; font-weight:800; font-size:21px; letter-spacing:.3px; color:var(--bone); text-transform:uppercase; margin-bottom:3px;}
@media(max-width:820px){ .trust ul{grid-template-columns:1fr 1fr;} .trust li{border-left:none; border-top:1px solid var(--line); padding:18px 12px;} .trust li:nth-child(-n+2){border-top:none;} }

/* sections */
.sec{padding:96px 0; position:relative;}
.sec.alt{background:linear-gradient(180deg, var(--ink-2) 0%, #0f0d0b 100%); box-shadow:inset 0 1px 0 var(--line), inset 0 -1px 0 var(--line);}
.sec h2{font-size:clamp(30px,4.2vw,50px); line-height:1; margin:0 auto 26px; max-width:820px; letter-spacing:-.3px;}
.sec .lede{margin:0 auto 10px;}
@media(max-width:700px){ .sec{padding:64px 0;} .wrap{padding:0 20px;} }

.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:40px;}
.card{background:var(--ink); padding:32px 26px; display:flex; flex-direction:column; align-items:center; gap:10px;}
.card h3{font-family:'Big Shoulders Display',Arial,sans-serif; font-weight:800; text-transform:uppercase; font-size:25px; line-height:1.05; letter-spacing:-.2px;}
.card p{font-size:14px; color:var(--smoke); line-height:1.65; margin:0;}
.card .more{margin-top:auto; padding-top:10px; font-size:11.5px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--brass);}
a.card:hover{background:var(--ink-3);}
a.card:hover .more{color:var(--brass-bright);}

ul.plain{list-style:none; margin:34px auto 0; padding:0; max-width:760px;}
ul.plain li{max-width:none; margin:0; padding:15px 10px; border-bottom:1px solid var(--line); font-size:16px; color:var(--bone); line-height:1.6;}
ul.plain li:first-child{border-top:1px solid var(--line);}

ol.steps{list-style:none; margin:44px auto 0; padding:0; max-width:760px; counter-reset:s;}
ol.steps li{max-width:none; margin:0; padding:0 0 46px; position:relative;}
ol.steps li:not(:last-child)::after{content:''; position:absolute; left:50%; bottom:10px; height:30px; width:1px; background:linear-gradient(180deg, var(--brass-deep), transparent);}
ol.steps .n{display:block; font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:1.5px; color:var(--brass); margin-bottom:8px;}
ol.steps h3{font-family:'Big Shoulders Display',Arial,sans-serif; font-weight:800; text-transform:uppercase; font-size:28px; line-height:1.05; margin-bottom:8px; color:var(--bone);}
ol.steps p{font-size:15px; color:var(--smoke); margin:0 auto;}

dl.notes{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin:40px 0 0;}
dl.notes div{background:var(--ink); padding:26px 22px;}
dl.notes dt{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--brass); margin-bottom:10px;}
dl.notes dd{margin:0; font-size:14.5px; color:var(--bone); line-height:1.6;}

.faqs{max-width:780px; margin:40px auto 0; text-align:center;}
details.faq{border-bottom:1px solid var(--line);}
details.faq:first-child{border-top:1px solid var(--line);}
details.faq summary{list-style:none; cursor:pointer; padding:22px 44px; font-size:16.5px; font-weight:600; line-height:1.4; position:relative;}
details.faq summary::-webkit-details-marker{display:none;}
details.faq summary::after{content:'+'; position:absolute; right:6px; top:50%; transform:translateY(-50%); font-family:'IBM Plex Mono',monospace; font-size:20px; color:var(--brass);}
details.faq[open] summary::after{content:'\2013';}
details.faq .ans p{max-width:660px; margin:0 auto; padding:0 0 26px; font-size:17px; line-height:1.75; color:var(--brass-bright);}

/* form */
.form-sec .lede{margin-bottom:34px;}
#teklif-form{text-align:left; margin-top:10px;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-bottom:22px;}
@media(max-width:640px){ .row2{grid-template-columns:1fr;} }
.field label{display:block; font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:1px; color:var(--smoke); margin-bottom:10px; text-transform:uppercase; text-align:left;}
.field input, .field textarea, .field select{width:100%; background:transparent; border:none; border-bottom:1px solid var(--line); padding:10px 2px; color:var(--bone); font-size:15px; font-family:inherit; border-radius:0; text-align:left;}
.field select{appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--brass) 50%),linear-gradient(135deg,var(--brass) 50%,transparent 50%); background-position:calc(100% - 14px) 55%, calc(100% - 9px) 55%; background-size:5px 5px; background-repeat:no-repeat;}
.field select option{background:var(--ink-2); color:var(--bone);}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--brass);}
.field{margin-bottom:0;}
.form-sec .field textarea{margin-bottom:6px;}
.hp{position:absolute; left:-9999px; opacity:0; width:0; height:0;}
.consent{display:flex; gap:12px; align-items:flex-start; margin:22px 0; font-size:12.5px; color:var(--smoke); line-height:1.55; text-align:left;}
.consent input{width:auto; margin-top:3px; accent-color:var(--brass);}
.consent a{color:var(--brass-bright); border-bottom:1px solid var(--brass-deep);}
.submit{display:block; margin:6px auto 0; border:none; cursor:pointer; font-family:inherit;}
.submit:disabled{opacity:.6; cursor:default;}
#form-status{display:none; margin-top:16px; text-align:center; font-size:14px; color:#e08a8a;}

/* footer */
.foot{border-top:1px solid var(--line); padding:64px 0 34px; margin-top:0;}
.fgrid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1.2fr; gap:40px; justify-items:center;}
.flogo{height:60px; width:auto; margin:0 auto 16px;}
.foot p, .foot li{font-size:13px; color:var(--smoke); line-height:1.8; max-width:none; margin-left:0; margin-right:0;}
.foot ul{list-style:none; margin:0; padding:0;}
.foot .fh{font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--brass); margin-bottom:12px;}
.foot li a{display:inline-block; padding:4px 0;}
.foot a:hover{color:var(--brass-bright);}
.fbottom{margin-top:44px; padding-top:22px; border-top:1px solid var(--line); font-size:12px; color:var(--smoke); display:flex; justify-content:center; flex-wrap:wrap; gap:6px 28px;}
@media(max-width:900px){ .fgrid{grid-template-columns:1fr 1fr;} }
@media(max-width:560px){ .fgrid{grid-template-columns:1fr; gap:30px;} }

/* floating actions */
.fab{position:fixed; right:calc(22px + env(safe-area-inset-right)); z-index:998; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px rgba(0,0,0,.4);}
.fab.wa{bottom:calc(84px + env(safe-area-inset-bottom)); width:52px; height:52px; border-radius:50%; background:#1f9d55; color:#fff;}
.fab.wa:hover{background:#25b862;}
.fab.wa svg{width:26px; height:26px;}
.fab.call{bottom:calc(22px + env(safe-area-inset-bottom)); gap:10px; background:var(--brass); color:var(--ink); padding:15px 22px 15px 18px; border-radius:40px; font-weight:800; font-size:14px;}
.fab.call svg{width:18px; height:18px;}
@media(max-width:600px){ .fab.call span{display:none;} .fab.call{padding:16px; border-radius:50%;} }
@media(prefers-reduced-motion:reduce){ *{transition-duration:.01ms !important; animation-duration:.01ms !important;} }