*{box-sizing:border-box}
:root{
  --navy:#111b27;
  --navy-deep:#0e1722;
  --copper:#c79b7b;
  --copper-soft:#b98c6e;
  --line:rgba(199,155,123,.42);
  --text:#c7b3a5;
  --white:#d8c2b2;
}
html{scroll-behavior:smooth}
body{
  margin:0;
  background-color:#111b27;
  color:var(--text);
  font-family:"Manrope",Arial,sans-serif;
  font-weight:300;
  letter-spacing:.02em;
  min-height:100vh;
}
/* Sabit doku katmanı — background-attachment:fixed iOS Safari'de bozuk
   çalıştığı için arka plan ayrı bir sabit katmana taşındı. */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background-image:url("assets/studio-background.jpg");
  background-size:cover;
  background-position:center;
  z-index:0;
  pointer-events:none;
}
body>*{position:relative;z-index:1}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{width:min(860px,calc(100% - 96px));margin:0 auto}
.site-header{
  padding-top:48px;
  text-align:center;
}
.brand{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  width:auto;
  height:auto;
  color:var(--copper);
}
.brand-logo{
  display:block;
  width:min(380px,62vw);
  height:auto;
  margin:0 auto;
}
.brand-emblem{
  display:block;
  width:78px;
  height:92px;
  object-fit:contain;
  margin-bottom:13px;
}
.brand-name{
  display:block;
  color:var(--copper);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:16px;
  font-weight:500;
  letter-spacing:.25em;
  line-height:1;
  white-space:nowrap;
}
.services{
  border-top:1px solid var(--line);
  margin-top:34px;
  padding:72px 0 78px;
  display:grid;grid-template-columns:repeat(3,1fr);
}
.service{padding:0 30px}
.service:first-child{padding-left:18px}
.service:last-child{padding-right:18px}
.service+ .service{border-left:1px solid var(--line)}
.service-number{
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:54px;line-height:.8;color:var(--copper);margin-bottom:25px
}
h1,h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;color:var(--white)}
.service h2{font-size:22px;line-height:1.5;letter-spacing:.22em;margin:0}
.short-rule{display:block;width:40px;height:1px;background:var(--copper);margin:24px 0}
.service p,.contact-band p{
  font-size:12px;line-height:2.05;margin:0;color:var(--text)
}
.contact-band{
  border-top:1px solid var(--line);
  text-align:center;
  padding:42px 0 62px;
}
.narrow{max-width:720px}
.eyebrow{font-size:11px;letter-spacing:.25em;color:var(--copper);margin-bottom:20px}
.contact-band h2{font-size:25px;letter-spacing:.25em;margin:0 0 24px}
.contact-band .secondary-copy{margin-top:30px}
.text-link{
  display:inline-block;color:var(--copper);font-size:12px;letter-spacing:.18em;
  margin-top:30px;padding-bottom:8px;border-bottom:1px solid var(--copper);
  transition:opacity .2s
}
.text-link:hover{opacity:.72}
.text-link span,.submit span{font-size:18px;margin-left:10px}
.site-footer{
  border-top:1px solid var(--line);
  min-height:78px;
  display:grid;grid-template-columns:1fr 1fr auto;align-items:center;
  font-size:10px;letter-spacing:.16em;color:var(--copper);
}
.site-footer a{transition:opacity .2s}
.site-footer a:hover{opacity:.72}
.instagram{font-size:25px;line-height:1;letter-spacing:0}

