/* Shared OSKO site design. This stylesheet loads after page-specific styles. */
:root {
  --osko-ink: #252b33;
  --osko-copy: #4b5563;
  --osko-gold: #ae8135;
  --osko-line: #e8e6e1;
  --osko-soft: #faf9f6;
}

html, body { background: #fff; color: var(--osko-ink); }
body { font-family: var(--font-sans); overflow-x: clip; }
.container,
.site-header .container,
.projects-page-wrapper .container,
.detail-page-wrapper .container {
  width: 100%;
  max-width: none;
  padding-left: 5.5vw;
  padding-right: 5.5vw;
}

/* One header across the whole site */
.site-header,
[data-theme="light"] .site-header {
  height: 70px;
  background: rgba(255,255,255,.98);
  border-bottom: 1px solid rgba(31,41,55,.08);
  box-shadow: 0 1px 5px rgba(23,30,39,.035);
}
.site-header.is-scrolled { box-shadow: 0 5px 20px rgba(23,30,39,.1); }
.site-header .brand-logo { display: flex; align-items: center; width: 220px; height: 70px; gap: 0; }
.site-header .brand-logo-image { display: block; width: 220px; height: 70px; object-fit: contain; }
.site-header .brand-icon-svg { width: 55px; height: 55px; }
.site-header .brand-name { font-size: 27px; color: var(--osko-ink); }
.site-header .brand-sub { color: var(--osko-gold); }
.site-header .main-nav { gap: clamp(14px, 2vw, 29px); }
.site-header .main-nav .nav-item a { color: #303844; font-size: 11px; font-weight: 500; letter-spacing: .15px; }
.site-header .main-nav .nav-item.active a { color: #1c242d; }
.site-header .main-nav .nav-item.active a::after { background: var(--osko-gold); }
.site-header .btn-header-contact,
[data-theme="light"] .site-header .btn-header-contact {
  min-height: 39px;
  background: #fff;
  border: 1px solid var(--osko-gold);
  border-radius: 3px;
  color: #76541f;
  box-shadow: none;
  font-size: 11px;
  letter-spacing: .6px;
}

/* Shared page surface and editorial headings */
.kurumsal-wrap, .news-wrap, .contact-page-wrap,
.services-page-wrapper, .projects-page-wrapper, .detail-page-wrapper {
  background: #fff;
  color: var(--osko-ink);
}
.kurumsal-wrap, .news-wrap, .contact-page-wrap { padding: 112px 0 68px; }
.osko-page-heading {
  position: relative;
  padding: 0 0 29px;
  margin-bottom: 30px;
  border-bottom: 1px solid var(--osko-line);
}
.osko-page-heading::after { content: ""; position: absolute; bottom: -1px; left: 0; width: 80px; height: 2px; background: var(--osko-gold); }
.subpage-eyebrow, .osko-page-heading .subpage-eyebrow {
  display: block;
  margin-bottom: 10px;
  color: var(--osko-gold);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 4px;
  text-transform: uppercase;
}
.osko-page-heading h1 {
  font-family: var(--font-serif);
  font-size: clamp(42px, 4.2vw, 60px);
  font-weight: 600;
  line-height: 1;
  color: var(--osko-ink);
  margin: 0 0 10px;
}
.osko-page-heading p { max-width: 690px; font-size: 14px; line-height: 1.55; color: var(--osko-copy); }

/* Consistent cards, labels and forms */
.story-title, .news-title, .office-name, .form-title, .s-section-heading,
.detail-section-title { color: var(--osko-ink); font-family: var(--font-serif); }
.story-title { font-size: 36px; }
.story-text, .vm-desc, .news-desc, .office-row, .form-sub { color: var(--osko-copy); }
.story-img-wrap, .vm-card, .news-card, .office-card, .contact-form-card,
.s-card-item, .p-card-item, .sidebar-card {
  background: #fff;
  border: 1px solid var(--osko-line);
  border-radius: 3px;
  box-shadow: 0 4px 16px rgba(30,38,47,.045);
}
.story-img-wrap { border-radius: 3px; }
.vm-card, .office-card, .contact-form-card { padding: 25px; }
.vm-tag, .news-tag, .office-city, .form-label { color: var(--osko-gold); }
.news-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.news-img-wrap { height: auto; aspect-ratio: 1.85; }
.news-body { padding: 18px; }
.news-title { font-size: 23px; }
.contact-grid { grid-template-columns: .9fr 1.1fr; gap: 28px; }
.form-input, .form-select, .form-textarea {
  background: #fff;
  border-color: #d9dee4;
  color: var(--osko-ink);
  border-radius: 3px;
}
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color: var(--osko-gold); }
.btn-gold, .btn-gold-action, .btn-sidebar-submit { background: linear-gradient(110deg,#e8ca83,#c89b4a); color: #242b31; }

/* Services follows the same hero and card rhythm as Projects */
.services-page-wrapper { padding-top: 70px; }
.s-breadcrumb-bar { display: none; }
.s-hero-section { height: 21.42vw; min-height: 280px; max-height: 340px; background-color: #fff; }
.s-hero-left { max-width: 540px; padding: 0; }
.s-hero-eyebrow { font-size: 11px; letter-spacing: 4px; color: var(--osko-gold); }
.s-hero-title { font-size: clamp(45px,4.2vw,60px); font-weight: 600; line-height: .98; }
.s-hero-title .title-dark { color: var(--osko-ink); }
.s-hero-title .title-gold { color: var(--osko-gold); }
.s-hero-desc { font-size: 14px; line-height: 1.4; color: var(--osko-copy); }
.s-grid-section { padding: 26px 0 38px; background: #fff; }
.s-grid-head { margin-bottom: 22px; }
.s-section-eyebrow { color: var(--osko-gold); letter-spacing: 4px; }
.s-cards-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.s-card-thumb { height: auto; aspect-ratio: 1.85; }
.s-card-body { min-height: 138px; padding: 15px; }
.s-card-title { font-size: 15px; }
.s-card-desc { color: var(--osko-copy); }
.s-card-link { color: var(--osko-gold); }
.s-process-section { background: #fff; border-color: var(--osko-line); padding: 35px 0; }
.s-bottom-banner { background: var(--osko-soft); border-top: 1px solid var(--osko-line); color: var(--osko-ink); }
.s-bottom-banner .s-banner-overlay { display: none; }
.s-banner-title, .s-bstat-val { color: var(--osko-ink); }
.s-banner-desc, .s-bstat-lbl, .s-banner-signature { color: var(--osko-copy); }

/* Existing reference layouts share the same top offset and spacing. */
.projects-page-wrapper, .detail-page-wrapper { padding-top: 70px; }
.page-project-detail .detail-breadcrumb-bar { top: 70px; }
.page-project-detail .detail-hero-section { background-color: #fff; background-size: cover; background-position: center 46%; }
@media (min-width: 992px) {
  .page-project-detail .detail-hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #fff 0%, #fff 29%, rgba(255,255,255,.96) 37%, rgba(255,255,255,.72) 45%, rgba(255,255,255,0) 61%);
    pointer-events: none;
  }
  .page-project-detail .detail-hero-section .container { position: relative; z-index: 1; }
}
.page-index .hero-section { padding-top: 70px; }
.page-index .projects-section { background: #fff; }
.p-card-thumb, .project-card-thumb-wrap { position: relative; }
.stock-image-note { position:absolute; right:9px; bottom:8px; z-index:3; padding:4px 7px; border-radius:2px; background:rgba(255,255,255,.9); color:#39424c; font-size:9px; font-weight:600; letter-spacing:.2px; }
.detail-stock-note { right:20px; bottom:12px; }

/* One footer across every page, including the homepage. */
.site-footer, [data-theme="light"] .site-footer {
  background: #fff;
  color: var(--osko-ink);
  border-top: 1px solid var(--osko-line);
  padding: 36px 0 24px;
}
.site-footer .footer-grid { margin-bottom: 30px; }
.site-footer .footer-col-title { color: var(--osko-gold); }
.site-footer .footer-col-desc, .site-footer .footer-links a,
.site-footer .footer-contact-item { color: var(--osko-copy); }
.site-footer .footer-bottom { border-color: var(--osko-line); color: #727b86; }
.mobile-footer, [data-theme="light"] .mobile-footer { background: #fff; border-top: 1px solid var(--osko-line); }
.mobile-sticky-bar, [data-theme="light"] .mobile-sticky-bar {
  background: rgba(255,255,255,.97);
  border-top: 1px solid #d7c59f;
  box-shadow: 0 -4px 17px rgba(18,26,35,.08);
}
.mobile-sticky-link, [data-theme="light"] .mobile-sticky-link { color: #6b7280; }
.mobile-sticky-link.active, [data-theme="light"] .mobile-sticky-link.active { color: var(--osko-gold); }

@media (max-width: 1050px) {
  .container, .site-header .container,
  .projects-page-wrapper .container, .detail-page-wrapper .container { padding-left: 30px; padding-right: 30px; }
  .site-header .brand-icon-svg { width: 46px; height: 46px; }
  .site-header .brand-name { font-size: 23px; }
  .site-header .main-nav { gap: 12px; }
  .site-header .main-nav .nav-item a { font-size: 9px; letter-spacing: .3px; }
}
@media (max-width: 991px) {
  .news-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .contact-grid { grid-template-columns: 1fr; }
  .s-cards-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .s-hero-section { height: 320px; min-height: 0; }
}
@media (max-width: 768px) {
  .container, .site-header .container,
  .projects-page-wrapper .container, .detail-page-wrapper .container { padding-left: 18px; padding-right: 18px; }
  .site-header, [data-theme="light"] .site-header { height: 64px; }
  .site-header .brand-logo { width: 185px; height: 64px; }
  .site-header .brand-logo-image { width: 185px; height: 64px; }
  .site-header .brand-icon-svg { width: 38px; height: 38px; }
  .site-header .brand-name { font-size: 20px; }
  .kurumsal-wrap, .news-wrap, .contact-page-wrap { padding-top: 94px; padding-bottom: 42px; }
  .osko-page-heading { padding-bottom: 20px; margin-bottom: 22px; }
  .osko-page-heading h1 { font-size: clamp(37px,10vw,48px); }
  .story-grid { gap: 20px; margin-bottom: 28px; }
  .story-img-wrap { height: 280px; }
  .vm-card, .office-card, .contact-form-card { padding: 19px; }
  .news-grid, .s-cards-grid { grid-template-columns: 1fr; }
  .services-page-wrapper, .projects-page-wrapper, .detail-page-wrapper { padding-top: 64px; }
  .s-hero-section { height: 340px; background-position: 65% center; }
  .s-hero-section::before { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.68); }
  .s-hero-section .container { position: relative; z-index: 1; }
  .s-hero-title { font-size: clamp(35px,10vw,47px); }
  .s-hero-desc { max-width: 330px; font-size: 12px; }
  .page-project-detail .detail-breadcrumb-bar { top: 64px; }
  .page-index .hero-section { padding-top: 64px; }
  .site-footer {
    display: block !important;
    padding: 34px 0 calc(88px + env(safe-area-inset-bottom, 0px));
  }
  .site-footer .footer-grid {
    grid-template-columns: 1fr;
    gap: 26px;
    margin-bottom: 30px;
  }
  .site-footer .footer-bottom {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 18px;
    line-height: 1.5;
  }
  .mobile-footer { display: none !important; }
}