/*
Theme Name: C'EST CHOCOLA
Theme URI: https://cestchocola.se/
Author: C'EST CHOCOLA
Description: Minimal custom theme for C'EST CHOCOLA. Built for premium ice cream, pralines and ordering.
Version: 4.0.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: cest-chocola
*/

:root {
  --cc-cream: #f7f2e9;
  --cc-cream-light: #fcfaf6;
  --cc-cream-dark: #efe6d8;
  --cc-paper: #fffdf9;
  --cc-ink: #28170f;
  --cc-brown: #321a0e;
  --cc-brown-dark: #21110a;
  --cc-gold: #b58b49;
  --cc-gold-light: #d2b67d;
  --cc-muted: #75675c;
  --cc-line: rgba(69,42,23,.15);
  --cc-brand: "Runtime", "Cormorant Garamond", Georgia, serif;
  --cc-serif: "Cormorant Garamond", Georgia, serif;
  --cc-sans: "Manrope", Arial, sans-serif;
  --cc-max: 1760px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--cc-cream); color:var(--cc-ink); font-family:var(--cc-sans); line-height:1.5; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }
.cc-wrap { width:min(calc(100% - 80px), var(--cc-max)); margin:0 auto; }
.cc-eyebrow { margin-bottom:20px; color:var(--cc-gold); font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; }
.cc-btn { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:0 34px; border:1px solid var(--cc-gold-light); font-family:var(--cc-sans); font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; transition:.18s ease; }
.cc-btn:hover { transform:translateY(-2px); }
.cc-btn-dark { background:var(--cc-brown); border-color:var(--cc-brown); color:#fff; }
.cc-btn-light { background:rgba(255,255,255,.35); color:#9a7338; }

/* HEADER */
.cc-header {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  height:112px;
  padding:0 4.3vw;
  background:rgba(252,249,243,.98);
  border-bottom:1px solid rgba(70,43,22,.06);
  z-index:100;
}
.cc-nav { display:flex; align-items:center; gap:44px; flex:1 1 0; min-width:0; }
.cc-nav-left { justify-content:flex-start; }
.cc-nav-right { justify-content:flex-end; }
.cc-nav a { font-family:var(--cc-serif); font-size:18px; font-weight:400; line-height:1; white-space:nowrap; }
.cc-nav a:hover { color:var(--cc-gold); }
.cc-order-top { min-height:40px; padding:0 24px!important; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--cc-gold-light); border-radius:100px; color:#9b7439; }
.cc-brand { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; z-index:2; }
.cc-brand .custom-logo-link { display:block; line-height:0; }
.cc-brand img.custom-logo { display:block; width:420px; max-width:420px; height:auto; }
.cc-brand-text { font-family:var(--cc-serif); font-size:42px; font-weight:400; letter-spacing:.12em; white-space:nowrap; }

/* HERO */
.cc-hero { position:relative; height:clamp(620px,43vw,790px); min-height:620px; background-size:cover; background-position:center center; background-repeat:no-repeat; overflow:hidden; }
.cc-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(248,244,237,.14) 0%, rgba(248,244,237,.05) 34%, transparent 60%); }
.cc-hero-copy { position:absolute; z-index:2; left:10.5%; top:49%; transform:translateY(-50%); width:min(580px,40vw); }
.cc-hero h1 { margin:0 0 14px; font-family:var(--cc-brand); font-size:clamp(68px,5.4vw,104px); font-weight:400; line-height:.88; letter-spacing:.08em; }
.cc-hero-tagline { margin:0 0 38px; font-family:var(--cc-serif); font-size:clamp(35px,2.7vw,53px); font-style:italic; line-height:1.12; }
.cc-actions { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.cc-hero-signature { margin-top:39px; color:var(--cc-gold); font-size:11px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; }
.cc-fleur { font-family:Georgia,serif; font-size:22px; line-height:1; margin-bottom:5px; }

/* PRODUCTS */
.cc-products { padding:28px 0 48px; background:var(--cc-cream-light); }
.cc-section-title { margin:0 0 28px; text-align:center; color:var(--cc-gold); font-family:var(--cc-brand); font-size:18px; font-weight:400; letter-spacing:.04em; }
.cc-section-title::after { content:""; display:block; width:28px; height:1px; margin:13px auto 0; background:var(--cc-gold); }
.cc-product-grid { display:grid; grid-template-columns:repeat(var(--cc-product-cols,4),minmax(0,1fr)); gap:18px; }
.cc-empty-products { grid-column:1/-1; padding:50px 20px; text-align:center; color:#78695d; font-family:var(--cc-serif); font-size:20px; border:1px solid var(--cc-line); }
.cc-product-card { display:block; overflow:hidden; background:rgba(255,255,255,.4); border:1px solid var(--cc-line); transition:.2s ease; }
.cc-product-card:hover { transform:translateY(-3px); box-shadow:0 12px 25px rgba(52,31,18,.07); }
.cc-product-image { aspect-ratio:1/1; overflow:hidden; background:#e7dfd4; }
.cc-product-image img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.cc-product-card:hover .cc-product-image img { transform:scale(1.035); }
.cc-product-placeholder { width:100%; height:100%; background:linear-gradient(145deg,#eadfd0,#f9f5ee); }
.cc-product-copy { min-height:106px; padding:15px 10px 14px; text-align:center; }
.cc-product-name { font-family:var(--cc-brand); font-size:18px; font-weight:400; line-height:1.1; }
.cc-product-desc { margin-top:6px; color:#625347; font-family:var(--cc-serif); font-size:14px; line-height:1.3; }

/* PROMO */
.cc-promo { padding:0 0 50px; background:var(--cc-cream-light); }
.cc-promo-card { position:relative; min-height:300px; display:flex; align-items:center; overflow:hidden; background:linear-gradient(120deg,#321a0e,#5b3b2a); color:#fff; }
.cc-promo-card::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 80% 50%,rgba(255,255,255,.10),transparent 34%); }
.cc-promo-copy { position:relative; z-index:2; padding:45px; }
.cc-promo-title { font-family:var(--cc-brand); font-size:clamp(32px,3vw,50px); line-height:1; }
.cc-promo-sub { margin-top:9px; font-family:var(--cc-serif); font-size:26px; font-style:italic; }

/* PRALINE */
.cc-praline { padding:0 0 52px; background:var(--cc-cream-light); }
.cc-praline-card { position:relative; display:block; min-height:300px; overflow:hidden; background-color:var(--cc-brown); background-size:cover; background-position:center; }
.cc-praline-card::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(24,13,7,.70),rgba(24,13,7,.18) 60%,transparent); }
.cc-praline-copy { position:absolute; z-index:2; left:48px; top:50%; transform:translateY(-50%); color:#fff; }
.cc-praline-title { font-family:var(--cc-serif); font-size:48px; line-height:1; letter-spacing:.04em; }
.cc-praline-sub { margin-top:8px; font-family:var(--cc-serif); font-style:italic; font-size:26px; }

/* RITUAL */
.cc-ritual { padding:100px 0 105px; background:var(--cc-paper); text-align:center; }
.cc-big-title { margin:0; font-family:var(--cc-serif); font-size:clamp(52px,5.2vw,91px); font-weight:400; line-height:.94; letter-spacing:-.025em; }
.cc-ritual .cc-big-title { margin-bottom:65px; }
.cc-ritual-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--cc-line); border-bottom:1px solid var(--cc-line); }
.cc-ritual-item { padding:40px 25px 44px; border-right:1px solid var(--cc-line); }
.cc-ritual-item:last-child { border-right:0; }
.cc-ritual-number { color:var(--cc-gold); font-family:var(--cc-serif); font-size:39px; font-style:italic; line-height:1; }
.cc-ritual-label { margin-top:11px; font-family:var(--cc-brand); font-size:22px; line-height:1.1; }

/* STORY */
.cc-story { display:grid; grid-template-columns:1.05fr .95fr; min-height:720px; background:var(--cc-brown); color:#fff; }
.cc-story-photo { min-height:690px; background-size:cover; background-position:center; background-repeat:no-repeat; background-color:#5a3a29; }
.cc-story-copy { display:flex; flex-direction:column; justify-content:center; padding:90px max(6vw,70px); }
.cc-story .cc-eyebrow { color:#d1af70; }
.cc-story h2 { color:#fff; margin-bottom:34px; }
.cc-story p { max-width:590px; margin:0 0 18px; color:rgba(255,255,255,.78); font-family:var(--cc-serif); font-size:21px; line-height:1.48; }
.cc-story .cc-btn { align-self:flex-start; margin-top:18px; color:#fff; border-color:rgba(255,255,255,.7); }

/* SHARE */
.cc-share { padding:118px 35px 122px; background:var(--cc-cream-dark); text-align:center; }
.cc-share h2 { max-width:1220px; margin:0 auto; }
.cc-share-sign { margin-top:40px; color:var(--cc-gold); font-family:var(--cc-brand); font-size:16px; letter-spacing:.08em; }

/* ORDER */
.cc-order { padding:94px 0 105px; background:var(--cc-paper); text-align:center; }
.cc-order .cc-big-title { margin-bottom:59px; }
.cc-steps { display:grid; grid-template-columns:repeat(3,1fr); max-width:1250px; margin:0 auto 46px; }
.cc-step { padding:15px 58px 31px; border-right:1px solid var(--cc-line); }
.cc-step:last-child { border-right:0; }
.cc-step-num { color:var(--cc-gold); font-family:var(--cc-serif); font-size:60px; font-style:italic; line-height:1; }
.cc-step h3 { margin:13px 0 10px; font-family:var(--cc-brand); font-size:20px; font-weight:400; }
.cc-step p { max-width:255px; margin:0 auto; color:#65564a; font-family:var(--cc-serif); font-size:18px; line-height:1.35; }

/* VALUES */
.cc-values { padding:50px 0; background:#f0e7da; }
.cc-values-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.cc-value { padding:0 42px; text-align:center; border-right:1px solid var(--cc-line); }
.cc-value:last-child { border-right:0; }
.cc-value-icon { height:52px; display:flex; align-items:center; justify-content:center; margin-bottom:11px; color:var(--cc-gold); font-family:var(--cc-serif); font-size:42px; }
.cc-value-title { font-family:var(--cc-brand); font-size:16px; font-weight:400; }
.cc-value p { max-width:240px; margin:7px auto 0; color:#66584c; font-family:var(--cc-serif); font-size:16px; line-height:1.35; }

/* FOOTER */
.cc-footer { padding:70px 0 34px; background:var(--cc-brown-dark); color:#fff; }
.cc-footer-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr 1fr; gap:60px; }
.cc-footer-logo { font-family:var(--cc-brand); font-size:29px; letter-spacing:.05em; }
.cc-footer p { margin-top:11px; color:rgba(255,255,255,.58); font-size:13px; }
.cc-footer h4 { margin:0 0 17px; color:#cfaa6d; font-family:var(--cc-brand); font-size:16px; font-weight:400; }
.cc-footer a { display:block; margin:7px 0; color:rgba(255,255,255,.72); font-size:13px; }
.cc-footer a:hover { color:#fff; }
.cc-copyright { margin-top:55px; padding-top:25px; border-top:1px solid rgba(255,255,255,.09); color:rgba(255,255,255,.35); font-size:11px; }

/* GENERIC PAGES */
.cc-page { min-height:60vh; padding:80px 0; background:var(--cc-paper); }
.cc-page article { max-width:900px; margin:0 auto; }
.cc-page h1 { font-family:var(--cc-serif); font-size:64px; font-weight:400; line-height:1; }
.cc-page .entry-content { font-size:18px; }

@media(max-width:1200px){
  .cc-nav { gap:26px; }
  .cc-nav a { font-size:16px; }
  .cc-brand img.custom-logo { width:340px; max-width:340px; }
  .cc-brand-text { font-size:34px; }
  .cc-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media(max-width:900px){
  .cc-wrap { width:calc(100% - 40px); }
  .cc-header { height:86px; }
  .cc-nav-left { display:none; }
  .cc-nav-right { margin-left:auto; }
  .cc-nav-right a:not(.cc-order-top) { display:none; }
  .cc-brand { left:22px; transform:translateY(-50%); justify-content:flex-start; }
  .cc-brand img.custom-logo { width:250px; max-width:250px; }
  .cc-brand-text { font-size:28px; letter-spacing:.05em; }
  .cc-hero { height:690px; min-height:690px; background-position:63% center; }
  .cc-hero::before { background:linear-gradient(90deg,rgba(248,244,237,.93) 0%,rgba(248,244,237,.76) 50%,rgba(248,244,237,.1) 100%); }
  .cc-hero-copy { left:5vw; width:56%; }
  .cc-story { grid-template-columns:1fr; }
  .cc-story-photo { min-height:560px; }
  .cc-ritual-grid { grid-template-columns:1fr 1fr; }
  .cc-ritual-item:nth-child(2) { border-right:0; }
  .cc-ritual-item:nth-child(-n+2) { border-bottom:1px solid var(--cc-line); }
  .cc-steps { grid-template-columns:1fr; }
  .cc-step { border-right:0; border-bottom:1px solid var(--cc-line); padding:35px 20px; }
  .cc-footer-grid { grid-template-columns:1fr 1fr; }
}

@media(max-width:650px){
  .cc-wrap { width:calc(100% - 28px); }
  .cc-header { height:76px; }
  .cc-brand { left:16px; }
  .cc-brand img.custom-logo { width:190px; max-width:190px; }
  .cc-brand-text { font-size:21px; }
  .cc-nav-right { margin-left:auto; }
  .cc-order-top { min-height:34px; padding:0 14px!important; font-size:13px!important; }
  .cc-hero { height:650px; min-height:650px; background-position:68% center; }
  .cc-hero::before { background:linear-gradient(90deg,rgba(248,244,237,.96) 0%,rgba(248,244,237,.84) 57%,rgba(248,244,237,.15) 100%); }
  .cc-hero-copy { left:24px; width:calc(100% - 48px); }
  .cc-hero h1 { font-size:49px; }
  .cc-hero-tagline { max-width:310px; font-size:31px; }
  .cc-actions { gap:10px; }
  .cc-btn { min-height:48px; padding:0 18px; font-size:9px; }
  .cc-product-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .cc-product-name { font-size:15px; }
  .cc-product-desc { font-size:12px; }
  .cc-ritual-grid, .cc-values-grid, .cc-footer-grid { grid-template-columns:1fr; }
  .cc-ritual-item, .cc-value { border-right:0; border-bottom:1px solid var(--cc-line); }
  .cc-story-photo { min-height:430px; }
  .cc-story-copy { padding:70px 27px; }
  .cc-share { padding:82px 23px; }
  .cc-big-title { font-size:48px; }
}