:root{
--ivory:#f8f1e9;
--paper:#fffaf4;
--ink:#2b0718;
--wine:#6f173f;
--wine-dark:#3d0a21;
--gold:#c59a4c;
--muted:#786d70;
--line:rgba(111,23,63,.15);
--shadow:0 34px 90px rgba(43,7,24,.14)
}

*{
margin:0;
padding:0;
box-sizing:border-box
}

html{
scroll-behavior:smooth
}

body{
font-family:'Inter',sans-serif;
color:var(--ink);
background:var(--ivory);
overflow-x:hidden
}

a{
text-decoration:none;
color:inherit
}

.header{
position:fixed;
top:0;
left:0;
width:100%;
height:112px;
padding:0 6%;
display:grid;
grid-template-columns:260px 1fr;
align-items:center;
z-index:1000;
background:rgba(248,241,233,.88);
backdrop-filter:blur(18px);
border-bottom:1px solid var(--line)
}

.logo{
height:112px;
display:flex;
align-items:center
}

.logo img{
height:138px;
width:auto
}

.header nav{
justify-self:end;
display:flex;
gap:34px;
font-size:14px;
font-weight:800
}

.header nav a{
position:relative
}

.header nav a::before{
content:"";
position:absolute;
left:0;
top:-15px;
width:100%;
height:1px;
background:var(--gold);
transform:scaleX(0);
transition:.25s
}

.header nav a:hover::before,.header nav a.active::before{
transform:scaleX(1)
}

#menu-toggle{
display:none
}

.hamburger{
display:none
}

.page-hero{
min-height:88vh;
padding:170px 6% 90px;
display:grid;
grid-template-columns:1fr .86fr;
gap:70px;
align-items:center;
background:radial-gradient(circle at 86% 20%,rgba(111,23,63,.14),transparent 28%),linear-gradient(135deg,#fffaf4,#f4e8df 70%,#ead8d9)
}

.hero-text span,.label{
display:inline-block;
color:var(--wine);
text-transform:uppercase;
letter-spacing:4px;
font-size:12px;
font-weight:900;
margin-bottom:22px
}

.page-hero h1{
font-family:'Playfair Display',serif;
font-size:clamp(54px,6vw,92px);
line-height:.98;
letter-spacing:-2px;
max-width:900px
}

.page-hero p{
max-width:700px;
margin-top:26px;
color:var(--muted);
line-height:1.9;
font-size:18px
}

.hero-card{
position:relative;
min-height:580px
}

.hero-card .image{
position:absolute;
inset:0;
border-radius:0 220px 0 0;
background:linear-gradient(180deg,rgba(61,10,33,.08),rgba(61,10,33,.42)),url('images/avukatlik.jpg');
background-size:cover;
background-position:center right;
box-shadow:var(--shadow);
border:1px solid rgba(197,154,76,.35)
}

.note{
position:absolute;
left:-50px;
bottom:42px;
width:330px;
padding:28px;
border-radius:0 34px 34px 0;
background:rgba(255,250,244,.94);
box-shadow:var(--shadow)
}

.note strong{
display:block;
color:var(--muted);
margin-bottom:8px
}

.note em{
font-family:'Playfair Display',serif;
font-style:normal;
color:var(--wine);
font-size:32px
}

.intro{
display:grid;
grid-template-columns:160px 1.1fr .9fr;
gap:60px;
align-items:start;
padding:115px 6%;
background:var(--paper);
border-top:1px solid var(--line);
border-bottom:1px solid var(--line)
}

.number{
font-family:'Playfair Display',serif;
font-size:130px;
line-height:.8;
color:rgba(111,23,63,.1)
}

h2{
font-family:'Playfair Display',serif;
font-size:clamp(36px,4.2vw,64px);
line-height:1.06;
letter-spacing:-.8px
}

.intro p{
color:var(--muted);
line-height:2;
font-size:17px
}

.values,.process,.statement,.cta{
padding:110px 6%
}

.section-head{
max-width:900px;
margin-bottom:50px
}

.value-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px
}

.value-grid article{
min-height:260px;
padding:32px;
background:rgba(255,250,244,.72);
border:1px solid var(--line);
border-radius:30px;
box-shadow:0 18px 50px rgba(43,7,24,.06);
transition:.3s
}

.value-grid article:hover{
transform:translateY(-8px);
background:var(--wine);
color:white;
box-shadow:var(--shadow)
}

.value-grid span{
font-family:'Playfair Display',serif;
font-size:34px;
color:var(--gold)
}

.value-grid h3{
margin-top:48px;
font-size:24px
}

.value-grid p{
margin-top:12px;
color:var(--muted);
line-height:1.7
}

.value-grid article:hover p{
color:rgba(255,255,255,.76)
}

