.themes-page{background:#fbf8f3}
.themes-page .header nav .active:after{right:0}

.themes-hero{overflow:hidden;background:var(--brand);color:#fff}
.themes-hero-inner{min-height:730px;display:grid;grid-template-columns:.78fr 1.22fr;gap:76px;align-items:center}
.themes-hero-copy{padding:74px 0}
.themes-hero .breadcrumb{display:flex;align-items:center;gap:10px;margin:0 0 66px;color:#e8d9ca9e;font:500 10px var(--heading);letter-spacing:.08em;text-transform:uppercase}
.themes-hero .breadcrumb span{color:var(--accent-light)}
.themes-hero-copy h1{max-width:580px;margin:17px 0 28px;color:#fff9f2;font:400 67px/.96 var(--display)}
.themes-hero-copy h1 em{color:var(--accent-light);font-style:italic}
.theme-word-mobile{display:none}
.themes-hero-copy>p:not(.breadcrumb,.eyebrow){max-width:470px;margin:0;color:#f0e2d5c7;font:400 15px/1.82 var(--body)}
.themes-jump{display:inline-flex;align-items:center;gap:42px;margin-top:34px;padding-bottom:7px;border-bottom:1px solid #ffffff6b;color:#fff;font:600 10px var(--heading);letter-spacing:.05em}
.themes-jump span{font-size:15px}

.themes-hero-collage{height:620px;display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:1fr 1fr;gap:12px;position:relative}
.themes-hero-collage figure{margin:0;position:relative;overflow:hidden}
.themes-hero-collage img{height:100%;object-fit:cover;transition:transform .6s ease}
.themes-hero-collage figure:hover img{transform:scale(1.025)}
.collage-main{grid-row:1/-1}
.collage-main img{object-position:46% center}
.collage-small img{filter:saturate(.82)}
.collage-love img{object-position:center}
.collage-winter img{object-position:center 32%}
.themes-hero-collage figcaption{position:absolute;left:0;right:0;bottom:0;padding:42px 24px 20px;background:linear-gradient(transparent,#2e1a1dac);color:#fff}
.collage-main figcaption small{display:block;margin-bottom:5px;color:#e4d3b0;font:600 8px var(--heading);letter-spacing:.13em;text-transform:uppercase}
.collage-main figcaption b{font:400 32px var(--display)}
.collage-small figcaption{padding:30px 16px 15px;font:500 15px var(--body)}
.collage-count{position:absolute;left:-38px;bottom:26px;min-width:190px;padding:18px 22px;display:flex;align-items:center;gap:14px;background:var(--accent);color:#fff;font:600 8px/1.4 var(--heading);letter-spacing:.1em;text-transform:uppercase}
.collage-count b{font:400 34px/1 var(--display)}

.themes-intro{padding:105px 0 78px;background:#fbf8f3}
.themes-intro-inner{display:grid;grid-template-columns:1fr 430px;align-items:end;gap:90px}
.themes-intro h2{margin:14px 0 0;color:var(--brand);font:400 59px/.98 var(--display)}
.themes-intro h2 em{color:var(--accent);font-style:italic}
.themes-intro-inner>div:last-child>p{margin:0;color:var(--muted);font:400 14px/1.78 var(--body)}
.themes-intro-inner>div:last-child>span{display:flex;justify-content:space-between;margin-top:24px;padding-bottom:8px;border-bottom:1px solid var(--line);color:var(--brand);font:600 9px var(--heading);letter-spacing:.08em;text-transform:uppercase}

.theme-collection{padding-bottom:120px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:92px;gap:22px}
.theme-card{min-width:0;position:relative;overflow:hidden;background:#dfd2c3;color:#fff}
.theme-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,#25171bb8 100%);transition:background .35s ease}
.theme-card img{height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .35s ease}
.theme-card:hover img{transform:scale(1.035);filter:saturate(1.05)}
.theme-number{position:absolute;top:20px;right:22px;z-index:2;color:#fff;font:600 9px var(--heading);letter-spacing:.14em}
.theme-card-copy{position:absolute;left:25px;right:25px;bottom:22px;z-index:2}
.theme-card-copy small{color:#e2d3b2;font:600 8px var(--heading);letter-spacing:.13em;text-transform:uppercase}
.theme-card-copy h3{margin:6px 0 5px;color:#fff;font:400 34px/1 var(--display)}
.theme-card-copy p{max-width:330px;margin:0;color:#f6ece3d2;font:400 10px/1.5 var(--body)}
.theme-card-copy b{display:inline-block;margin-top:13px;padding-bottom:4px;border-bottom:1px solid #ffffff64;color:#fff;font:600 8px var(--heading);letter-spacing:.09em;text-transform:uppercase;opacity:0;transform:translateY(5px);transition:.3s ease}
.theme-card:hover .theme-card-copy b{opacity:1;transform:none}
.theme-valentine{grid-column:1/6;grid-row:span 5}
.theme-easter{grid-column:6/13;grid-row:span 5}
.theme-parents{grid-column:1/8;grid-row:span 5}
.theme-halloween{grid-column:8/13;grid-row:span 5}
.theme-autumn{grid-column:1/5;grid-row:span 4}
.theme-saint{grid-column:5/13;grid-row:span 4}
.theme-christmas{grid-column:1/7;grid-row:span 5}
.theme-newyear{grid-column:7/13;grid-row:span 5}
.theme-parents img{object-position:center 55%}
.theme-halloween img{object-position:center}
.theme-autumn img{object-position:center}
.theme-christmas img{object-position:18% 34%}
.theme-newyear img{object-position:84% 34%;transform:scale(1.08)}
.theme-newyear:hover img{transform:scale(1.12)}

.themes-service{padding:100px 0;background:var(--brand-dark);color:#fff}
.themes-service-inner{display:grid;grid-template-columns:1fr 460px;align-items:end;gap:90px}
.themes-service h2{margin:14px 0 0;color:#fff9f1;font:400 59px/.98 var(--display)}
.themes-service h2 em{color:var(--accent-light);font-style:italic}
.themes-service-inner>div:last-child>p{margin:0;color:#f0e1d3c2;font:400 14px/1.78 var(--body)}
.themes-actions{margin-top:28px;display:flex;align-items:center;gap:25px}

@media(max-width:1100px){
  .themes-hero-inner{grid-template-columns:.85fr 1.15fr;gap:44px}
  .themes-hero-copy h1{font-size:58px}
  .themes-intro-inner{grid-template-columns:1fr 380px;gap:50px}
  .theme-card-copy h3{font-size:29px}
}

@media(max-width:900px){
  .themes-hero-inner{padding-top:58px;grid-template-columns:1fr;gap:44px}
  .themes-hero-copy{padding:0}
  .themes-hero .breadcrumb{margin-bottom:36px}
  .themes-hero-copy h1{font-size:66px}
  .themes-hero-copy>p:not(.breadcrumb,.eyebrow){font-size:14px}
  .themes-hero-collage{height:600px}
  .themes-intro{padding:78px 0 60px}
  .themes-intro-inner{grid-template-columns:1fr;gap:28px}
  .themes-intro h2{font-size:54px}
  .themes-intro-inner>div:last-child>p{max-width:650px}
  .theme-collection{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:340px;gap:15px}
  .theme-card,.theme-valentine,.theme-easter,.theme-parents,.theme-halloween,.theme-autumn,.theme-saint,.theme-christmas,.theme-newyear{grid-column:auto;grid-row:auto}
  .theme-easter,.theme-parents,.theme-christmas{grid-column:1/-1;height:470px}
  .theme-card-copy b{opacity:1;transform:none}
  .themes-service-inner{grid-template-columns:1fr;gap:30px}
  .themes-service-inner>div:last-child>p{max-width:650px}
}

@media(max-width:600px){
  .themes-hero-inner{padding-top:42px}
  .themes-hero .breadcrumb{margin-bottom:30px}
  .themes-hero-copy h1{font-size:50px}
  .themes-hero-copy h1 em{font-size:.83em}
  .theme-word-desktop{display:none}
  .theme-word-mobile{display:inline}
  .themes-hero-collage{height:485px;grid-template-columns:1fr 1fr;grid-template-rows:1.2fr .8fr}
  .collage-main{grid-column:1/-1;grid-row:1}
  .collage-count{left:0;bottom:38%;min-width:167px;padding:13px 16px}
  .themes-intro h2{font-size:45px}
  .themes-intro h2 em{font-size:.82em}
  .theme-collection{padding-bottom:80px;grid-auto-rows:300px;gap:10px}
  .theme-card,.theme-easter,.theme-parents,.theme-christmas{height:auto;grid-column:auto}
  .theme-valentine,.theme-easter,.theme-parents,.theme-halloween,.theme-autumn,.theme-saint,.theme-christmas,.theme-newyear{grid-column:1/-1}
  .theme-card-copy{left:18px;right:18px;bottom:17px}
  .theme-card-copy h3{font-size:29px}
  .theme-card-copy p{font-size:9.5px}
  .themes-service{padding:78px 0}
  .themes-service h2{font-size:46px}
  .themes-actions{align-items:flex-start;flex-direction:column}
}