/**
 * Caffé Trieste — fidelity pass v0.3.0
 * Source of truth: user-provided Figma JSON, components and 497-SVG archive.
 * Figma: page fill #FAF6ED, footer fill #E7DED1, header hover #191919 / 20px.
 * Hero special CTA: 251x63 hover, icon 63 -> 48; 300ms EASE_IN_AND_OUT_BACK.
 */
:root {
  --ct-page:#faf6ed;
  --ct-footer-surface:#e7ded1;
  --ct-hover-dark:#191919;
  --ct-icon-muted:#674c47;
  --ct-icon-hover:#f3ebe0;
  --ct-special-light:#fff2df;
}
html,body,.ct-theme{background-color:var(--ct-page)}
.ct-header{background:var(--ct-page)}
.ct-footer{background:var(--ct-footer-surface)}
.ct-footer__bottom{background:var(--ct-page);border-top:0}
.ct-header,.ct-footer,.ct-hero,.ct-business{color:var(--ct-text)}
.ct-hero,.ct-business{color:#fff}

/* Real exported Figma icons, not typographic fallback glyphs. */
.ct-svg-icon {display:inline-block;flex:none;width:24px;height:24px;background-color:currentColor;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
.ct-svg-icon--user {-webkit-mask-image:url('../icons/fi-rr-user.svg');mask-image:url('../icons/fi-rr-user.svg')}
.ct-svg-icon--heart {-webkit-mask-image:url('../icons/fi-rr-heart.svg');mask-image:url('../icons/fi-rr-heart.svg')}
.ct-svg-icon--shopping-bag {-webkit-mask-image:url('../icons/fi-rr-shopping-bag.svg');mask-image:url('../icons/fi-rr-shopping-bag.svg')}
.ct-svg-icon--truck-side {-webkit-mask-image:url('../icons/fi-rr-truck-side.svg');mask-image:url('../icons/fi-rr-truck-side.svg')}
.ct-svg-icon--arrow-right {-webkit-mask-image:url('../icons/fi-rr-arrow-right.svg');mask-image:url('../icons/fi-rr-arrow-right.svg')}
.ct-svg-icon--arrow-up {-webkit-mask-image:url('../icons/fi-rr-arrow-up.svg');mask-image:url('../icons/fi-rr-arrow-up.svg')}
.ct-svg-icon--arrow-left {-webkit-mask-image:url('../icons/fi-rr-arrow-left.svg');mask-image:url('../icons/fi-rr-arrow-left.svg')}
.ct-svg-icon--angle-small-left {-webkit-mask-image:url('../icons/fi-rr-angle-small-left.svg');mask-image:url('../icons/fi-rr-angle-small-left.svg')}
.ct-svg-icon--angle-small-right {-webkit-mask-image:url('../icons/fi-rr-angle-small-right.svg');mask-image:url('../icons/fi-rr-angle-small-right.svg')}
.ct-svg-icon--menu-burger {-webkit-mask-image:url('../icons/fi-rr-menu-burger.svg');mask-image:url('../icons/fi-rr-menu-burger.svg')}
.ct-svg-icon--shopping-bag-add {-webkit-mask-image:url('../icons/fi-rr-shopping-bag-add.svg');mask-image:url('../icons/fi-rr-shopping-bag-add.svg')}
.ct-svg-icon--search {-webkit-mask-image:url('../icons/fi-rr-search.svg');mask-image:url('../icons/fi-rr-search.svg')}
.ct-shipping-bar .ct-svg-icon{width:24px;height:24px}

/* Main site navigation: Figma menu-button 170x63, radius 30, slow hover. */
.ct-nav-list>li>a,.ct-nav-extra{transition:background-color 1.25s cubic-bezier(.2,.8,.2,1), color 1.25s cubic-bezier(.2,.8,.2,1)}
.ct-nav-list>li>a:hover,.ct-nav-extra:hover,.ct-nav-list .current-menu-item>a{background:#191919;color:#f3ebe0}

/* Header Figma button-icon-header 64x63, square-corner-on-hover (20px). */
.ct-header .ct-icon-link {width:64px;height:63px;border-radius:30px;color:var(--ct-icon-muted);background:transparent;
 transition:background-color .3s ease-out,color .3s ease-out,border-radius .3s ease-out;}
.ct-header .ct-icon-link:hover,.ct-header .ct-icon-link:focus-visible {background:var(--ct-hover-dark);color:var(--ct-icon-hover);border-radius:20px}
.ct-header .ct-account-link{transition-duration:1.25s}
.ct-header .ct-cart-count{z-index:2;top:14px;right:10px;background:#d13239;color:#fff;border-radius:24px}
.ct-header .ct-logo{flex:none}
.ct-header .ct-svg-icon{width:24px;height:24px}

/* Special CTA: exact compositional states, with non-jumping arrow disk. */
.ct-special-cta{display:inline-flex;align-items:center;justify-content:space-between;min-height:63px;
  border-radius:30px;background:transparent;color:#191919;text-decoration:none;
  transition:background-color .3s cubic-bezier(.68,-.32,.27,1.31),color .3s ease;
  overflow:hidden;max-width:100%;}
.ct-special-cta__label{min-height:63px;padding:13px 33px;background:#fff;border-radius:30px;
 display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;
 font:500 17.2px/25.2px var(--ct-font-button);letter-spacing:-.18px;
 transition:background-color .3s cubic-bezier(.68,-.32,.27,1.31),border-radius .3s ease;}
.ct-special-cta__disk{width:63px;height:63px;flex:none;background:var(--ct-special-light);border-radius:50%;
 display:grid;place-items:center;margin-left:0;color:#191919;
 transition:width .3s cubic-bezier(.68,-.32,.27,1.31),height .3s cubic-bezier(.68,-.32,.27,1.31),margin .3s cubic-bezier(.68,-.32,.27,1.31),background-color .3s ease,color .3s ease;}
.ct-special-cta__disk .ct-svg-icon{width:29px;height:29px;transform:rotate(-135deg);
 transition:transform .3s cubic-bezier(.68,-.32,.27,1.31),width .3s ease,height .3s ease;}
.ct-special-cta:hover,.ct-special-cta:focus-visible{background:var(--ct-special-light);color:#191919}
.ct-special-cta:hover .ct-special-cta__label,.ct-special-cta:focus-visible .ct-special-cta__label{background:transparent}
.ct-special-cta:hover .ct-special-cta__disk,.ct-special-cta:focus-visible .ct-special-cta__disk{background:#191919;color:var(--ct-special-light);width:48px;height:48px;margin:7.5px}
.ct-special-cta:hover .ct-special-cta__disk .ct-svg-icon,.ct-special-cta:focus-visible .ct-special-cta__disk .ct-svg-icon{transform:rotate(0deg);width:24px;height:24px}

/* Hero text hierarchy is defined by Figma, not by v0.2.0's reversed headings. */
.ct-hero__content{width:min(900px,80%)}
.ct-hero h1{font-size:clamp(56px,4.5vw,92px);line-height:1.02;max-width:890px;margin-bottom:14px;font-weight:700;letter-spacing:-.035em}
.ct-hero__subtitle{font-size:clamp(21px,1.67vw,32px);font-weight:400;line-height:1.3;letter-spacing:-.02em;margin:0 0 48px;max-width:900px}
.ct-business h2{font-size:clamp(50px,4.2vw,82px);line-height:1.06;max-width:900px;margin-bottom:10px;font-weight:700}
.ct-business__subtitle{font-size:clamp(24px,2.2vw,42px);line-height:1.2;font-weight:600;margin:0 0 42px}
.ct-business__content{max-width:1100px;width:100%}

/* Carousels: buttons are Figma arrow-icon-button variants, not typographic arrows. */
.ct-arrow{border-radius:20px;color:#674c47;border:1px solid #674c47;display:inline-grid;place-items:center;
 transition:background .3s ease,color .3s ease,border-radius .3s ease}
.ct-arrow:hover,.ct-arrow:focus-visible{color:#fff2df;background:#674c47;border-color:#674c47;border-radius:20px}
.ct-arrow .ct-svg-icon{width:24px;height:24px}
/* Text buttons: Figure 136:21154 hover #282727; outline hover #674C47 */
.ct-button:not(.ct-button--outline):not(.ct-button--cream):hover,
.ct-card-button:not(.ct-card-button--outline):hover{background:#282727;border-color:#282727;color:#fff}
.ct-button--outline:hover,.ct-card-button--outline:hover{background:#674c47;border-color:#674c47;color:#fff2df}

/* Footer: source Figma 127:11159, #E7DED1 section + #FAF6ED separate credits strip. */
.ct-footer__intro{display:flex;align-items:center;justify-content:space-between;padding:65px 0 60px}
.ct-footer__intro h2{max-width:670px}
.ct-footer__social{display:flex;align-items:center;gap:12px;margin-left:auto}
.ct-footer__social-link,.ct-footer__top{display:inline-grid;place-items:center;width:63px;height:63px;
 border:1px solid #674c47;border-radius:20px;color:#191919;background:transparent;
 font-size:25px;font-weight:600;line-height:1;transition:background-color .3s ease,color .3s ease,border-radius .3s ease}
.ct-footer__social-link:hover,.ct-footer__top:hover,.ct-footer__social-link:focus-visible,.ct-footer__top:focus-visible{background:#191919;color:#fff;border-radius:20px}
.ct-footer__top .ct-svg-icon{width:24px;height:24px}
.ct-footer__columns{padding-top:28px;padding-bottom:70px}
.ct-footer__bottom .ct-container{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:72px;
 padding-top:18px;padding-bottom:18px;color:#4c4341;font-size:14px}
.ct-footer__attributions{display:flex;justify-content:flex-end;align-items:center;gap:30px;flex-wrap:wrap}
.ct-footer__designer,.ct-footer__credit{display:inline-flex;align-items:center;gap:9px;white-space:nowrap}
.ct-footer__designer-mark{font-family:var(--ct-font);font-size:24px;font-weight:800;letter-spacing:-.035em;line-height:1;color:#191919}
.ct-footer__designer-mark::first-letter{color:#d7a43b}
.ct-footer__credit img{display:block;max-width:110px;max-height:27px;width:auto;object-fit:contain}
.ct-footer a:not(.ct-footer__top):not(.ct-footer__social-link):focus-visible{outline-color:#191919}

/* No forced white canvas at any breakpoint. */
@media (max-width:1239px){
 .ct-header .ct-icon-link{width:56px;height:56px}
 .ct-header .ct-cart-count{top:9px;right:6px}
 .ct-special-cta__label{padding-inline:23px}
 .ct-hero h1{font-size:clamp(50px,5.9vw,74px)}
 .ct-hero__subtitle{font-size:clamp(21px,2.3vw,29px)}
}
@media (max-width:767px){
 .ct-header .ct-icon-link{width:44px;height:44px;border-radius:18px}
 .ct-header .ct-icon-link:hover{border-radius:14px}
 .ct-header .ct-cart-count{top:0;right:0}
 .ct-hero__content{width:100%}
 .ct-hero h1{font-size:clamp(42px,11.8vw,58px);margin-bottom:7px;line-height:1.07}
 .ct-hero__subtitle{font-size:clamp(17px,4.7vw,22px);margin-bottom:27px;line-height:1.35}
 .ct-special-cta{min-height:48px}
 .ct-special-cta__label{min-height:48px;padding:11px 17px;font-size:14px}
 .ct-special-cta__disk{height:48px;width:48px}
 .ct-special-cta__disk .ct-svg-icon{width:22px;height:22px}
 .ct-special-cta:hover .ct-special-cta__disk,.ct-special-cta:focus-visible .ct-special-cta__disk{width:38px;height:38px;margin:5px}
 .ct-special-cta:hover .ct-special-cta__disk .ct-svg-icon{width:20px;height:20px}
 .ct-business h2{font-size:clamp(38px,10vw,54px);margin-bottom:8px}
 .ct-business__subtitle{font-size:clamp(22px,5vw,28px);margin-bottom:24px}
 .ct-arrow{border-radius:16px}
 .ct-footer__intro{align-items:flex-start;flex-wrap:wrap;gap:18px}
 .ct-footer__social{width:100%;justify-content:flex-end}
 .ct-footer__social-link,.ct-footer__top{width:45px;height:45px;border-radius:14px}
 .ct-footer__bottom .ct-container{align-items:flex-start;gap:16px}
 .ct-footer__attributions{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;justify-content:flex-start}
 .ct-footer__designer-mark{font-size:20px}
}
@media (prefers-reduced-motion:reduce){
 .ct-special-cta,.ct-special-cta__label,.ct-special-cta__disk,.ct-special-cta__disk .ct-svg-icon,
 .ct-header .ct-icon-link,.ct-nav-list>li>a,.ct-nav-extra,.ct-arrow,.ct-footer__top,.ct-footer__social-link{transition:none}
}
