:root{
  --oh-bg:#070b14;
  --oh-card:#0c1222;
  --oh-card2:#0a1020;
  --oh-text:#e9edf7;
  --oh-muted:#b8c0d6;
  --oh-line: rgba(255,255,255,.09);
  --oh-accent:#ff7a18;   /* turuncu vurgu */
  --oh-accent2:#1b67ff;  /* lacivert/mavi vurgu */
  --oh-radius:18px;
  --oh-shadow: 0 20px 60px rgba(0,0,0,.35);
}

.oh-page{
  background: radial-gradient(1200px 500px at 20% 5%, rgba(27,103,255,.18), transparent 60%),
              radial-gradient(900px 500px at 85% 20%, rgba(255,122,24,.16), transparent 60%),
              var(--oh-bg);
  color: var(--oh-text);
}

.oh-container{
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
}

.oh-hero{
  position: relative;
  padding: 56px 0 30px;
  overflow: hidden;
  border-bottom: 1px solid var(--oh-line);
}

.oh-hero__bg{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to bottom, rgba(7,11,20,.72), rgba(7,11,20,.92)),
    url("/otel-hizmetleri/assets/img/hero-otel.webp") center/cover no-repeat;
  filter: saturate(1.05);
}

.oh-hero__wrap{
  position:relative;
  display:grid;
  grid-template-columns: 1.35fr .85fr;
  gap: 22px;
  align-items: stretch;
}

.oh-badge{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding: 8px 12px;
  background: rgba(255,255,255,.06);
  border:1px solid var(--oh-line);
  border-radius: 999px;
  font-size: 13px;
  color: var(--oh-muted);
}

.oh-hero h1{
  margin: 14px 0 10px;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -.3px;
}

.oh-lead{
  color: var(--oh-muted);
  font-size: 16px;
  line-height: 1.6;
  max-width: 62ch;
}

.oh-hero__cta{
  display:flex;
  gap:12px;
  margin: 18px 0 14px;
  flex-wrap: wrap;
}

.oh-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid var(--oh-line);
  text-decoration:none;
  color: var(--oh-text);
  background: rgba(255,255,255,.05);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
  cursor:pointer;
}
.oh-btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,.07); }
.oh-btn--primary{
  background: linear-gradient(135deg, rgba(255,122,24,.95), rgba(255,122,24,.70));
  border-color: rgba(255,122,24,.5);
  color:#10131b;
  font-weight:700;
}
.oh-btn--ghost{
  background: rgba(255,255,255,.04);
}
.oh-btn--full{ width: 100%; }

.oh-hero__bullets{
  margin: 14px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap: 8px;
  color: var(--oh-muted);
}
.oh-hero__bullets li{
  padding-left: 14px;
  position: relative;
}
.oh-hero__bullets li::before{
  content:"";
  width:6px; height:6px;
  border-radius:50%;
  background: var(--oh-accent);
  position:absolute;
  left:0; top: 9px;
}

.oh-hero__card{
  position:relative;
  background: rgba(12,18,34,.72);
  border: 1px solid var(--oh-line);
  border-radius: var(--oh-radius);
  box-shadow: var(--oh-shadow);
  padding: 18px;
  backdrop-filter: blur(8px);
}

.oh-miniTitle{ font-weight:800; letter-spacing:.2px; }
.oh-miniText{ color: var(--oh-muted); margin-top:6px; }

.oh-miniGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 14px 0 16px;
}
.oh-miniItem{
  background: rgba(255,255,255,.04);
  border: 1px solid var(--oh-line);
  border-radius: 14px;
  padding: 10px;
}
.oh-miniLabel{ color: var(--oh-muted); font-size: 12px; }
.oh-miniValue{ font-weight:700; margin-top:4px; }

.oh-trust{
  padding: 22px 0;
}
.oh-trust__grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.oh-trust__item{
  background: rgba(255,255,255,.04);
  border: 1px solid var(--oh-line);
  border-radius: 16px;
  padding: 14px;
}
.oh-trust__title{ font-weight:800; margin-bottom:6px; }
.oh-trust__text{ color: var(--oh-muted); line-height:1.55; font-size: 14px; }

.oh-section{ padding: 44px 0; }
.oh-section--alt{
  background: linear-gradient(180deg, rgba(255,255,255,.03), transparent 60%);
  border-top: 1px solid var(--oh-line);
  border-bottom: 1px solid var(--oh-line);
}
.oh-section__head{
  margin-bottom: 18px;
}
.oh-section__head h2{
  margin:0 0 8px;
  font-size: 28px;
  letter-spacing:-.2px;
}
.oh-section__head p{
  margin:0;
  color: var(--oh-muted);
  line-height: 1.6;
}

.oh-tabs{
  display:flex;
  gap:10px;
  margin: 14px 0 16px;
}
.oh-tab{
  border-radius: 999px;
  padding: 10px 14px;
  border: 1px solid var(--oh-line);
  background: rgba(255,255,255,.04);
  color: var(--oh-text);
  cursor:pointer;
}
.oh-tab.is-active{
  border-color: rgba(255,122,24,.45);
  background: rgba(255,122,24,.15);
}

.oh-panel{ display:none; }
.oh-panel.is-active{ display:block; }

