
:root {
 --ink: #111827;
 --navy: #24272c;
 --navy-2: #30343a;
 --paper: #ffffff;
 --soft: #fff3f8;
 --line: #f1d5e2;
 --muted: #4b5563;
 --copper: #c0004d;
 --gold: #71002d;
 --white: #ffffff;
 --radius: 8px;
 --shadow: 0 24px 60px rgba(7, 19, 31,.12);
 --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
 margin: 0;
 font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
 color: var(--ink);
 background: var(--white);
 line-height: 1.55;
 overflow-x: hidden;
}.skip-link {
 position: fixed;
 top: 12px;
 left: 12px;
 z-index: 9999;
 padding: 10px 14px;
 background: var(--copper);
 color: var(--white);
 border-radius: 4px;
 transform: translateY(-160%);
 transition: transform.2s ease;
}.skip-link:focus {
 transform: translateY(0);
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
p { color: var(--muted); margin: 0; }
h1, h2, h3 { margin: 0; line-height: 1.05; letter-spacing: 0; }
h1 { font-size: clamp(30px, 4.2vw, 55px); max-width: 820px; }
h2 { font-size: clamp(30px, 4vw, 58px); }
h3 { font-size: 22px; }

main { overflow: hidden; }.card,.cta,.form,.menu,.split > *,.footer-grid > * { min-width: 0; }
h1, h2, h3, p, a, li, input, select, textarea { overflow-wrap: break-word; }.container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }.topbar {
 position: sticky;
 top: 0;
 z-index: 50;
 background: rgba(255,255,255,.94);
 backdrop-filter: blur(18px);
 border-bottom: 1px solid rgba(17,24,39,.08);
}.nav {
 height: 76px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 24px;
}.brand { display: flex; align-items: center; gap: 12px; font-weight: 900; letter-spacing:.02em; }.brand-mark {
 width: 38px; height: 38px; border-radius: 8px;
 display: grid; place-items: center;
 background: var(--copper); color: var(--white); font-weight: 900;
}.brand span:last-child { max-width: 180px; line-height: 1.05; }.menu { display: flex; gap: 22px; align-items: center; font-size: 14px; color: #364152; }.menu a:hover { color: var(--copper); }.social-link {
 display: inline-flex;
 align-items: center;
 gap: 7px;
}.social-link.icon {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 fill: none;
 stroke-width: 2;
 stroke-linecap: round;
 stroke-linejoin: round;
 flex: 0 0 auto;
}.menu.social-link {
 color: var(--copper);
 font-weight: 800;
}.menu-toggle { display: none; border: 1px solid var(--line); background: var(--white); padding: 10px 12px; border-radius: 8px; }.btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 46px;
 padding: 0 18px;
 border-radius: 8px;
 font-weight: 800;
 border: 1px solid transparent;
 transition: transform.2s ease, background.2s ease, border-color.2s ease;
}.btn:hover { transform: translateY(-2px); }.btn-primary { background: var(--copper); color: var(--white); }.btn-dark { background: var(--navy); color: var(--white); }.btn-ghost { border-color: rgba(255,255,255,.3); color: var(--white); }.btn-light { border-color: var(--line); background: var(--white); color: var(--ink); }.hero.btn-ghost { border-color: var(--copper); color: var(--navy); background: var(--white); }.hero {
 min-height: calc(100vh - 76px);
 display: grid;
 align-items: center;
 background: var(--white) url("/assets/home-slide.webp") right center / auto 100% no-repeat;
 color: var(--white);
 padding: 74px 0 42px;
 text-align: left;
}.hero.container {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 text-align: left;
 background: rgba(255,255,255,.88);
 border: 1px solid rgba(255,255,255,.94);
 border-radius: 8px;
 padding: 34px;
 width: min(680px, calc(100% - 40px));
 margin-left: max(20px, calc((100% - var(--max)) / 2));
 margin-right: auto;
}.hero.container > * {
 max-width: 100%;
}.hero h1 {
 color: var(--navy);
}.hero h1 span {
 display: block;
}.hero p { color: #4b5563; font-size: 18px; max-width: 650px; }.eyebrow {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 color: var(--gold);
 font-weight: 850;
 letter-spacing:.08em;
 text-transform: uppercase;
 font-size: 12px;
 margin-bottom: 18px;
}.eyebrow::before { content: ""; width: 38px; height: 2px; background: currentColor; }.hero-actions,.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }.hero-actions { max-width: 100%; justify-content: flex-start; }.hero-proof {
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 gap: 1px;
 margin-top: 70px;
 background: var(--white);
 border: 1px solid var(--line);
 max-width: 100%;
}.proof-item { padding: 22px; background: var(--white); }.proof-item strong { display: block; font-size: 26px; color: var(--navy); }.proof-item span { color: #566174; font-size: 13px; }

section { padding: 92px 0; }.section-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 36px; }.section-head p { max-width: 560px; }.grid { display: grid; gap: 18px; }.grid-3 { grid-template-columns: repeat(3, 1fr); }.grid-4 { grid-template-columns: repeat(4, 1fr); }.card {
 border: 1px solid var(--line);
 border-radius: var(--radius);
 background: var(--white);
 padding: 28px;
 min-height: 100%;
 transition: transform.2s ease, box-shadow.2s ease, border-color.2s ease;
}.card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--copper); }.card.num { color: var(--copper); font-weight: 900; font-size: 13px; margin-bottom: 18px; display: block; }.card p { margin-top: 12px; }.compact-card { min-height: 190px; }.trust-grid { gap: 14px; }.home-portfolio {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 5px;
}.home-portfolio a {
 aspect-ratio: 1 / 1;
 overflow: hidden;
 background: var(--white);
}.home-portfolio a:nth-child(n+4) { display: none; }.home-portfolio img {
 width: 100%;
 height: 100%;
 object-fit: contain;
 background: #fff;
 display: block;
}.trust-note {
 margin-top: 22px;
 padding: 18px 20px;
 border-left: 4px solid var(--copper);
 background: var(--soft);
 color: #374151;
}.blog-section { padding-top: 78px; }.blog-tags {
 margin-bottom: 30px;
 padding-bottom: 4px;
}.blog-grid {
 grid-template-columns: repeat(auto-fit, minmax(285px, 1fr));
 align-items: stretch;
}.blog-card {
 display: flex;
 flex-direction: column;
 min-height: 280px;
}.blog-card h3 {
 font-size: 21px;
 line-height: 1.18;
}.blog-card p {
 font-size: 15px;
}.blog-card.read-more {
 margin-top: auto;
 padding-top: 20px;
 color: var(--copper);
 font-weight: 850;
}.tag-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }.tag {
 border: 1px solid var(--line);
 border-radius: 999px;
 padding: 8px 12px;
 font-size: 13px;
 color: #4b5563;
 background: var(--white);
}.band { background: var(--soft); }.band p,.band li { color: #20242b; }.band.eyebrow { color: #5f0026; }.dark {
 background: var(--navy);
 color: var(--white);
}.dark p { color: rgba(255,255,255,.88); }.split { display: grid; grid-template-columns: 1.05fr.95fr; gap: 48px; align-items: center; }.visual-panel {
 min-height: 520px;
 border-radius: 8px;
 background: var(--white) url("/assets/hero-packaging.webp") center / cover no-repeat;
 box-shadow: var(--shadow);
}.process { counter-reset: step; }.process.card { position: relative; padding-top: 62px; }.process.card::before {
 counter-increment: step;
 content: "0" counter(step);
 position: absolute; top: 24px; left: 28px;
 color: var(--copper); font-weight: 900;
}.portfolio-card {
 min-height: 380px;
 display: flex;
 flex-direction: column;
 justify-content: flex-end;
 color: var(--navy);
 background: var(--white) url("/assets/hero-packaging.webp") center / cover no-repeat;
}.portfolio-card:nth-child(2n) { background-position: center left; }.portfolio-card:nth-child(3n) { background-position: center right; }.portfolio-card p { color: #3d4452; }.portfolio-hero.actions {
 display: none;
}.portfolio-section {
 padding: 46px 0;
 background: #fff;
}.portfolio-section +.portfolio-section {
 border-top: 1px solid var(--line);
}.portfolio-section h2 {
 margin-bottom: 20px;
 font-size: clamp(26px, 3vw, 42px);
}.portfolio-tabs {
 display: flex;
 flex-wrap: wrap;
 gap: 5px;
 margin-bottom: 5px;
}.portfolio-tab {
 border: 1px solid var(--line);
 border-radius: 999px;
 background: var(--white);
 color: var(--muted);
 padding: 12px 22px;
 font: inherit;
 font-weight: 600;
 cursor: pointer;
 transition: all.15s ease;
}.portfolio-tab:hover { border-color: var(--copper); color: var(--copper); }.portfolio-tab.active {
 background: var(--soft);
 border-color: var(--copper);
 color: var(--copper);
 font-weight: 700;
}.portfolio-gallery {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
 gap: 5px;
}.portfolio-photo.is-hidden {
 display: none;
}.portfolio-photo {
 margin: 0;
 overflow: hidden;
 border: 0;
 border-radius: 0;
 background: #fff;
 display: flex;
 flex-direction: column;
}.portfolio-photo img {
 display: block;
 width: 100%;
 aspect-ratio: 1 / 1;
 height: auto;
 object-fit: contain;
 background: #fff;
}.portfolio-photo figcaption {
 display: grid;
 gap: 6px;
 padding: 12px 14px 14px;
 border-top: 1px solid var(--line);
 background: #fff;
}.portfolio-photo figcaption strong {
 font-size: 14px;
 line-height: 1.25;
 color: var(--ink);
}.portfolio-photo figcaption span {
 font-size: 13px;
 line-height: 1.45;
 color: var(--muted);
}.page-hero {
 padding: 70px 0 56px;
 background: var(--navy);
 color: var(--white);
 text-align: left;
}.page-hero p { color: rgba(255,255,255,.88); font-size: 18px; max-width: 760px; margin-top: 20px; }.breadcrumb { font-size: 13px; color: rgba(255,255,255,.78); margin-bottom: 28px; }.breadcrumb a { color: var(--gold); }.content-list { margin: 24px 0 0; padding: 0; list-style: none; display: grid; gap: 12px; }.content-list li {
 padding: 14px 16px;
 border: 1px solid var(--line);
 border-radius: 8px;
 background: var(--white);
 color: #344054;
}.article-wrap {
 display: grid;
 grid-template-columns: minmax(0, 760px) 320px;
 gap: 52px;
 align-items: start;
}.article-body {
 font-size: 18px;
}.article-body.lead {
 font-size: 22px;
 color: #344054;
 margin-bottom: 30px;
}.ozet-cevap {
 padding: 18px 20px;
 margin-bottom: 24px;
 border-left: 4px solid var(--copper);
 background: #f7f8fb;
 color: #20242b;
}.article-body h2 {
 font-size: clamp(26px, 3vw, 38px);
 margin: 42px 0 16px;
}.article-body p {
 margin: 0 0 20px;
 color: #344054;
}.article-body a,.answer-band a,.trust-note a,.page-hero p a {
 color: #9f003f;
 text-decoration: underline;
 text-decoration-thickness: 1.5px;
 text-underline-offset: 3px;
}.article-body a:hover,.answer-band a:hover,.trust-note a:hover,.page-hero p a:hover {
 color: #71002d;
}.article-body ul {
 margin: 0 0 28px;
 padding-left: 22px;
 color: #344054;
}.article-body li {
 margin: 9px 0;
}.article-meta {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 margin-top: 24px;
}.article-sidebar {
 position: sticky;
 top: 98px;
 display: grid;
 gap: 16px;
}.article-sidebar.card {
 padding: 22px;
}.article-sidebar h3 {
 font-size: 18px;
}.faq details {
 border-top: 1px solid var(--line);
 padding: 20px 0;
}.faq summary { cursor: pointer; font-weight: 850; font-size: 18px; }.faq p { margin-top: 10px; max-width: 840px; }.cta {
 background: var(--navy);
 color: var(--white);
 padding: 68px;
 border-radius: 8px;
 display: grid;
 grid-template-columns: 1fr auto;
 gap: 28px;
 align-items: center;
}.cta p { color: rgba(255,255,255,.88); margin-top: 14px; max-width: 720px; }.form {
 display: grid;
 gap: 14px;
}.form input,.form select,.form textarea {
 width: 100%;
 border: 1px solid var(--line);
 border-radius: 8px;
 padding: 14px 15px;
 font: inherit;
 background: var(--white);
}.form textarea { min-height: 150px; resize: vertical; }.footer {
 background: var(--navy);
 color: var(--white);
 padding: 68px 0 28px;
}.footer p,.footer a { color: rgba(255,255,255,.86); }.footer li a:not(.brand),.footer.email-copy {
 text-decoration: underline;
 text-decoration-thickness: 2px;
 text-underline-offset: 3px;
 font-weight: 850;
 border-bottom: 2px solid currentColor;
 padding-bottom: 1px;
}.footer a[href^="tel:"],.footer.email-copy {
 display: inline-block;
 background: rgba(255,255,255,.08);
 border-radius: 4px;
 padding: 1px 4px 2px;
}.footer li a:not(.brand):hover {
 color: var(--white);
}.footer.footer-social {
 color: #fff;
 font-weight: 800;
}.footer.footer-social:hover { color: var(--copper); }.footer-grid { display: grid; grid-template-columns: 1.2fr.8fr 1fr 1fr; gap: 32px; }.footer h3 { font-size: 15px; margin-bottom: 16px; }.footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; font-size: 14px; }.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 42px; padding-top: 24px; font-size: 13px; }.email-copy {
 appearance: none;
 border: 0;
 padding: 0;
 background: transparent;
 color: rgba(255,255,255,.86);
 font: inherit;
 text-align: left;
 cursor: pointer;
}.email-copy:hover { color: var(--white); }.whatsapp {
 position: fixed;
 right: 18px;
 bottom: 18px;
 z-index: 60;
 background: var(--copper);
 color: var(--white);
 box-shadow: 0 14px 30px rgba(230,0,92,.24);
 width: 58px;
 height: 58px;
 min-height: 58px;
 padding: 0;
 border-radius: 50%;
 flex: 0 0 auto;
}.whatsapp svg {
 width: 29px;
 height: 29px;
 fill: currentColor;
}.seo-deep-section.article-body {
 max-width: 1120px;
}.seo-deep-section.grid {
 margin: 28px 0;
}.author-box {
 margin-top: 34px;
 padding: 22px;
 border: 1px solid var(--line);
 background: var(--soft);
}.author-box strong {
 display: block;
 color: var(--navy);
 margin-bottom: 8px;
}.author-box p {
 margin: 0;
 font-size: 15px;
}.answer-band {
 padding: 48px 0;
 background: var(--soft);
 border-top: 1px solid var(--line);
 border-bottom: 1px solid var(--line);
}.answer-band.container {
 max-width: 980px;
}.answer-band h2 {
 font-size: clamp(24px, 3vw, 36px);
 margin-bottom: 14px;
}.answer-band p {
 font-size: 18px;
 color: #374151;
}.portfolio-cases {
 background: var(--white);
}.portfolio-cases.card p + p {
 margin-top: 10px;
}

