/* it-t10-caterer.css: caterer page, the owner's professional-services mockup scaled
   (tools/trades10/pack-professional/visual-references/caterer.png, 807 wide). --u = one mockup pixel;
   every position, size and color below is the mockup's own, measured. Built by
   tools/trades10/caterer.py. */
main.t-caterer{container-type:inline-size;--u:calc(min(100cqw,1440px) / 807);
  --ct-ink:#0B131A;--ct-sub:#5C6069;--ct-or:#F26207;--ct-line:#E6E8EA;
  --ct-font:Inter,'Inter Fallback',-apple-system,"Segoe UI",Roboto,sans-serif;font-family:var(--ct-font);background:#FCFCFB}
.t-caterer .ct-board{position:relative}
.t-caterer .ct-art{position:relative;width:calc(807 * var(--u));height:calc(var(--h) * var(--u));margin:0 auto}
.t-caterer .ct-a{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));width:calc(var(--w, 0) * var(--u))}
.t-caterer h1,.t-caterer h2,.t-caterer h3{font-family:var(--ct-font);color:var(--ct-ink);letter-spacing:-.018em}
.ct-c{text-align:center}
.t-caterer .ct-h2{font-weight:700;font-size:calc(20.6 * var(--u));line-height:calc(26 * var(--u));letter-spacing:-.022em}
.t-caterer .ct-rec .ct-h2{letter-spacing:-.05em}
.ct-sub{font-size:calc(9.5 * var(--u));line-height:calc(15 * var(--u));letter-spacing:-.01em;color:var(--ct-sub)}
.ct-vrule{width:1px!important;height:calc(var(--h2) * var(--u));background:#E1E4E6}
.ct-i{display:block;width:100%;height:auto}
.ct-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ct-btn{display:flex;align-items:center;justify-content:center;gap:calc(8 * var(--u));height:calc(34 * var(--u));
  background:var(--cta);color:#fff!important;border-radius:calc(4 * var(--u));font:700 calc(11.2 * var(--u))/1 var(--ct-font);
  text-decoration:none!important;box-shadow:0 calc(8 * var(--u)) calc(18 * var(--u)) calc(-10 * var(--u)) rgba(192,78,6,.7);transition:background .16s ease-out}
.ct-btn:hover{background:var(--cta-h)}
.ct-btn svg{width:calc(12 * var(--u));height:calc(12 * var(--u));flex:none;stroke:#fff}

/* hero */
.ct-hero{overflow:hidden;background:#FCFCFB}
.ct-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.ct-eyebrow{font:700 calc(7.5 * var(--u))/calc(11 * var(--u)) var(--ct-font);letter-spacing:.14em;text-transform:uppercase;color:#E7540E}
.t-caterer .ct-h1{display:block}
.ct-k{position:absolute;left:0;bottom:100%;margin-bottom:calc(30 * var(--u));white-space:nowrap;
  font:700 calc(8.3 * var(--u))/1.2 var(--ct-font);letter-spacing:.14em;text-transform:uppercase;color:var(--cta)}
.ct-big{display:block;font-weight:700;font-size:calc(27.8 * var(--u));line-height:calc(32 * var(--u));letter-spacing:-.045em;color:#0A0F16}
.ct-lede{font-size:calc(10.1 * var(--u));line-height:calc(16 * var(--u));color:#29303D}
.ct-pi{height:calc(17.5 * var(--u))}
.ct-pico{stroke:#16222E}
.ct-proof{font-size:calc(7.2 * var(--u));line-height:calc(11.6 * var(--u));color:#5C6069}

/* hero invoice: drawn over the photographed one, crisp */
.t-caterer .ct-inv{position:absolute;left:calc(519 * var(--u));top:calc(45 * var(--u));width:calc(239 * var(--u));
  height:calc(262 * var(--u));background:#FDFDFC;border-radius:calc(1 * var(--u));
  box-shadow:0 calc(14 * var(--u)) calc(30 * var(--u)) calc(-14 * var(--u)) rgba(11,19,26,.28),0 0 calc(2 * var(--u)) rgba(11,19,26,.05)}
.ct-doc{position:absolute;inset:0;display:block;color:#1E2733}
.ct-doc>span{position:absolute}
.ct-iwm{left:calc(13 * var(--u));top:calc(11.8 * var(--u));font:700 calc(12.2 * var(--u))/1 var(--ct-font);letter-spacing:-.03em;color:#0B131A}
.ct-iwm b{color:var(--ct-or);font-weight:700}
.ct-ititle{left:calc(13 * var(--u));top:calc(40.8 * var(--u));font:700 calc(11.2 * var(--u))/1 var(--ct-font);letter-spacing:-.03em;color:#0B131A}
.ct-imeta{right:calc(7 * var(--u));top:calc(30 * var(--u));text-align:right;font:400 calc(6.6 * var(--u))/calc(9.4 * var(--u)) var(--ct-font);color:#33404D}
.ct-ifrom{left:calc(13 * var(--u));top:calc(71.5 * var(--u));font:400 calc(6.4 * var(--u))/calc(8.6 * var(--u)) var(--ct-font);color:#33404D}
.ct-ifrom b{font-weight:400;color:#1E2733}
.ct-ifrom2{left:calc(150 * var(--u))}
.ct-itab{left:calc(14 * var(--u));top:calc(118 * var(--u));width:calc(219 * var(--u));border:1px solid #E3E6E8}
.ct-ith,.ct-itr{display:grid;grid-template-columns:calc(99 * var(--u)) calc(25 * var(--u)) calc(52 * var(--u)) 1fr;align-items:center}
.ct-ith{height:calc(13.6 * var(--u));background:#F2F3F4;font:700 calc(5.8 * var(--u))/1 var(--ct-font);letter-spacing:-.01em;color:#0B131A}
.ct-itr{height:calc(13.3 * var(--u));border-top:1px solid #E9EBEC;font:400 calc(5.4 * var(--u))/1 var(--ct-font);letter-spacing:-.02em;color:#33404D;white-space:nowrap}
.ct-ith span,.ct-itr span{padding:0 calc(4 * var(--u));text-align:right;overflow:hidden}
.ct-ith span:first-child,.ct-itr span:first-child{text-align:left}
.ct-ith span:nth-child(2),.ct-itr span:nth-child(2){text-align:center}
.ct-ith span+span,.ct-itr span+span{border-left:1px solid #E9EBEC}
.ct-itot{right:calc(7 * var(--u));top:calc(239.5 * var(--u));display:flex;gap:calc(10 * var(--u));align-items:baseline;
  font:700 calc(6.8 * var(--u))/1 var(--ct-font);color:#0B131A}
.ct-itot b{font-size:calc(7.4 * var(--u))}
.t-caterer .ct-inv .t10-edit{bottom:8%}

/* the menu is the agreement */
.ct-menu{background:#FCFCFB}
.ct-menu-img{height:auto;display:block}
.ct-leads{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ct-ai{height:calc(25 * var(--u))}
.ct-aico{stroke:#0F1D28}
.ct-ah{font:700 calc(9 * var(--u))/1 var(--ct-font)}
.ct-ap{font-size:calc(7.4 * var(--u));line-height:calc(12 * var(--u));color:var(--ct-sub)}

/* the event meal map */
.ct-map{background:#F0F3F4;overflow:hidden}
.ct-map-img{position:absolute;left:0;top:calc(55 * var(--u));width:100%;height:auto;display:block}
.ct-mh{font:700 calc(9.4 * var(--u))/1 var(--ct-font)}
.ct-mp{font-size:calc(7.4 * var(--u));line-height:calc(12 * var(--u));color:var(--ct-sub)}

/* price the whole service */
.ct-price{background:#FBFAFA}
.t-caterer .ct-price .ct-sub{font-size:calc(10.4 * var(--u))}
.ct-ti{height:calc(33 * var(--u))}
.ct-tico{stroke:#101A24}
.ct-th{font:700 calc(10.1 * var(--u))/1 var(--ct-font);color:var(--ct-ink)}
.ct-tp{font-size:calc(9.2 * var(--u));line-height:calc(15 * var(--u));color:#545E64}
/* the icon and the two text spans inside are positioned off .ct-art directly (their nearest
   positioned ancestor), so without its own size the link itself had no visible box: reachable by
   keyboard, invisible when it got there. Its own --x/--y/--w/--h (caterer.py) cover the card. */
.ct-tool{display:block;text-decoration:none!important;height:calc(var(--h) * var(--u))}
.ct-tool:hover .ct-th{color:var(--cta)}

/* catering template studio: the photographed cards open their designs */
.ct-studio{overflow:hidden;background:#F7F5F3}
.ct-shot{position:absolute;inset:0}
.ct-studio-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.t-caterer .ct-card{position:absolute;left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));
  width:calc(var(--w) * var(--u));height:calc(var(--h2) * var(--u));border-radius:calc(2 * var(--u))}
.t-caterer .ct-card .t10-edit{bottom:6%}
.ct-btn-s{height:calc(31 * var(--u));font-size:calc(10.6 * var(--u))}
.ct-strip{padding-block:calc(26 * var(--u)) calc(34 * var(--u));background:#FCFCFB}

/* payment band: the page's only QR */
.ct-pay{background:#183238}
.ct-qr-card{height:calc(78 * var(--u));background:#fff;padding:calc(4.5 * var(--u))}
.t-caterer .ct-pay-h{font:700 calc(15.4 * var(--u))/1 var(--ct-font);color:#fff}
.ct-pay-m{font:700 calc(10.4 * var(--u))/1 var(--ct-font);color:#F2F6F6}
.ct-pay-s{font:400 calc(9.4 * var(--u))/1 var(--ct-font);color:#A9B9BB}
.ct-pay-div{width:1px!important;height:calc(var(--h2) * var(--u));background:rgba(255,255,255,.34)}
.ct-pri{height:calc(17 * var(--u))}
.ct-prico{stroke:#fff}
.ct-prt{font:400 calc(8.5 * var(--u))/1 var(--ct-font);color:#EDF2F2}

/* a clear record through the event */
.ct-rec{background:#F9FAF8}
.ct-ri{height:calc(25.5 * var(--u))}
.ct-rico{stroke:#E8480A}
.ct-rh{font:700 calc(9.4 * var(--u))/1 var(--ct-font)}
.ct-rp{font-size:calc(7.4 * var(--u));line-height:calc(12 * var(--u));color:var(--ct-sub)}

/* helpful resources and questions */
.ct-faqs{background:#fff;padding:calc(3.4 * var(--u)) 0 calc(22 * var(--u))}
.t-caterer .ct-faq-in{position:relative;width:calc(807 * var(--u));margin:0 auto;padding-left:calc(51 * var(--u));
  display:grid;grid-template-columns:calc(345 * var(--u)) calc(294 * var(--u));gap:calc(47 * var(--u));align-items:start}
.ct-faq-t{font:700 calc(11 * var(--u))/1 var(--ct-font);margin-bottom:calc(8 * var(--u))!important}
.ct-faq-r::before{content:"";position:absolute;left:calc(396 * var(--u));top:0;height:calc(105 * var(--u));width:1px;background:#E6E8EA}
.ct-reslist li{height:calc(16.6 * var(--u))}
.ct-res{font:400 calc(8.6 * var(--u))/calc(16.6 * var(--u)) var(--ct-font);color:#3E5189!important;text-decoration:none!important}
.ct-res:hover{text-decoration:underline!important;text-underline-offset:3px}
.t-caterer .ct-faq details{border-bottom:1px solid #EDEEF0}
.t-caterer .ct-faq details:last-child{border-bottom:0}
.t-caterer .ct-faq summary{align-items:flex-start;gap:calc(12 * var(--u));min-height:calc(21.4 * var(--u));padding:calc(4.2 * var(--u)) 0 0;
  font-size:calc(8.4 * var(--u));line-height:calc(11 * var(--u));color:#3A3D4A}
.t-caterer .ct-faq summary::after{content:"";width:calc(5.4 * var(--u));height:calc(5.4 * var(--u));margin-top:calc(1.5 * var(--u));flex:none;
  border-right:1.4px solid #7A828C;border-bottom:1.4px solid #7A828C;transform:rotate(45deg) translate(-2px,-2px)}
.t-caterer .ct-faq details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.t-caterer .ct-faq .a{padding:calc(2 * var(--u)) calc(24 * var(--u)) calc(10 * var(--u)) 0}
.t-caterer .ct-faq .a p{font-size:calc(9 * var(--u));line-height:1.62;color:var(--ct-sub)}

/* closing band */
.ct-end{overflow:hidden;background:#EDE9E4}
.ct-end-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}
.t-caterer .ct-end-h{font-weight:700;font-size:calc(19.6 * var(--u));line-height:calc(28 * var(--u));color:#0A0F16}

/* below 900px: the same pieces, stacked in the design's order */
@media (max-width:899px){
  main.t-caterer{--u:1.28px}
  .t-caterer .ct-art{width:auto;height:auto;padding:0 20px}
  .t-caterer .ct-a{position:static;width:auto;left:auto;top:auto}
  .ct-hero{display:flex;flex-direction:column-reverse}
  .ct-hero-img{position:static;height:auto;aspect-ratio:39/28;object-position:20% 50%}
  .ct-hero .ct-art{padding:28px 20px 30px}
  .ct-eyebrow{font-size:11px}
  .ct-k{position:static;display:block;white-space:normal;margin:0 0 10px;font-size:11px}
  .t-caterer .ct-h1{margin-top:12px!important}
  .ct-big{font-size:33px;line-height:1.12}
  .ct-lede{margin-top:14px!important;font-size:16px;line-height:1.5}
  .ct-btn{display:inline-flex;margin-top:20px;padding:0 24px;min-height:48px;height:auto;font-size:15px;border-radius:6px}
  .ct-btn svg{width:15px;height:15px}
  .ct-proofs{display:flex;flex-wrap:wrap;gap:18px 26px;margin-top:22px!important}
  .ct-proofs li{display:flex;align-items:center;gap:10px}
  .ct-pi{width:22px!important;height:22px}
  .ct-proof{font-size:13px;line-height:1.35}
  .t-caterer .ct-inv{position:relative;left:auto;top:auto;margin:24px auto 0;
    --u:min(1.35px,calc((100cqw - 40px) / 239));width:calc(239 * var(--u));height:calc(262 * var(--u))}
  .t-caterer .ct-inv .ct-a{position:absolute}
  .t-caterer .ct-h2{font-size:26px;line-height:1.2}
  .ct-sub{margin-top:8px!important;font-size:15.5px;line-height:1.5}
  .ct-menu .ct-art{padding:36px 20px 30px;display:flex;flex-direction:column}
  .ct-menu-img{order:-1;width:min(320px,80%);margin:22px auto 6px}
  .ct-leads{display:none}
  .ct-ann{display:grid;gap:18px;margin-top:20px!important}
  .ct-ann li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start}
  .ct-ai{width:24px!important;height:24px;grid-row:span 2}
  .ct-ah{font-size:16.5px}
  .ct-ap{grid-column:2;margin-top:3px!important;font-size:14.5px;line-height:1.45}
  .ct-map .ct-art{padding:34px 20px 26px}
  .ct-map-img{position:static;margin:20px 0 18px;width:100%}
  .ct-mlabels{display:grid;gap:14px}
  .ct-mh{font-size:16.5px}
  .ct-mp{margin-top:2px!important;font-size:14.5px;line-height:1.45}
  .ct-c{text-align:left}
  .ct-price .ct-art{padding:34px 20px}
  .ct-tools{display:grid;gap:22px;margin-top:22px!important}
  .ct-tool{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;height:auto}
  .ct-ti{width:28px!important;height:28px;grid-row:span 2}
  .ct-th{font-size:16.5px}
  .ct-tp{grid-column:2;margin-top:3px!important;font-size:14.5px;line-height:1.45}
  .ct-vrule{display:none}
  .ct-studio{display:flex;flex-direction:column-reverse}
  .ct-shot{position:relative;inset:auto;width:100%}
  .ct-studio-img{position:static;height:auto;aspect-ratio:807/284}
  .ct-studio .ct-art{padding:34px 20px 26px}
  .t-caterer .ct-card{left:calc(var(--x) / 807 * 100%);top:calc(var(--y) / 284 * 100%);
    width:calc(var(--w) / 807 * 100%);height:calc(var(--h2) / 284 * 100%)}
  .t-caterer .ct-card .t10-edit{display:none}
  .ct-btn-s{margin-top:18px}
  .ct-strip{padding-block:22px 28px}
  .ct-pay .ct-art{padding:30px 20px 34px}
  .ct-qr-card{width:128px!important;height:auto;margin-bottom:18px;padding:8px}
  .t-caterer .ct-pay-h{font-size:24px}
  .ct-pay-m{margin-top:8px!important;font-size:15px}
  .ct-pay-s{margin-top:6px!important;font-size:13.5px}
  .ct-pay-div{display:none}
  .ct-prows{display:grid;gap:12px;margin-top:20px!important}
  .ct-prows li{display:flex;align-items:center;gap:12px}
  .ct-pri{width:20px!important;height:20px}
  .ct-prt{font-size:14.5px}
  .ct-rec .ct-art{padding:34px 20px}
  .ct-recs{display:grid;gap:22px;margin-top:22px!important}
  .ct-ri{width:26px!important;height:26px}
  .ct-rh{margin-top:10px!important;font-size:16.5px}
  .ct-rp{margin-top:3px!important;font-size:14.5px;line-height:1.45}
  .ct-faqs{padding:32px 0 28px}
  .t-caterer .ct-faq-in{display:block;width:auto;padding:0 20px}
  .ct-faq-t{font-size:20px;margin-bottom:8px!important}
  .ct-faq-r{margin-top:28px}
  .ct-faq-r::before{display:none}
  .ct-reslist li{height:auto}
  .ct-res{font-size:15.5px;line-height:2.1}
  .t-caterer .ct-faq summary{min-height:48px;padding:13px 0;font-size:15.5px;line-height:1.35}
  .t-caterer .ct-faq summary::after{width:9px;height:9px}
  .t-caterer .ct-faq .a p{font-size:14.5px}
  .ct-end{display:flex;flex-direction:column-reverse;background:#F3EFEA}
  .ct-end-img{position:static;height:auto;aspect-ratio:39/22;object-position:60% 50%}
  .ct-end .ct-art{padding:30px 20px 34px}
  .t-caterer .ct-end-h{font-size:26px;line-height:1.24}
}

/* it-hero-phone-v1 start */
/* One composed hero on phones (24 Sep 2026): the picture sits under the copy inside the same panel,
   with a scrim in the panel color, instead of a separate strip beneath the text. */
@media (max-width:899px){
.ct-hero{display:flex;flex-direction:column;position:relative;background:rgb(252,252,251);overflow:hidden;height:auto;min-height:0}
.ct-hero .ct-art{order:1;position:relative;inset:auto;z-index:2;background:transparent;padding-bottom:0;margin-bottom:0}
.ct-hero .ct-hero-img{order:2;position:relative;z-index:1;inset:auto;margin:calc(100vw*-0.2880) 0 0;width:100%;max-width:none;height:auto}
.ct-hero .ct-hero-img{aspect-ratio:1/0.7200;overflow:hidden}
.ct-hero .ct-hero-img{display:block;padding-top:calc(100vw*0.1728);box-sizing:border-box;background:rgb(252,252,251);object-fit:cover;object-position:20% 50%;z-index:0;-webkit-mask-image:none;mask-image:none}
.ct-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:calc(100vw*0.7200);z-index:1;pointer-events:none;background:linear-gradient(180deg,rgb(252,252,251) 0,rgb(252,252,251) calc(100vw*0.1800),rgba(252,252,251,0.85) calc(100vw*0.2160),rgba(252,252,251,0.5) calc(100vw*0.2952),rgba(252,252,251,0) calc(100vw*0.5040))}
}
/* it-hero-phone-v1 end */