.statement{
background:var(--wine-dark);
color:white;
text-align:center
}

.statement .label{
color:var(--gold)
}

blockquote{
max-width:1100px;
margin:0 auto;
font-family:'Playfair Display',serif;
font-size:clamp(34px,4.3vw,68px);
line-height:1.12
}

.timeline{
display:grid;
grid-template-columns:repeat(4,1fr);
border-top:1px solid var(--line);
border-left:1px solid var(--line)
}

.timeline article{
padding:32px;
min-height:240px;
border-right:1px solid var(--line);
border-bottom:1px solid var(--line);
background:var(--paper)
}

.timeline b{
font-family:'Playfair Display',serif;
color:var(--gold);
font-size:34px
}

.timeline h3{
margin-top:52px;
font-size:23px;
color:var(--wine)
}

.timeline p{
margin-top:12px;
color:var(--muted);
line-height:1.7
}

.cta{
background:linear-gradient(135deg,#fffaf4,#eadcdf);
display:flex;
align-items:center;
justify-content:space-between;
gap:40px
}

.cta h2{
max-width:800px
}

.cta a{
min-height:56px;
padding:0 34px;
border-radius:999px;
background:var(--wine);
color:white;
font-weight:900;
display:inline-flex;
align-items:center
}

footer{
padding:54px 6%;
background:var(--wine-dark);
color:white
}

footer img{
width:230px;
filter:brightness(0) invert(1)
}

footer p{
margin-top:18px;
color:rgba(255,255,255,.6)
}

@media(max-width:1100px){
.page-hero,.intro,.cta{
grid-template-columns:1fr
}

.hero-card{
min-height:500px
}

.note{
left:30px
}

.value-grid,.timeline{
grid-template-columns:repeat(2,1fr)
}

.cta{
display:grid
}

}

@media(max-width:760px){
.header{
height:92px;
grid-template-columns:1fr auto;
padding:0 5%
}

.logo{
height:92px
}

.logo img{
height:88px
}

.hamburger{
display:flex;
flex-direction:column;
gap:6px;
width:42px;
height:42px;
align-items:center;
justify-content:center;
border:1px solid var(--line);
border-radius:50%
}

.hamburger span{
width:18px;
height:2px;
background:var(--wine);
display:block
}

.header nav{
position:absolute;
top:92px;
left:0;
width:100%;
display:grid;
gap:0;
background:var(--paper);
transform:translateY(-135%);
opacity:0;
pointer-events:none;
transition:.3s;
border-bottom:1px solid var(--line)
}

.header nav a{
padding:18px 6%;
border-top:1px solid var(--line)
}

#menu-toggle:checked ~ nav{
transform:translateY(0);
opacity:1;
pointer-events:auto
}

.page-hero{
padding:125px 5% 70px
}

.page-hero h1{
font-size:48px
}

.hero-card{
min-height:390px
}

.hero-card .image{
border-radius:0 150px 0 0
}

.note{
left:18px;
bottom:20px;
width:calc(100% - 36px)
}

.intro,.values,.process,.statement,.cta{
padding:76px 5%
}

.number{
font-size:92px
}

.value-grid,.timeline{
grid-template-columns:1fr
}

footer img{
width:180px
}

}

/* ===== PREMIUM FOOTER ===== */

.site-footer{
background:var(--wine-dark);

  color:white;

  padding:70px 6% 26px;

  border-top:1px solid rgba(197,154,76,.25);

}

.footer-grid{
display:grid;

  grid-template-columns:1.35fr 1fr 1fr .85fr;

  gap:44px;

  padding-bottom:48px;

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

}

.footer-brand img{
width:240px;

  height:auto;

  display:block;

  filter:none !important;

  margin-bottom:18px;

  background:rgba(255,255,255,.94);

  padding:12px 16px;

  border-radius:18px;

}

.site-footer h4{
color:var(--gold);

  font-size:14px;

  text-transform:uppercase;

  letter-spacing:2px;

  margin-bottom:18px;

}

.site-footer p,
.site-footer a{
display:block;

  color:rgba(255,255,255,.72);

  line-height:1.85;

  font-size:14px;

}

.site-footer a{
margin-bottom:9px;

  transition:.25s;

}

.site-footer a:hover{
color:var(--gold);

  padding-left:6px;

}

.footer-bottom{
padding-top:22px;

}

.footer-bottom p{
color:rgba(255,255,255,.52);

  font-size:13px;

}

@media(max-width:1100px){
.footer-grid{
grid-template-columns:1fr 1fr;

  
}

}

@media(max-width:760px){
.site-footer{
padding:55px 5% 24px;

  
}

  .footer-grid{
grid-template-columns:1fr;

    gap:32px;

  
}

  .footer-brand img{

    width:210px;

  
}

}