.oh-cards{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.oh-card{
  background: rgba(255,255,255,.04);
  border: 1px solid var(--oh-line);
  border-radius: 18px;
  overflow:hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.oh-card img{
  width:100%;
  height: 150px;
  object-fit: cover;
  display:block;
}
.oh-card__body{ padding: 14px; }
.oh-card__body h3{ margin:0 0 10px; font-size: 16px; }
.oh-card__body ul{
  margin:0;
  padding-left: 18px;
  color: var(--oh-muted);
  line-height:1.6;
  font-size: 14px;
}

.oh-steps{
  margin: 0;
  padding: 0;
  list-style:none;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.oh-steps li{
  border: 1px solid var(--oh-line);
  background: rgba(255,255,255,.04);
  border-radius: 18px;
  padding: 14px;
  display:flex;
  gap: 12px;
}
.oh-step__no{
  width:34px; height:34px;
  border-radius: 12px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,122,24,.18);
  border: 1px solid rgba(255,122,24,.35);
  font-weight:900;
}
.oh-step__content h3{ margin:0 0 6px; font-size: 16px; }
.oh-step__content p{ margin:0; color: var(--oh-muted); line-height:1.55; font-size:14px; }

.oh-gallery{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.oh-gallery img{
  width:100%;
  height: 170px;
  object-fit: cover;
  border-radius: 16px;
  border: 1px solid var(--oh-line);
  display:block;
}

.oh-faq{
  display:grid;
  gap: 10px;
}
.oh-faq__item{
  border: 1px solid var(--oh-line);
  background: rgba(255,255,255,.04);
  border-radius: 16px;
  overflow:hidden;
}
.oh-faq__q{
  width:100%;
  text-align:left;
  padding: 14px;
  background: transparent;
  border:0;
  color: var(--oh-text);
  cursor:pointer;
  font-weight:800;
}
.oh-faq__a{
  padding: 0 14px;
  color: var(--oh-muted);
  line-height:1.6;
  max-height:0px;
  overflow:hidden;
  transition: max-height .18s ease;
}
.oh-faq__item.is-open .oh-faq__a{
  padding-bottom: 14px;
}

.oh-form{
  border: 1px solid var(--oh-line);
  background: rgba(255,255,255,.04);
  border-radius: 18px;
  padding: 16px;
}
.oh-form__grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.oh-field label{
  display:block;
  font-size: 13px;
  color: var(--oh-muted);
  margin-bottom: 6px;
}
.oh-field input,
.oh-field select,
.oh-field textarea{
  width:100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid var(--oh-line);
  background: rgba(7,11,20,.55);
  color: var(--oh-text);
  outline:none;
}
.oh-field--full{ grid-column: 1 / -1; }
.oh-form__footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.oh-form__note{
  color: var(--oh-muted);
  font-size: 13px;
}

.oh-hp{ position:absolute; left:-9999px; opacity:0; }

.oh-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index: 9999;
}
.oh-modal.is-open{ display:block; }
.oh-modal__backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.55);
}
.oh-modal__box{
  position:relative;
  width: min(520px, calc(100% - 28px));
  margin: 12vh auto 0;
  background: rgba(12,18,34,.92);
  border: 1px solid var(--oh-line);
  border-radius: 18px;
  padding: 18px;
  box-shadow: var(--oh-shadow);
}
.oh-modal__box h3{ margin:0 0 8px; }
.oh-modal__box p{ margin:0 0 14px; color: var(--oh-muted); }

.oh-stickyCta{
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 999;
  padding: 12px 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(255,122,24,.95), rgba(255,122,24,.72));
  color:#10131b;
  text-decoration:none;
  font-weight:900;
  border: 1px solid rgba(255,122,24,.45);
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
}













.oh-breadcrumbs{

background:#0b1220;

border-bottom:1px solid rgba(255,255,255,0.05);

padding:12px 0;

}

.oh-breadcrumb-list{

display:flex;

align-items:center;

gap:8px;

list-style:none;

padding:0;

margin:0;

font-size:14px;

}

.oh-breadcrumb-list a{

color:#a0a7b5;

text-decoration:none;

}

.oh-breadcrumb-list a:hover{

color:#ff7a18;

}

.oh-breadcrumb-list .active{

color:#ffffff;

font-weight:600;

}

.separator{

color:#666;

}








/* ROLES */

.oh-roles{

padding:70px 0;

}

.oh-roles-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:30px;

}

.oh-role-card{

background:#0f172a;

border-radius:16px;

overflow:hidden;

box-shadow:0 10px 40px rgba(0,0,0,.35);

transition:.3s;

}

.oh-role-card:hover{

transform:translateY(-6px);

}

.oh-role-card img{

width:100%;

height:230px;

object-fit:cover;

}

.oh-role-content{

padding:25px;

}

.oh-role-content h3{

margin-bottom:15px;

font-size:22px;

}

.oh-role-content ul{

list-style:none;

padding:0;

margin:0;

}

.oh-role-content li{

display:flex;

align-items:center;

gap:10px;

margin-bottom:10px;

color:#cbd5e1;

}

.oh-role-content li img{

width:18px;

}


/* PROCESS */

.oh-process{

padding:80px 0;

background:#0b1220;

}

.oh-process-grid{

display:grid;

grid-template-columns:repeat(5,1fr);

gap:25px;

margin-top:40px;

}

.oh-process-card{

background:#111827;

padding:25px;

border-radius:14px;

text-align:center;

transition:.3s;

box-shadow:0 10px 40px rgba(0,0,0,.3);

}

.oh-process-card:hover{

transform:translateY(-6px);

}

.oh-process-icon img{

width:38px;

margin-bottom:15px;

}

.oh-process-card h3{

font-size:18px;

margin-bottom:10px;

}

.oh-process-card p{

font-size:14px;

color:#cbd5e1;

line-height:1.6;

}