@media (max-width: 940px) {.menu {
 display: none;
 position: absolute;
 left: 20px; right: 20px; top: 76px;
 flex-direction: column;
 align-items: stretch;
 background: var(--white);
 padding: 18px;
 border: 1px solid var(--line);
 box-shadow: var(--shadow);
 }.menu.open { display: flex; }.menu-toggle { display: inline-flex; }.hero { min-height: auto; padding: 76px 0 36px; background-position: 64% center; background-size: cover; }.hero.container { margin-left: auto; margin-right: auto; padding: 26px; }.hero.container > *,.hero-actions,.hero-proof { max-width: 100%; }.hero-proof,.grid-3,.grid-4,.split,.footer-grid,.cta,.article-wrap { grid-template-columns: 1fr; }.home-portfolio { grid-template-columns: 1fr; }.home-portfolio a { aspect-ratio: 1 / 1; }.section-head { display: block; }.section-head p { margin-top: 14px; }.visual-panel { min-height: 340px; }.article-sidebar { position: static; }
}

@media (max-width: 620px) {.container { width: min(100% - 28px, var(--max)); }.nav { height: 68px; }.brand span:last-child { max-width: 150px; font-size: 13px; }.hero, section,.page-hero { padding-left: 0; padding-right: 0; }
 section { padding-top: 66px; padding-bottom: 66px; }.card,.proof-item { padding: 20px; }.cta { padding: 28px; }.whatsapp { left: 14px; right: 14px; bottom: 14px; }.whatsapp { left: auto; right: 14px; width: 56px; height: 56px; min-height: 56px; }.hero-actions.btn,.actions.btn { width: 100%; }
 h1 { font-size: clamp(29px, 9vw, 42px); }
}.table-scroll { overflow-x: auto; margin: 20px 0; }.table-scroll table { width: 100%; border-collapse: collapse; min-width: 560px; }.table-scroll th,.table-scroll td { border: 1px solid var(--line); padding: 12px 14px; text-align: left; }.table-scroll th { background: var(--soft); color: var(--dark); }.post-date,.post-meta { color: var(--muted); font-size: 0.95rem; margin-top: 10px; }.sticky-cta{display:none;}
@media (max-width: 768px){.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:10px;align-items:center;padding:10px 14px;background:var(--white);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(7,19,31,.12);transform:translateY(110%);transition:transform.25s ease;}.sticky-cta.visible{transform:translateY(0);}.sticky-cta.btn-primary{flex:1;text-align:center;}.sticky-cta.wa-mini{width:44px;height:44px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;flex:none;}.sticky-cta.wa-mini svg{width:24px;height:24px;fill:#fff;}.btn.whatsapp{display:none;}
}