/* Application page */
.application{padding:0 0 100px;margin-top:34px}
.application-grid{
  display:grid;grid-template-columns:1fr 1.08fr;
  column-gap:48px;align-items:start;
}
.intro{padding-top:12px}
.intro h1{font-size:46px;line-height:1.1;letter-spacing:.16em;margin:0}
.intro .short-rule{margin:34px 0}
.intro p{font-size:13px;line-height:2.05;color:var(--text)}
.application-form{
  border-left:1px solid var(--line);
  padding-left:48px;
}
.field{margin-bottom:28px}
.field label{
  display:block;color:var(--copper);font-family:"Cormorant Garamond",Georgia,serif;
  font-size:15px;letter-spacing:.22em;margin-bottom:10px
}
input,select,textarea{
  width:100%;border:1px solid var(--line);background:rgba(10,18,28,.18);
  color:var(--white);font:300 16px "Manrope",Arial,sans-serif;
  border-radius:0;outline:none;padding:14px 15px;
  transition:border-color .2s,background .2s;
}
input,select{height:54px}
textarea{resize:vertical;min-height:140px}
input:focus,select:focus,textarea:focus{border-color:var(--copper);background:rgba(10,18,28,.28)}
input:focus-visible,select:focus-visible,textarea:focus-visible,
.submit:focus-visible,a:focus-visible,.consent input:focus-visible{
  outline:2px solid var(--copper);outline-offset:2px
}
input::placeholder,textarea::placeholder{color:rgba(199,179,165,.45)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--copper) 50%),linear-gradient(135deg,var(--copper) 50%,transparent 50%);background-position:calc(100% - 18px) 23px,calc(100% - 13px) 23px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
select option{background:#111b27;color:#d8c2b2}
small{display:block;font-size:10px;line-height:1.7;margin-top:9px;color:var(--text);opacity:.85}
.info{
  display:inline-flex;align-items:center;justify-content:center;
  width:15px;height:15px;border:1px solid var(--copper);border-radius:50%;
  font:500 10px/1 "Manrope";margin-left:6px;position:relative;vertical-align:2px;
  cursor:help
}
.tooltip{
  position:absolute;left:22px;top:-8px;white-space:nowrap;
  background:#0d1722;border:1px solid var(--line);padding:7px 10px;
  color:var(--white);font:300 10px "Manrope";letter-spacing:.04em;
  opacity:0;pointer-events:none;transform:translateY(3px);transition:.18s;z-index:5
}
.info:hover .tooltip,.info:focus .tooltip{opacity:1;transform:translateY(0)}
.form-note{margin:34px 0 25px}
.form-note .short-rule{margin:0 0 18px}
.form-note p{font-size:11px;line-height:1.9;color:var(--text);margin:0}
.consent{display:flex;gap:12px;align-items:flex-start;margin:24px 0 30px;font-size:10px;line-height:1.75;color:var(--text);cursor:pointer}
.consent input{width:16px;height:16px;padding:0;accent-color:#b77e5e;flex:none;margin-top:1px;height:16px}
.submit{
  width:100%;height:56px;border:1px solid var(--copper);background:transparent;
  color:var(--copper);font:500 12px "Cormorant Garamond",Georgia,serif;
  letter-spacing:.25em;cursor:pointer;transition:.2s
}
.submit:hover{background:rgba(199,155,123,.08)}
.submit[disabled]{opacity:.5;cursor:default}
.submit[disabled]:hover{background:transparent}
.form-status{min-height:18px;font-size:11px;line-height:1.8;margin:14px 0 0;color:var(--copper)}
.form-status.is-error{color:#e0a08a}

/* Teşekkür ekranı */
.thanks{
  border:1px solid var(--line);
  padding:38px 34px;
  text-align:center;
}
.thanks h2{font-size:22px;letter-spacing:.22em;margin:0 0 6px}
.thanks .short-rule{margin:22px auto}
.thanks p{font-size:12px;line-height:2.05;color:var(--text);margin:0}
.thanks .text-link{margin-top:26px}

/* 404 */
.notfound{text-align:center;padding:70px 0 110px;margin-top:34px;border-top:1px solid var(--line)}
.notfound h1{font-size:46px;line-height:1.1;letter-spacing:.16em;margin:0}
.notfound .short-rule{margin:30px auto}
.notfound p{font-size:12px;line-height:2.05;color:var(--text);margin:0}

@media(max-width:800px){
  .wrap{width:min(680px,calc(100% - 44px))}
  .services{grid-template-columns:1fr;gap:0}
  .service{padding:32px 0!important}
  .service+.service{border-left:0;border-top:1px solid var(--line)}
  .application-grid{grid-template-columns:1fr;row-gap:45px}
  .application-form{border-left:0;border-top:1px solid var(--line);padding:45px 0 0}
  .site-footer{grid-template-columns:1fr;gap:14px;padding:25px 0;text-align:center}
  .instagram{justify-self:center}
}
@media(max-width:520px){
  .site-header{padding-top:28px}
  .brand-logo{width:min(300px,66vw)}
  .brand-emblem{width:64px;height:76px}
  .brand-name{font-size:13px;letter-spacing:.20em}
  .services{padding-top:45px}
  .intro h1,.notfound h1{font-size:39px}
  .thanks{padding:32px 22px}
}
/* Telefon yatay çevrildiğinde ekran yüksekliği ~390px'e düşüyor; bu ölçüde
   logo tek başına tüm ekranı kaplayıp içeriği aşağı itiyordu. */
@media(orientation:landscape) and (max-height:520px){
  .site-header{padding-top:20px}
  .brand-logo{width:min(210px,24vw)}
  .services{margin-top:22px;padding:38px 0 44px}
  .service h2{font-size:19px;letter-spacing:.18em}
  .service-number{font-size:44px;margin-bottom:20px}
  .contact-band{padding:34px 0 46px}
  .contact-band h2{font-size:22px}
  .application{margin-top:22px;padding-bottom:64px}
  .intro h1,.notfound h1{font-size:33px}
  .intro .short-rule{margin:24px 0}
  .notfound{padding:46px 0 66px}
  .field{margin-bottom:22px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
