/*
 * Caffé Trieste — Figma fidelity pass v0.2.0
 * Reference: Figma project 0:1, desktop home 2:29 / mobile home 31:719.
 * Increments the installed v0.1.0 theme; all editable media settings are preserved.
 */

/* Layout, mark, and header align to the 1920/1600 Figma frame. */
@media (min-width:1240px){
  .ct-container{width:min(1600px,calc(100% - 2 * clamp(32px,8.333333vw,160px)))}
}
.ct-logo__figma{display:block;width:173px;height:110px;object-fit:contain}
.ct-logo:hover{opacity:.88}
.ct-header__inner{isolation:isolate}
.ct-shipping-bar{background:#eadccf;color:#483b35}
.ct-header__right{column-gap:8px}
.ct-logo img{border:0}
.ct-cart-trigger .ct-cart-count{pointer-events:none}

/* HOME: original photography from the supplied Figma raster assets. */
.ct-home__hero-wrap{margin-bottom:63px}
.ct-hero{background-color:#191b1a;background-position:center}
.ct-hero.ct-has-image{
  background-image:linear-gradient(90deg,rgba(10,14,13,.88) 0%,rgba(10,14,13,.54) 38%,rgba(10,14,13,.04) 76%),var(--ct-hero-image);
  background-position:center center;
  background-size:cover;
}
.ct-hero__content{margin-left:clamp(24px,5.6%,90px);width:min(720px,76%)}
.ct-hero h1{font-size:clamp(43px,4.1vw,78px);font-weight:700;letter-spacing:-.047em;max-width:680px}
.ct-business{background-color:#272523}
.ct-business.ct-has-image{
 background-image:linear-gradient(90deg,rgba(10,14,13,.82) 0%,rgba(10,14,13,.6) 40%,rgba(10,14,13,.07) 100%),var(--ct-b2b-image);
 background-position:center 43%;background-size:cover;
}
.ct-business__content{position:relative;z-index:1}
.ct-business h2{max-width:710px}

/* Brand story, Figma desktop frame 4959 (1600 x 1278 composition).
 * Portrait at x272/y491, berry image at x952/y70, copy at x952/y891.
 */
.ct-story{position:relative;overflow:hidden;margin-bottom:63px}
.ct-story__photo{padding:0;border-radius:16px;display:block;background:#e7ded1}
.ct-story__photo img{display:block;width:100%;height:100%;object-fit:cover}
.ct-story__beans{display:none;pointer-events:none;user-select:none}
@media(min-width:1240px){
  .ct-story__layout{position:relative;display:block;min-height:0;aspect-ratio:1600/1278}
  .ct-story__heading{position:absolute;left:0;top:9.86%;width:49%;padding:0;margin:0;z-index:2}
  .ct-story__heading h2{max-width:none;font-size:clamp(36px,3vw,57px);font-weight:500;line-height:1.16;letter-spacing:-.042em}
  .ct-story__photo--first{position:absolute;left:17%;top:38.42%;width:32%;height:57.28%;max-height:none;margin:0;align-self:initial;z-index:1}
  .ct-story__photo--second{position:absolute;left:59.5%;top:5.48%;width:32%;height:57.28%;max-height:none;margin:0;align-self:initial;z-index:1}
  .ct-story__text{position:absolute;left:59.5%;top:69.72%;width:32%;margin:0;z-index:2;font-size:clamp(16px,1.2vw,22px);line-height:1.5}
  .ct-story__text p{margin-bottom:24px}
  .ct-story__beans{display:block;position:absolute;width:59%;height:auto;max-width:none;left:81.75%;top:0;z-index:0;object-fit:contain}
}
@media (min-width:768px) and (max-width:1239px){
  .ct-story__layout{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto;gap:26px;min-height:0}
  .ct-story__heading{grid-column:1;grid-row:1;padding:0;align-self:center}
  .ct-story__heading h2{font-size:clamp(30px,3.6vw,47px)}
  .ct-story__photo--second{grid-column:2;grid-row:1;height:520px;width:100%;margin:0;align-self:stretch;max-height:none}
  .ct-story__photo--first{grid-column:1;grid-row:2;height:560px;width:100%;margin:0;align-self:stretch;max-height:none}
  .ct-story__text{grid-column:2;grid-row:2;font-size:20px;align-self:center;margin:0}
}

/* Editorial cards use actual featured media; missing thumbnails get a design image. */
.ct-blog-card__image{overflow:hidden}
.ct-blog-card__image img{transition:transform .4s ease}
.ct-blog-card:hover .ct-blog-card__image img{transform:scale(1.035)}

/* Figma footer: brand statement and three navigational columns, no WP default sidebar. */
.ct-footer{background:#f3ebe0}
.ct-footer__intro{padding:80px 0 64px;border-bottom:0;align-items:flex-end}
.ct-footer__intro h2{max-width:600px;font-size:clamp(37px,3.1vw,56px);line-height:1.14}
.ct-footer__columns{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;padding:45px 0 85px}
.ct-footer__columns h3{font-size:17px;font-weight:700;margin-bottom:26px}
.ct-footer-links li{margin-bottom:23px}
.ct-footer-links a{font-size:15px}
.ct-footer__bottom{border-top:1px solid #dccfbe}
.ct-footer__credit{display:inline-flex;align-items:center;gap:12px}
.ct-footer__credit img{display:block;width:110px;height:auto;max-height:30px;object-fit:contain}
.ct-footer__top{flex:none}

/* Responsive composition measured from the 360px Figma mobile frame. */
@media(max-width:1239px){
  .ct-logo__figma{width:120px;height:auto;max-height:80px}
}
@media(max-width:767px){
  .ct-logo__figma{width:95px;height:auto;max-height:68px}
  .ct-header__inner{height:87px}
  .ct-home__hero-wrap{margin-bottom:42px}
  .ct-hero{min-height:587px}
  .ct-hero.ct-has-image{
    background-image:linear-gradient(0deg,rgba(8,11,9,.9),rgba(8,11,9,.36) 55%,rgba(8,11,9,.05)),var(--ct-hero-image);
    background-position:64% center;
  }
  .ct-hero__content{width:100%;margin:0;padding:32px 23px 38px}
  .ct-hero h1{font-size:clamp(35px,10.5vw,43px);max-width:320px}
  .ct-hero__kicker{font-size:17px;margin-bottom:12px}
  .ct-story{margin-bottom:42px}
  .ct-story__layout{display:flex;flex-direction:column;min-height:0;gap:24px}
  .ct-story__heading{order:1;padding:0}
  .ct-story__heading h2{font-size:clamp(27px,7.5vw,33px);line-height:1.2}
  .ct-story__photo--first{order:0;display:block;width:100%;height:338px;margin:0;max-height:none}
  .ct-story__photo--second{order:2;display:block;width:100%;height:382px;margin:0;max-height:none}
  .ct-story__text{order:3;margin:0;font-size:17px;line-height:1.58}
  .ct-story__beans{display:none}
  .ct-business.ct-has-image{background-position:64% center;background-image:linear-gradient(0deg,rgba(10,13,12,.85),rgba(10,13,12,.38) 75%),var(--ct-b2b-image)}
  .ct-business h2{font-size:40px}
  .ct-footer__intro{padding:40px 0 25px}
  .ct-footer__intro h2{font-size:39px;max-width:290px}
  .ct-footer__columns{grid-template-columns:1fr;gap:28px;padding:25px 0 58px}
  .ct-footer__spacer{display:none}
  .ct-footer__columns h3{margin-bottom:14px}
  .ct-footer-links li{margin-bottom:13px}
  .ct-footer__bottom .ct-container{flex-direction:column;align-items:flex-start;gap:8px;padding:18px 0}
}
@media(prefers-reduced-motion:reduce){.ct-blog-card__image img{transition:none}}
