:root{--navy:#003b5c;--navy2:#002b43;--pink:#f4c5cc;--pink2:#fff0f2;--ice:#f6fbfd;--white:#fff;--ink:#072d42;--muted:#577180;--line:#c9d9df;--radius:26px;--shadow:0 22px 60px rgba(0,59,92,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--ice);font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;font-size:16px;line-height:1.7}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.skip{position:fixed;left:1rem;top:-4rem;background:#fff;padding:.7rem 1rem;z-index:99}.skip:focus{top:1rem}.site-header{height:92px;padding:10px clamp(24px,5vw,72px);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:rgba(246,251,253,.93);backdrop-filter:blur(16px);z-index:20;border-bottom:1px solid rgba(0,59,92,.08)}.brand img{width:72px;height:72px;object-fit:contain}.site-header nav{display:flex;align-items:center;gap:28px;font-weight:700;font-size:.92rem}.site-header nav a:not(.nav-cta):hover{color:#c44b67}.nav-cta{background:var(--navy);color:#fff;padding:11px 20px;border-radius:100px}.menu-toggle{display:none;border:1px solid var(--navy);background:transparent;color:var(--navy);border-radius:100px;padding:8px 16px;font-weight:800}.hero{min-height:calc(100vh - 92px);display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);gap:clamp(32px,5vw,88px);align-items:center;padding:clamp(44px,7vw,100px) clamp(24px,6vw,96px);overflow:hidden;background:radial-gradient(circle at 3% 92%,var(--pink) 0 12%,transparent 12.3%),var(--ice)}.hero-copy{max-width:740px}.eyebrow{font-size:.78rem;font-weight:900;letter-spacing:.18em;color:#a83d56;margin:0 0 16px}.hero h1{font-size:clamp(2.9rem,6.3vw,6.6rem);line-height:1.01;letter-spacing:-.06em;margin:0 0 28px;font-weight:900}.hero h1 span{color:var(--navy);position:relative}.hero-lead{max-width:640px;font-size:clamp(1.05rem,1.5vw,1.27rem);color:var(--muted);margin:0 0 30px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 24px;border-radius:100px;font-weight:900;border:0;cursor:pointer;font-size:1rem}.btn-primary{background:var(--navy);color:#fff;box-shadow:0 10px 24px rgba(0,59,92,.22)}.btn-primary:hover{background:#075277;transform:translateY(-2px)}.btn-ghost{border:1px solid var(--navy);color:var(--navy)}.hero-notes{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:30px 0 0}.hero-notes li{background:#fff;border:1px solid var(--line);padding:5px 12px;border-radius:100px;font-size:.84rem;font-weight:700}.hero-visual{margin:0;position:relative}.hero-visual:before{content:"";position:absolute;inset:-18px 24px 30px -18px;background:var(--pink);border-radius:46% 54% 42% 58%/50% 40% 60% 50%;transform:rotate(-3deg)}.hero-visual img{position:relative;width:100%;height:min(70vh,720px);object-fit:cover;border-radius:42% 58% 44% 56%/52% 43% 57% 48%;box-shadow:var(--shadow)}.hero-visual figcaption{position:absolute;right:-12px;bottom:28px;background:var(--navy);color:#fff;padding:16px 20px;border-radius:18px;display:flex;flex-direction:column;line-height:1.35;box-shadow:var(--shadow)}.hero-visual figcaption b{color:var(--pink);font-size:.86rem;letter-spacing:.12em}.hero-visual figcaption span{font-size:.88rem}.trust-strip{background:var(--navy);color:#fff;display:flex;justify-content:center;gap:clamp(20px,5vw,70px);padding:18px 24px;font-weight:800;overflow:auto;white-space:nowrap}.trust-strip span:before{content:"✦";color:var(--pink);margin-right:12px}.section{padding:clamp(72px,10vw,140px) clamp(24px,7vw,110px)}.section-heading{max-width:850px;margin-bottom:48px}.section-heading h2,.story h2,.inquiry h2{font-size:clamp(2.25rem,4.8vw,4.7rem);letter-spacing:-.055em;line-height:1.07;margin:0 0 22px}.section-heading>p:last-child{color:var(--muted);font-size:1.05rem}.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.service-card{position:relative;padding:34px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-height:390px}.service-card.featured{background:var(--pink2)}.service-card.dark{background:var(--navy);color:#fff}.service-card .number{font-weight:900;color:#bd4e66;letter-spacing:.1em}.service-card h3{font-size:clamp(1.55rem,2.5vw,2.4rem);margin:8px 0 10px;line-height:1.2}.service-card p{color:var(--muted);max-width:560px}.service-card.dark p{color:#cfe0e7}.service-card ul{padding-left:20px;font-weight:700}.service-card img{width:48%;height:180px;object-fit:cover;position:absolute;right:0;bottom:0;border-radius:28px 0 0 0}.cases{background:#fff}.section-heading.split{max-width:none;display:grid;grid-template-columns:1.3fr .7fr;gap:50px;align-items:end}.case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.case-card{background:var(--ice);border-radius:var(--radius);overflow:hidden;border:1px solid #dce8ec}.case-card img{width:100%;height:370px;object-fit:cover}.case-wide{grid-column:span 2;display:grid;grid-template-columns:1.28fr .72fr}.case-wide img{height:490px}.case-copy{padding:26px 30px}.case-copy span{font-size:.77rem;font-weight:900;letter-spacing:.14em;color:#a83d56}.case-copy h3{font-size:clamp(1.35rem,2vw,2rem);line-height:1.3;margin:9px 0}.case-copy p{color:var(--muted);margin:0}.case-wide .case-copy{display:flex;flex-direction:column;justify-content:center}.wedding{background:var(--pink2)}.story{background:var(--pink);display:grid;grid-template-columns:.7fr 1.35fr .9fr;align-items:center;gap:clamp(28px,5vw,72px)}.story-mark{font-size:clamp(3.7rem,7vw,7.5rem);font-weight:1000;line-height:.78;letter-spacing:-.08em;color:rgba(0,59,92,.12);writing-mode:vertical-rl;transform:rotate(180deg)}.story-copy p:not(.eyebrow){font-size:1.05rem}.story img{width:100%;height:540px;object-fit:cover;border-radius:45% 45% 22px 22px;box-shadow:var(--shadow)}.faq{background:var(--navy);color:#fff;display:grid;grid-template-columns:.65fr 1.35fr;gap:clamp(40px,7vw,100px)}.faq .eyebrow{color:var(--pink)}.faq-list details{border-top:1px solid rgba(255,255,255,.26);padding:20px 0}.faq-list details:last-child{border-bottom:1px solid rgba(255,255,255,.26)}summary{cursor:pointer;font-size:1.16rem;font-weight:900;list-style:none;display:flex;justify-content:space-between}summary:after{content:"＋";color:var(--pink)}details[open] summary:after{content:"—"}.faq-list p{color:#ccdde4;max-width:720px}.inquiry{padding:clamp(72px,10vw,140px) clamp(24px,7vw,110px);display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(36px,7vw,100px);background:linear-gradient(120deg,#fff 0 52%,var(--pink2) 52%)}.inquiry-intro{position:sticky;top:135px;align-self:start}.inquiry-intro>p:not(.eyebrow){color:var(--muted);max-width:520px}.line-card{display:flex;justify-content:space-between;align-items:center;gap:24px;background:#00b900;color:#fff;border-radius:18px;padding:18px 20px;margin-top:30px;max-width:460px}.line-card span{font-size:.9rem}form{background:#fff;border:1px solid var(--line);padding:clamp(24px,4vw,46px);border-radius:30px;box-shadow:var(--shadow)}label{display:flex;flex-direction:column;font-weight:800;font-size:.92rem;margin-bottom:18px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}input,textarea,select{margin-top:7px;width:100%;border:1px solid #b8ccd4;border-radius:12px;background:#fbfdfe;padding:13px 14px;font:inherit;color:var(--ink)}textarea{resize:vertical}input:focus,textarea:focus,select:focus{outline:3px solid rgba(244,197,204,.8);border-color:var(--navy)}.consent{display:flex;flex-direction:row;gap:10px;align-items:flex-start;font-weight:500;color:var(--muted)}.consent input{width:18px;height:18px;margin:4px 0 0}.submit{width:100%;border-radius:14px}.form-note{text-align:center;color:var(--muted);font-size:.84rem;margin:12px 0 0}footer{background:var(--navy2);color:#fff;padding:48px clamp(24px,7vw,110px) 26px;display:grid;grid-template-columns:1fr 1fr;gap:30px}footer>div:first-child{display:flex;align-items:center;gap:16px;font-weight:800}.footer-links{display:flex;gap:22px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.footer-links a:hover{color:var(--pink)}.copyright{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.15);padding-top:18px;margin:0;color:#adc5d0;font-size:.8rem}.mobile-line{display:none}
@media(max-width:900px){.site-header{height:76px;padding:8px 18px}.brand img{width:58px;height:58px}.menu-toggle{display:block}.site-header nav{display:none;position:absolute;top:76px;left:12px;right:12px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:16px;flex-direction:column;align-items:stretch;gap:4px}.site-header nav.open{display:flex}.site-header nav a{padding:10px 12px}.hero{grid-template-columns:1fr;min-height:auto;padding-top:52px}.hero h1{font-size:clamp(2.75rem,12vw,4.8rem)}.hero-visual img{height:58vh;min-height:430px}.hero-visual figcaption{right:0}.trust-strip{justify-content:flex-start}.section-heading.split,.faq,.inquiry{grid-template-columns:1fr}.service-grid{grid-template-columns:1fr}.case-wide{display:block;grid-column:span 2}.case-wide img{height:380px}.story{grid-template-columns:1fr}.story-mark{display:none}.story img{height:420px}.inquiry{background:linear-gradient(170deg,#fff 0 35%,var(--pink2) 35%)}.inquiry-intro{position:static}footer{grid-template-columns:1fr}.footer-links{justify-content:flex-start}.mobile-line{display:block;position:fixed;z-index:25;right:16px;bottom:16px;background:#00b900;color:#fff;font-weight:900;padding:12px 18px;border-radius:100px;box-shadow:0 10px 28px rgba(0,0,0,.2)}}
@media(max-width:620px){.hero{padding-left:20px;padding-right:20px;background:var(--ice)}.hero-actions{display:grid}.btn{width:100%}.hero-visual img{height:430px}.hero-visual figcaption{bottom:12px;max-width:88%}.section{padding-left:20px;padding-right:20px}.service-card{padding:26px;min-height:420px}.service-card img{width:64%;height:180px}.section-heading.split{display:block}.case-grid{grid-template-columns:1fr}.case-card,.case-wide{grid-column:auto}.case-card img,.case-wide img{height:300px}.story{padding-left:20px;padding-right:20px}.story img{height:360px}.faq{padding-left:20px;padding-right:20px}.inquiry{padding-left:20px;padding-right:20px}.field-row{grid-template-columns:1fr;gap:0}form{padding:22px 18px}.line-card{align-items:flex-start;flex-direction:column;gap:3px}footer{padding-left:20px;padding-right:20px}.footer-links{flex-direction:column;align-items:flex-start;gap:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}

/* 2026-09 service-image layout refinement */
.privacy-summary{margin:4px 0 10px;color:var(--ink);font-size:.92rem;line-height:1.6;font-weight:700}
.privacy-disclosure{margin:4px 0 18px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:#f6fbfd;color:var(--ink)}
.privacy-disclosure summary{font-size:.95rem;line-height:1.5;align-items:center}
.privacy-disclosure summary:after{color:var(--navy);font-size:1.2rem}
.privacy-disclosure-content{padding-top:12px;font-size:.88rem;line-height:1.7;color:var(--muted)}
.privacy-disclosure-content p{margin:0 0 10px}
.privacy-disclosure-content p:last-child{margin-bottom:0}
.privacy-disclosure-content a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.form-note{font-size:.9rem;line-height:1.6}
.form-note[data-state="success"]{color:var(--navy);font-weight:700}
.form-note[data-state="error"]{color:#a72646;font-weight:700}
.submit:disabled{cursor:wait;opacity:.65;transform:none}
.hero-visual:before{inset:-14px 14px 14px -14px;border-radius:34px;transform:rotate(-1.5deg)}
.hero-visual img{height:auto;object-fit:contain;border-radius:28px}
.hero-visual figcaption{position:relative;right:auto;bottom:auto;width:max-content;max-width:100%;margin:14px 0 0 auto}
.service-grid{align-items:start}
.service-card{padding:0;min-height:0}
.service-card .service-image{position:static;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:0;background:#edf5f8}
.service-card .service-content{padding:28px 32px 32px}
.service-card .service-content p:last-child,.service-card .service-content ul:last-child{margin-bottom:0}
@media(max-width:900px){.hero-visual img{height:auto;min-height:0}.service-card .service-content{padding:26px 28px 30px}}
@media(max-width:620px){.hero-visual img{height:auto;min-height:0}.hero-visual figcaption{margin-top:10px}.service-card{padding:0;min-height:0}.service-card .service-image{width:100%;height:auto}.service-card .service-content{padding:24px 22px 26px}}

/* Unified image frames: clear subject, consistent size, no accidental cropping */
.service-grid{align-items:stretch}
.service-card{display:flex;flex-direction:column;height:100%}
.service-card.featured,.service-card.dark{background:#fff;color:var(--ink)}
.service-card.dark p{color:var(--muted)}
.service-card .service-content{flex:1}
.service-media{width:100%;aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#edf5f8}
.service-card .service-media .service-image{position:static;width:100%;height:100%;max-height:none;object-fit:contain;border-radius:0}
.service-card.featured .service-media .service-image{object-fit:cover;object-position:center}
.service-card .service-media .focus-indoor{object-fit:cover;object-position:center}
.service-media-product{position:relative;isolation:isolate;background:#dbeaf0}
.service-media-product:before{content:"";position:absolute;inset:-20px;z-index:0;background-image:url("brand-logo-card-full.webp");background-position:center;background-size:cover;filter:blur(18px) brightness(.72);transform:scale(1.08)}
.service-card .service-media-product .service-image{position:relative;z-index:1;width:auto;height:100%;object-fit:contain;box-shadow:0 0 30px rgba(0,43,67,.22)}
.service-media-duo,.service-media-collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:0;align-items:stretch;background:none}
.service-card .service-media.service-media-duo .service-image,.service-card .service-media.service-media-collage .service-image{display:block;min-width:0;min-height:0;width:100%;height:100%;max-height:none;object-fit:cover;object-position:center;background:none;box-shadow:none}
.service-card .service-media.service-media-collage .service-image{object-position:center 65%}
.case-media{width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#edf5f8}
.case-card .case-media img,.case-wide .case-media img{width:100%;height:100%;max-height:none;object-fit:contain;background:#edf5f8}
.story>img{width:100%;height:auto;max-height:520px;object-fit:contain;border-radius:28px;background:rgba(255,255,255,.28)}
@media(max-width:900px){.case-card .case-media img,.case-wide .case-media img{width:100%;height:100%;max-height:none;object-fit:contain}.story>img{height:auto;max-height:none;object-fit:contain}}
@media(max-width:620px){.service-card .service-media .service-image{width:100%;height:100%}.case-card .case-media img,.case-wide .case-media img{height:100%}.story>img{height:auto;max-height:none}}

/* Larger header brand mark */
.site-header{height:112px}
.brand{width:92px;height:92px;flex:none;display:block;overflow:hidden;background:var(--navy)}
.brand img{width:92px;height:92px;max-width:none;object-fit:contain;transform:scale(1.52);transform-origin:center}
.hero{min-height:calc(100vh - 112px)}
@media(max-width:900px){.site-header{height:88px}.brand{width:70px;height:70px}.brand img{width:70px;height:70px}.site-header nav{top:88px}}

/* Keep section intros and mobile FAQ at a consistent reading rhythm */
.section-heading.split{display:block;max-width:850px}
.section-heading.split>p:last-child{margin-top:0}
.story h2{font-size:clamp(1.75rem,3vw,3.3rem)}
.faq .section-heading,.faq .section-heading h2{margin-bottom:0}
@media(max-width:900px){.faq{row-gap:24px}}

/* Procurement-friendly food safety information, without exposing the production partner */
.assurance{background:linear-gradient(160deg,#eef7fa 0%,#f9fcfd 58%,#fff 100%)}
.assurance .section-heading{max-width:850px;margin-bottom:34px}
.assurance .section-heading h2{max-width:800px}
.assurance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.assurance-card{min-width:0;background:#fff;border:1px solid #d5e5eb;border-radius:24px;padding:clamp(24px,3vw,36px);box-shadow:0 12px 30px rgba(0,59,92,.045)}
.assurance-card h3{font-size:clamp(1.4rem,2.2vw,1.9rem);line-height:1.26;margin:8px 0 18px}
.assurance-card p{margin:0;color:var(--muted);font-size:1rem}
.assurance-card .assurance-tag{font-size:.82rem;font-weight:900;letter-spacing:.08em;color:#a83d56}
.assurance-card .assurance-note{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:.91rem}
.assurance-number{font-weight:800;color:var(--navy);overflow-wrap:anywhere}
.assurance-link,.assurance-followup a{color:var(--navy);font-weight:900;text-decoration:underline;text-underline-offset:4px}
.assurance-link{display:inline-block;margin-top:20px}
.assurance-link:hover,.assurance-followup a:hover{color:#a83d56}
.assurance-followup{margin:24px 0 0;color:var(--muted);font-size:1rem}
@media(max-width:720px){.assurance-grid{grid-template-columns:1fr}.assurance .section-heading{margin-bottom:26px}.assurance-card{padding:24px}.assurance-followup{line-height:1.8}}

/* Full-bleed portrait case images: keep the drinks and birthday dessert in frame. */
.case-card--portrait .case-media{aspect-ratio:3/4;display:block;background:none}
.case-card--portrait .case-media img{width:100%;height:100%;object-fit:cover;object-position:center;background:none}

/* Enterprise case: the same 3:2, flush two-photo frame as service cards 03 and 04. */
.case-card.case-enterprise{grid-template-columns:repeat(2,minmax(0,1fr))}
.case-card.case-enterprise .case-media{aspect-ratio:3/2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:0;background:none}
.case-card.case-enterprise .case-media img{display:block;min-width:0;min-height:0;width:100%;height:100%;object-fit:contain;object-position:center;background:none}

/* Show the whole supplied square product photo, centered at every breakpoint. */
.story>img.story-image{justify-self:center;width:100%;max-width:520px;height:auto;max-height:none;object-fit:contain;object-position:center}
