/* ==========================================================================
   Glitz Interior Design — stylesheet
   1. Tokens & base      4. Header / navigation
   2. Shared utilities   5. Page sections
   3. Motion             6. Responsive
   ========================================================================== */

/* 1. Tokens & base ------------------------------------------------------- */
:root{
  --navy:#071b2b;
  --cream:#f3efe6;
  --ink:#142331;
  --sand:#8e795c;
  --muted:#5e6b73;
  --hdr-h:82px;
  /* Scroll ilerlemesine göre JS tarafından 0 → 1 arasında güncellenir */
  --nav-o:0;
}

*,*::before,*::after{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  scroll-padding-top:var(--hdr-h);
  -webkit-text-size-adjust:100%
}

body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
  text-rendering:optimizeSpeed
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
em{font-family:Georgia,"Times New Roman",serif;font-weight:400}
h1,h2,h3{text-wrap:balance}
:focus-visible{outline:2px solid currentColor;outline-offset:4px}

/* 2. Shared utilities ---------------------------------------------------- */
.eyebrow{font-size:10px;font-weight:700;letter-spacing:.26em;margin:0 0 30px}
.eyebrow.light{color:#dfd8ca}
.line{width:90px;height:1px;background:#a6a195;margin-top:5px}

/* Tüm fotoğraf yüzeyleri aynı kaplama davranışını paylaşır */
.hero-image,.project-image,.product-photo,.page-hero,.image-panel,
.catalog-photo,.reference-photo,.blog-photo,.detail-visual,.care-image{
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  background-color:#18354b
}

/* Görsel kaynakları tek yerde toplanır */
.hero-image,.project-hero,.hero-panel,.reference-photo.hero,.blog-photo.hero,
.page-hero.about-hero{background-image:url('../images/hero.jpg')}
.project-yacht,.reference-photo.yacht,.page-hero.refs-hero{background-image:url('../images/yacht.jpg')}
.product-mattress,.catalog-photo.mattress,.reference-photo.mattress,
.detail-visual.mattress,.care-image.mattress,
.page-hero.products-hero{background-image:url('../images/mattress.jpg')}
.product-pillow,.catalog-photo.pillow,.reference-photo.pillow,
.blog-photo.pillow,.detail-visual.pillow,.care-image.pillow{background-image:url('../images/pillow.jpg')}
.product-duvet,.catalog-photo.duvet,.reference-photo.duvet,
.blog-photo.duvet,.detail-visual.duvet,.care-image.duvet{background-image:url('../images/duvet.jpg')}
.project-detail,.catalog-photo.detail,.reference-photo.detail,
.blog-photo.detail,.detail-visual.detail,.care-image.detail,
.page-hero.blog-hero{background-image:url('../images/detail.jpg')}

/* Alt çizgili metin bağlantıları */
.text-link,.section-head>a,.inline-cta>a,.footer-main>a,.detail-copy>a,.care a,
.blog-grid a,.catalog-card b,.manifesto-copy a{
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:400;
  display:inline-block;
  padding-bottom:8px;
  background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat,
             linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;
  transition:background-size .45s cubic-bezier(.33,1,.68,1)
}
.text-link:hover,.section-head>a:hover,.inline-cta>a:hover,.footer-main>a:hover,
.detail-copy>a:hover,.care a:hover,.blog-grid a:hover,.catalog-card:hover b,
.manifesto-copy a:hover{
  background-size:100% 2px,100% 1px
}

/* 3. Motion -------------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    transition-duration:.01ms!important
  }
}

/* 4. Header / navigation ------------------------------------------------- */
body{--hdr-fg:var(--ink);--hdr-panel:var(--cream);--hdr-line:#233847}
body.hero-page{--hdr-fg:#fff;--hdr-panel:rgba(7,27,43,.96);--hdr-line:rgba(255,255,255,.5)}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  height:var(--hdr-h);
  padding:0 4.5vw;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--hdr-fg);
  background-color:var(--cream);
  transition:background-color .3s linear,box-shadow .3s linear
}

/* Banner’lı sayfalarda başlık saydam olarak görselin üzerinde durur ve
   scroll ilerledikçe arka planı kademeli olarak dolar. */
body.hero-page .site-header{
  position:fixed;
  left:0;
  right:0;
  background-color:rgba(7,27,43,var(--nav-o))
}
body.hero-page .site-header.is-scrolled{
  backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  box-shadow:0 1px 0 rgba(255,255,255,.08)
}

.brand{display:block}
.brand.inverse{color:#fff}

/* Logo, HTML'in içine gömülü SVG olarak basılır ve rengini currentColor'dan
   alır: saydam/koyu başlıkta beyaz, açık başlıkta lacivert olur. Dış dosyaya
   bağlı olmadığı için file:// ile açıldığında da, önbellek eskidiğinde de
   görünür kalır. height:auto, viewBox'tan gelen oranı korur. */
.brand-mark{display:block;width:124px}
.brand-mark svg{display:block;width:100%;height:auto}

.site-header nav{
  display:flex;
  gap:26px;
  font-size:12px;
  letter-spacing:.11em;
  text-transform:uppercase
}
.site-header nav a{transition:opacity .2s}
.site-header nav a:hover{opacity:.55}

/* “Proje Başlat” — hover’da arka plan aşağıdan yukarı dolar */
.menu-cta{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.14em;
  border:1px solid var(--hdr-line);
  padding:11px 15px;
  transition:color .35s ease,border-color .35s ease
}
.menu-cta::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:var(--hdr-fg);
  transform:translateY(101%);
  transition:transform .45s cubic-bezier(.33,1,.68,1)
}
.menu-cta:hover::before,.menu-cta:focus-visible::before{transform:translateY(0)}
.menu-cta:hover,.menu-cta:focus-visible{
  color:var(--hdr-panel);
  border-color:var(--hdr-fg)
}
body.hero-page .menu-cta:hover,body.hero-page .menu-cta:focus-visible{color:var(--navy)}

.mobile-toggle{
  display:none;
  background:none;
  border:0;
  padding:0;
  font-size:24px;
  line-height:1;
  color:inherit;
  cursor:pointer
}

/* 5. Page sections ------------------------------------------------------- */

/* 5.1 Ana sayfa banner’ı — tam ekran */
.hero{
  height:100vh;
  height:100svh;
  min-height:520px;
  position:relative;
  color:#fff;
  overflow:hidden
}
.hero-image{position:absolute;inset:0}
.hero-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(2,14,24,.76),rgba(2,14,24,.2) 70%),
             linear-gradient(0deg,rgba(3,16,26,.45),transparent 55%)
}
.hero-content{
  position:relative;
  height:100%;
  padding:calc(var(--hdr-h) + 6vh) 7vw 6vh;
  display:flex;
  flex-direction:column
}
.hero h1{
  font-size:clamp(58px,8vw,125px);
  letter-spacing:-.055em;
  line-height:.82;
  font-weight:300;
  margin:3vh 0
}
.hero h1 em{font-size:.92em}
.hero-bottom{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.hero-bottom p{max-width:430px;font-size:15px;line-height:1.75;color:#e9e4dc}

/* 5.2 Alt sayfa banner’ları — tam ekran */
.page-hero{
  height:100vh;
  height:100svh;
  min-height:520px;
  position:relative;
  color:#fff;
  display:flex;
  align-items:center;
  overflow:hidden
}
.page-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(3,18,29,.78),rgba(3,18,29,.15)),
             linear-gradient(0deg,rgba(3,16,26,.4),transparent 60%)
}
.page-hero-content{
  position:relative;
  padding:calc(var(--hdr-h) + 4vh) 7vw 6vh;
  max-width:1000px
}
.page-hero h1{
  font-size:clamp(55px,7vw,105px);
  font-weight:300;
  line-height:.9;
  letter-spacing:-.055em;
  margin:30px 0
}
.page-hero-content>p:last-child{max-width:520px;line-height:1.75;color:#e2e3e2}

/* 5.3 Manifesto */
.manifesto{padding:140px 7vw 150px;display:grid;grid-template-columns:1fr 2fr;gap:70px}
.manifesto>div:first-child{display:flex;align-items:flex-start;gap:25px}
.manifesto h2{
  font-size:clamp(38px,5.3vw,76px);
  line-height:1.05;
  letter-spacing:-.045em;
  font-weight:300;
  margin:0
}
.manifesto h2 em{color:var(--sand)}
.manifesto-copy{
  grid-column:2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  margin-top:25px;
  max-width:850px
}
.manifesto-copy p{font-size:15px;line-height:1.85;color:#52616a}

/* 5.4 Bölüm başlıkları */
.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin:0 2vw 60px}
.section-head h2{font:400 clamp(43px,5vw,70px) Georgia,"Times New Roman",serif;margin:0}
.dark-head{color:var(--ink)}

/* 5.5 Ürün önizleme */
.product-preview{padding:130px 7vw}
.product-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.product-cards>a{display:block}
.product-photo{height:460px;margin-bottom:20px;transition:opacity .4s ease}
.product-cards>a:hover .product-photo{opacity:.85}
.product-cards small,.catalog-card>span{font-size:9px;letter-spacing:.2em;color:#8a7962}
.product-cards h3{font:400 26px Georgia,"Times New Roman",serif;margin:10px 0}
.product-cards p{font-size:12px;color:#66727a;line-height:1.7}

/* 5.6 Projeler */
.projects{background:var(--navy);color:#fff;padding:120px 5vw 140px}
.projects .section-head>a{color:#aeb7bd}
.project-grid{display:grid;grid-template-columns:1.45fr .9fr .9fr;gap:22px;align-items:start}
.project-card:nth-child(2){margin-top:100px}
.project-card:nth-child(3){margin-top:30px}
.project-image{height:430px;position:relative;overflow:hidden}
.project-card:first-child .project-image{height:610px}
.project-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,rgba(2,13,22,.35),transparent 45%)
}
.project-image>span{position:absolute;z-index:1;left:18px;top:18px;font-size:9px;letter-spacing:.2em}
.project-image>b{
  position:absolute;
  z-index:2;
  right:18px;
  bottom:18px;
  width:42px;
  height:42px;
  border-radius:50%;
  background:rgba(255,255,255,.9);
  color:var(--navy);
  display:grid;
  place-items:center;
  font-weight:400;
  transition:transform .4s cubic-bezier(.33,1,.68,1),background-color .3s
}
.project-card a:hover .project-image>b{transform:translate(4px,-4px);background:#fff}
.project-meta{display:flex;justify-content:space-between;align-items:end;gap:20px;padding-top:18px}
.project-meta small{font-size:8px;letter-spacing:.2em;color:#9aa5ad}
.project-meta h3{font:400 26px Georgia,"Times New Roman",serif;margin:8px 0 0}
.project-meta p{font-size:9px;color:#9aa5ad;letter-spacing:.1em}

/* 5.7 Süreç */
.process{background:#102d43;color:#fff;padding:130px 7vw}
.process>h2{
  font-size:clamp(45px,6vw,86px);
  line-height:.98;
  font-weight:300;
  letter-spacing:-.045em;
  margin:0 0 90px
}
.process>h2 em,.footer-main h2 em{color:#c8b795}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:60px;border-top:1px solid rgba(255,255,255,.25)}
.steps div{padding-top:25px}
.steps span{font-size:9px;color:#aab5bd}
.steps h3{font:400 25px Georgia,"Times New Roman",serif;margin:28px 0 14px}
.steps p{max-width:290px;font-size:13px;line-height:1.75;color:#b9c2c8}

/* 5.8 Ara CTA */
.inline-cta{padding:135px 7vw;text-align:center;background:#dcd2c1}
.inline-cta h2{font-size:clamp(46px,6vw,84px);font-weight:300;letter-spacing:-.045em;line-height:1.02}
.inline-cta h2 em{color:#7d674a}
.inline-cta>a{margin-top:10px}

/* 5.9 Hakkımızda */
.story{padding:140px 7vw;display:grid;grid-template-columns:.7fr 2fr;gap:8vw}
.story h2{font-size:clamp(40px,5vw,70px);font-weight:300;line-height:1.05;margin:0 0 45px}
.story div>p{max-width:760px;font-size:15px;line-height:1.9;color:var(--muted)}
.values{display:grid;grid-template-columns:repeat(4,1fr);padding:0 7vw 140px;gap:1px}
.values article{border-top:1px solid #aaa195;padding:28px 25px 20px 0}
.values span{font-size:9px;color:#917e63}
.values h3{font:400 23px Georgia,"Times New Roman",serif;margin:28px 0 15px}
.values p{font-size:12px;line-height:1.7;color:#67737a}
.image-story{
  background:#0d2a40;
  color:#fff;
  padding:110px 7vw;
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:8vw;
  align-items:center
}
.image-panel{height:620px}
.image-story h2{font-size:clamp(42px,5vw,68px);font-weight:300;line-height:1.03}
.image-story p:last-child{line-height:1.8;color:#bcc5cb}

/* 5.10 Ürün kataloğu */
.catalog-intro{padding:130px 7vw 70px}
.catalog-intro h2{font-size:clamp(45px,6vw,82px);font-weight:300;line-height:1.02}
.catalog-grid{padding:0 7vw 140px;display:grid;grid-template-columns:1fr 1fr;gap:70px 30px}
.catalog-card:nth-child(even){margin-top:100px}
.catalog-photo{height:620px;transition:opacity .4s ease}
.catalog-card:hover .catalog-photo{opacity:.88}
.catalog-card h3{font:400 32px Georgia,"Times New Roman",serif;margin:15px 0 10px}
.catalog-card p{max-width:470px;color:#627078;font-size:13px;line-height:1.7}
.catalog-card b{font-size:10px;letter-spacing:.15em}
.custom-band{
  background:#0f2d43;
  color:#fff;
  padding:100px 7vw;
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:8vw;
  align-items:end
}
.custom-band h2{font-size:clamp(44px,5vw,72px);font-weight:300;line-height:1.02}
.custom-band p{line-height:1.8;color:#bcc6cc}

/* 5.11 Referanslar */
.reference-grid{padding:120px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:80px 30px}
.reference-grid article.wide{grid-column:1/3}
.reference-photo{height:560px}
.reference-grid article.wide .reference-photo{height:720px}
.reference-grid span{font-size:9px;color:#8a7962;display:block;margin-top:18px}
.reference-grid h2{font:400 31px Georgia,"Times New Roman",serif;margin:9px 0}
.reference-grid p{font-size:10px;letter-spacing:.12em;color:#728088}
.reference-note{margin:0 7vw 130px;padding:90px;background:#ded5c6}
.reference-note h2{font-size:clamp(38px,5vw,65px);font-weight:300;max-width:1000px}
.reference-note>p:last-child{max-width:650px;line-height:1.8}

/* 5.12 Ürün detay */
.product-detail-hero{
  min-height:calc(100vh - var(--hdr-h));
  display:grid;
  grid-template-columns:1.25fr 1fr
}
.detail-copy{padding:11vh 7vw;display:flex;flex-direction:column;justify-content:center}
.detail-copy h1{font-size:clamp(55px,6vw,90px);line-height:.95;font-weight:300;letter-spacing:-.05em}
.detail-copy>p:last-of-type{font-size:15px;line-height:1.85;color:#5d6b73}
.detail-copy>a,.care a{font-size:10px;letter-spacing:.15em;width:max-content;margin-top:25px}
.feature-section{padding:130px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw}
.feature-section h2{font-size:clamp(42px,5vw,68px);font-weight:300;line-height:1.04}
.feature-section ul{list-style:none;margin:0;padding:0;border-top:1px solid #aaa195}
.feature-section li{
  padding:25px 0;
  border-bottom:1px solid #aaa195;
  font:400 22px Georgia,"Times New Roman",serif
}
.feature-section li span{font:400 9px Arial,sans-serif;margin-right:30px;color:#8a7962}
.care{padding:100px 7vw;background:#e5ded2;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}
.care-image{height:550px}
.care h2{font-size:clamp(40px,5vw,65px);font-weight:300}
.care p{line-height:1.8;color:#5f6d75}

/* 5.13 Blog */
.blog-grid{padding:120px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:80px 30px}
.blog-grid article.featured{grid-column:1/3}
.blog-photo{height:470px}
.featured .blog-photo{height:650px}
.blog-grid small{display:block;margin-top:20px;font-size:9px;letter-spacing:.17em;color:#8c795f}
.blog-grid h2{font:400 31px Georgia,"Times New Roman",serif;margin:12px 0}
.blog-grid p{color:#647179;line-height:1.7}
.blog-grid a{font-size:10px;letter-spacing:.15em}

/* 5.14 İletişim */
.contact-page{
  min-height:calc(100vh - var(--hdr-h));
  display:grid;
  grid-template-columns:1fr 1fr;
  background:var(--cream)
}
.contact-intro{padding:12vh 7vw;background:#0d2a40;color:#fff}
.contact-intro h1{font-size:clamp(52px,6vw,86px);font-weight:300;line-height:.95;letter-spacing:-.05em}
.contact-intro>p{max-width:520px;line-height:1.8;color:#c2cbd0}
.contact-details{margin-top:70px;display:grid;gap:28px}
.contact-details small{display:block;font-size:8px;letter-spacing:.18em;color:#8898a2;margin-bottom:8px}
.contact-details a,.contact-details p{font:400 18px Georgia,"Times New Roman",serif;margin:0;line-height:1.5}
.contact-form{padding:10vh 7vw;display:flex;flex-direction:column;gap:24px}
.contact-form label{font-size:9px;text-transform:uppercase;letter-spacing:.16em}
.contact-form input,.contact-form select,.contact-form textarea{
  display:block;
  width:100%;
  margin-top:9px;
  padding:15px 0;
  border:0;
  border-bottom:1px solid #aaa195;
  background:transparent;
  font:14px Arial,sans-serif;
  color:inherit;
  outline:none;
  transition:border-color .3s
}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--navy)}
.contact-form button{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  margin-top:12px;
  background:#0d2a40;
  color:#fff;
  border:1px solid #0d2a40;
  padding:18px;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:10px;
  cursor:pointer;
  transition:color .35s ease
}
.contact-form button::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:var(--cream);
  transform:translateY(101%);
  transition:transform .45s cubic-bezier(.33,1,.68,1)
}
.contact-form button:hover::before,.contact-form button:focus-visible::before{transform:translateY(0)}
.contact-form button:hover,.contact-form button:focus-visible{color:#0d2a40}
.contact-form>p{font-size:9px;color:#7a858b;line-height:1.6}
.form-status{display:none;padding:14px;background:#dce6df;color:#183d2c;font-size:13px}

/* 5.15 Footer */
footer{background:#061722;color:#fff;padding:120px 7vw 40px}
.footer-main{text-align:center;padding-bottom:120px}
.footer-main h2{font-size:clamp(43px,6.2vw,88px);font-weight:300;line-height:1.02;letter-spacing:-.045em}
.footer-main>a{margin-top:25px;font-size:12px}
.footer-bottom{
  border-top:1px solid #32424d;
  padding-top:35px;
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:40px;
  align-items:start
}
.footer-bottom p{font-size:10px;line-height:1.8;color:#9ca7ae;margin:0}
.footer-bottom a:hover{color:#fff;opacity:.7}
.copyright{
  border-top:1px solid #32424d;
  margin-top:40px;
  padding-top:25px;
  color:#75828b;
  font-size:9px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  letter-spacing:.08em
}

/* 6. Responsive ---------------------------------------------------------- */

/* 6.1 Tablet ve altı — açılır menü */
@media(max-width:1080px){
  body{--hdr-h:72px}
  .brand{margin-right:auto}
  .brand-mark{width:106px}
  .menu-cta{order:2}
  .mobile-toggle{order:3;display:block}
  .site-header{gap:16px;padding:0 5vw}

  .site-header nav{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    display:none;
    flex-direction:column;
    gap:0;
    padding:6px 5vw 24px;
    background:var(--hdr-panel);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:0 26px 44px -26px rgba(4,18,30,.45)
  }
  .site-header.nav-open nav{display:flex}
  .site-header nav a{
    padding:17px 0;
    font-size:13px;
    border-bottom:1px solid color-mix(in srgb,currentColor 20%,transparent)
  }
  .site-header nav a:last-child{border-bottom:0}

  .product-cards{grid-template-columns:1fr 1fr}
  .product-cards>a:last-child{grid-column:1/3}
  .product-detail-hero{grid-template-columns:1fr}
  .detail-visual{min-height:65vh}
  .values{grid-template-columns:1fr 1fr}
  .image-story{grid-template-columns:1fr}
  .contact-page{grid-template-columns:1fr}
  .contact-intro,.contact-form{padding:10vh 7vw}
}

/* 6.2 Mobil */
@media(max-width:700px){
  .hero-content{padding:calc(var(--hdr-h) + 5vh) 6vw 5vh}
  .hero-bottom{display:block}
  .hero-bottom p{max-width:320px;font-size:13px}
  .text-link{margin-top:25px}

  .manifesto{padding:90px 6vw;display:block}
  .manifesto h2{margin-top:50px}
  .manifesto-copy{grid-template-columns:1fr;margin-top:45px;gap:15px}

  .section-head{display:block}
  .section-head>a{margin-top:22px}
  .product-preview{padding:90px 6vw}
  .projects{padding:90px 6vw 100px}

  .product-cards,.catalog-grid,.reference-grid,.blog-grid,.project-grid{grid-template-columns:1fr}
  .product-cards>a:last-child,.reference-grid article.wide,.blog-grid article.featured{grid-column:auto}
  .product-photo,.catalog-photo,.reference-photo,
  .reference-grid article.wide .reference-photo,.blog-photo,.featured .blog-photo,
  .project-image,.project-card:first-child .project-image{height:430px}
  .project-card:nth-child(n){margin-top:30px}
  .catalog-card:nth-child(even){margin-top:0}

  .custom-band,.feature-section{grid-template-columns:1fr}
  .page-hero-content{padding:calc(var(--hdr-h) + 4vh) 6vw 6vh}
  .story{grid-template-columns:1fr;padding:90px 6vw}
  .values{grid-template-columns:1fr;padding:0 6vw 90px}
  .image-story{padding:80px 6vw}
  .image-panel{height:430px}
  .reference-note{margin:0 6vw 90px;padding:55px 30px}
  .care{grid-template-columns:1fr;padding:75px 6vw}
  .care-image{height:430px}
  .inline-cta{text-align:left;padding:90px 6vw}
  .process{padding:90px 6vw}
  .steps{grid-template-columns:1fr;gap:30px}
  footer{padding:90px 6vw 40px}
  .footer-main{text-align:left;padding-bottom:80px}
  .footer-bottom{grid-template-columns:1fr}
  .copyright{display:block}
  .copyright span{display:block;margin-top:10px}
}

@media(max-width:480px){
  .hero h1{font-size:58px}
  .manifesto h2{font-size:42px}
  .menu-cta{display:none}
}