@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&family=Cormorant+Garamond:wght@400&display=swap');
:root{--ink:#242321;--paper:#f6f3ec;--muted:#68655f;--lavender:#b8a5ee;--line:#d9d5cc;--serif:'Libre Caslon Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans)}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #7956b5;outline-offset:6px}a:hover{color:#72539d}img{display:block;max-width:100%}.wrap{width:min(1280px,calc(100% - 112px));margin:auto}.skip{position:absolute;left:20px;top:-80px;background:var(--paper);padding:12px;z-index:10}.skip:focus{top:10px}.topline{height:7px;background:var(--ink)}header{padding:30px 0;border-bottom:1px solid var(--line)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:16px;font-weight:600;font-size:19px;line-height:1.1;letter-spacing:-.5px}.brand img{width:54px;height:54px;border-radius:50%}.brand span{max-width:100px}nav{display:flex;gap:32px;font-size:13px}nav a[aria-current=page]{border-bottom:2px solid var(--lavender)}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:2px;font-weight:600;line-height:1.6}.muted{color:var(--muted)}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.04}h1{font-size:clamp(64px,8vw,116px);letter-spacing:-3px;margin-bottom:24px}h2{font-size:48px;letter-spacing:-1px}h3{font-size:30px}.home-hero{padding:95px 0 88px;display:flex;align-items:center;gap:38px}.home-portrait{width:156px;height:156px;border-radius:50%;transform:rotate(-7deg)}.home-hero h1{font-size:clamp(66px,7.6vw,106px);margin:0 0 18px;letter-spacing:-3px}.home-hero p{margin:0;color:var(--muted);font-size:17px}.star{color:#947ac1;font-family:Georgia,serif}.locations{padding-bottom:85px}.section-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.location-link{border-top:1px solid var(--ink);border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;align-items:center;padding:32px 0;gap:24px}.location-link h2{font-size:54px;margin:0 0 5px}.location-link p{margin:0;font-size:13px;color:var(--muted)}.location-index{font-family:var(--serif);font-size:24px;color:var(--muted)}.circle-arrow{width:48px;height:48px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:24px;transition:.2s}.location-link:hover .circle-arrow{background:var(--lavender);border-color:var(--lavender);transform:rotate(-35deg)}.foot{border-top:1px solid var(--line);padding:26px 0;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:11px}.crumb{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted);padding-top:30px}.page-heading{padding:60px 0 38px;display:flex;justify-content:space-between;align-items:end;gap:30px}.page-heading p{max-width:380px;font-size:14px}.page-heading h1{margin:12px 0 0}.note{padding:16px 20px;background:#ede8f4;border-left:2px solid #a68acc;font-size:12px;margin-bottom:35px}.ranking-top{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--ink);padding-bottom:17px;margin-bottom:30px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:45px 28px;padding-bottom:65px}.card-image{aspect-ratio:1;position:relative;overflow:hidden;background:#e8e2d8}.card-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.card a:hover img{transform:scale(1.03)}.image-label{position:absolute;bottom:13px;left:15px;font-size:9px;text-transform:uppercase;letter-spacing:1.5px;color:#f3eadc}.card-title{display:flex;align-items:baseline;gap:14px;margin:16px 0 4px}.rank{font:30px var(--serif);min-width:42px}.card h2{font-size:29px;letter-spacing:-.4px;margin:0}.card p{font-size:11px;margin:4px 0 0 56px;color:var(--muted)}.pending-art{height:100%;display:grid;place-items:center;background:repeating-linear-gradient(130deg,transparent,transparent 30px,#ffffff16 31px,#ffffff16 32px),#e4dfd5;color:#b2a99c}.pending-art span{font:100px var(--serif)}.card.pending h2{font-family:var(--sans);font-size:17px;letter-spacing:0;color:var(--muted)}.card.pending .rank{color:#8b8379}.card.pending:nth-child(3n) .pending-art{background-color:#e3deea}.card.pending:nth-child(3n+1) .pending-art{background-color:#dce0d9}.ranking-end{border-top:1px solid var(--line);padding:35px 0 70px;display:flex;justify-content:space-between;gap:20px;font-size:13px}.review-heading{padding:60px 0 45px}.review-heading h1{font-size:clamp(70px,9vw,124px);margin:10px 0 12px}.review-sub{display:flex;gap:25px;align-items:baseline;flex-wrap:wrap}.review-sub p{font:30px var(--serif);margin:0}.review-sub span{font-size:12px;color:var(--muted)}.review-layout{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:start;padding-bottom:90px}.review-art{background:#302c28;aspect-ratio:1}.review-art img{width:100%;height:100%;object-fit:cover}figcaption{font-size:10px;color:var(--muted);padding-top:10px}figure{margin:0}.drink h2{font-size:48px;margin:14px 0 24px}.ingredients{font-size:13px;color:var(--muted);line-height:1.9}.profile{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:21px 0;margin:27px 0}.profile p{font-size:16px;margin:8px 0 0}.thoughts{margin-top:36px}.thoughts p{font-size:16px;line-height:1.9}.pullquote{font:38px/1.15 var(--serif);margin:35px 0;padding-left:24px;border-left:2px solid var(--lavender)}.verdict{margin-top:36px}.scores{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:15px}.score{border:1px solid #b9a3d9;padding:22px;background:#efe9f7}.score .number{font:60px/1 var(--serif)}.score small{font-size:12px;color:var(--muted)}.score .eyebrow{display:block;margin-top:12px}.verdict-note{font-size:11px;color:var(--muted);margin-top:15px}.article{max-width:720px;padding:70px 0 90px}.article h1{font-size:78px}.article p{font-size:18px}.article h2{font-size:38px;margin-top:42px}.text-link{border-bottom:1px solid #9980bb;padding-bottom:3px}.about-avatar{width:100px;border-radius:50%;margin-bottom:35px}details{border-top:1px solid var(--line);padding:15px 0;margin-bottom:30px;font-size:13px}summary{cursor:pointer}details p{max-width:670px;margin:15px 0 0}.no-page{min-height:60vh;padding-top:80px}@media(min-width:1450px){.home-hero{padding-top:120px;padding-bottom:110px}}@media(max-width:900px){.wrap{width:calc(100% - 64px)}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.review-layout{gap:35px}.home-hero{gap:26px}.home-portrait{width:125px;height:125px}.page-heading{align-items:start;flex-direction:column;gap:18px}.review-layout{grid-template-columns:1fr}.review-visual{max-width:600px}.drink{max-width:660px}.home-hero h1{font-size:75px}}@media(max-width:560px){.wrap{width:calc(100% - 40px)}header{padding:20px 0}.brand{font-size:15px;gap:10px}.brand img{width:42px;height:42px}nav{gap:20px;font-size:12px}.home-hero{padding:64px 0 54px;align-items:flex-start;flex-direction:column;gap:25px}.home-portrait{width:106px;height:106px}.home-hero h1{font-size:65px;letter-spacing:-2px}.home-hero p{max-width:250px;font-size:15px}.location-link{grid-template-columns:30px 1fr auto;gap:15px;padding:28px 0}.location-link h2{font-size:44px}.circle-arrow{width:40px;height:40px}.locations{padding-bottom:70px}.foot{flex-direction:column;gap:6px;padding:22px 0}.foot p{margin:0}.grid{grid-template-columns:1fr;gap:35px}.page-heading{padding-top:42px}.page-heading h1{font-size:76px}.ranking-top{font-size:10px}.note{font-size:11px}.review-heading{padding-top:40px}.review-heading h1{font-size:82px}.review-sub{gap:8px}.review-sub p{font-size:26px}.review-sub span{display:block;width:100%}.review-layout{gap:36px;padding-bottom:50px}.drink h2{font-size:44px}.article{padding:50px 0}.article h1{font-size:65px}.article p{font-size:16px}.ranking-end{flex-direction:column}.card h2{font-size:32px}.score{padding:19px}.score .number{font-size:56px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Keep the About title on one line, including narrow phones. */
.article h1.about-title{font-size:clamp(38px,9vw,78px);white-space:nowrap;letter-spacing:-1.5px}

/* Da Nang review content */
.review-photo{margin:0 0 30px}.review-photo img{width:100%;height:auto;display:block}.review-visual .review-photo{margin:0}.review-visual .review-photo img{max-height:850px;width:100%;object-fit:contain;object-position:top center}.review-art{aspect-ratio:auto}.review-art img{height:auto;object-fit:contain}.card-image{background:#292622}.card-image img{object-fit:contain}.review-section{border-top:1px solid var(--line);padding-top:24px;margin-top:35px}.review-section p{font-size:16px;line-height:1.9;margin:10px 0 0}.drink-entry+.drink-entry{border-top:1px solid var(--line);padding-top:36px;margin-top:38px}.drink-entry .review-photo{margin-bottom:28px}.small-photo{max-width:340px;margin-top:22px}.visit-date{white-space:nowrap}.verdict{border-top:1px solid var(--line);padding-top:26px}
/* Keep portrait photos comfortably sized beside editorial review copy. */
/* Consistent square photos and editorial rows for every review. */
.card-image img{object-fit:cover}
.review-layout{display:block;padding-bottom:90px}
.review-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:75px;align-items:start;margin-bottom:72px}
.review-row+.review-row{border-top:1px solid var(--line);padding-top:60px}
.review-row .review-art,.review-row .review-photo{width:100%;aspect-ratio:1;margin:0;overflow:hidden;background:#302c28}
.review-row .review-art img,.review-row .review-photo img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:center}
.review-row .drink-entry{margin:0;padding:0;border:0}
.review-layout>.review-section{max-width:760px;margin:0 0 50px}
.review-closing{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:75px;align-items:start;border-top:1px solid var(--line);padding-top:34px}
.review-closing .review-section,.review-closing .verdict{border:0;margin:0;padding:0}
.review-closing .small-photo{width:min(100%,340px);aspect-ratio:1;overflow:hidden;margin-top:25px}
.review-closing .small-photo img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.review-row,.review-closing{gap:35px}}
@media(max-width:700px){.review-row,.review-closing{grid-template-columns:1fr;gap:28px}.review-row{margin-bottom:50px}.review-row+.review-row{padding-top:40px}.review-row .review-visual{max-width:600px}.review-layout>.review-section{margin-bottom:40px}.review-closing .verdict{margin-top:8px}}

/* Short photo captions and consistent closing sections. */
.review-visual .pullquote{font:clamp(21px,2.2vw,27px)/1.25 var(--serif);margin:24px 0 0;padding-left:17px;border-left:2px solid var(--lavender)}
.review-layout>.review-section{max-width:none;border-top:1px solid var(--line);padding-top:30px}
.review-layout>.review-section p{max-width:760px}
.review-closing--no-extras .verdict{grid-column:2}
@media(max-width:700px){.review-closing--no-extras .verdict{grid-column:1}}

.review-extras .pullquote{font:clamp(21px,2.2vw,27px)/1.25 var(--serif);margin:24px 0 0;padding-left:17px;border-left:2px solid var(--lavender)}

.ranking-back{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center}

/* Batch 2: header copy and About portrait. */
.header-tagline{flex:1;margin-left:22px;padding-left:24px;border-left:1px solid var(--line);max-width:285px;color:var(--muted);font:500 12px/1.4 var(--sans)}
.header-inner nav{margin-left:auto;flex-shrink:0}
.location-intro span{display:block}.location-intro span+span{margin-top:7px}
.article.about-page{max-width:none;padding-top:68px}
.about-hero{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);align-items:center;gap:clamp(36px,6vw,100px);margin-bottom:58px}
.about-photo{display:block;aspect-ratio:4/5;overflow:hidden;background:#202026}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center 53%}
.about-hero h1{font-size:clamp(48px,5vw,78px);letter-spacing:-1.5px;margin:0 0 22px}
.about-hero-text p{font-size:15px;color:var(--muted);margin:0}
.about-copy{max-width:760px}.about-copy>p{font-size:18px;line-height:1.8;margin-bottom:26px}
.about-copy .about-intro{font:clamp(24px,2.6vw,32px)/1.35 var(--serif);border-left:2px solid var(--lavender);padding-left:22px;margin:42px 0}
.about-copy .house-rule{font-size:14px;line-height:1.75;color:var(--muted);border-top:1px solid var(--line);padding-top:22px;margin:50px 0 58px}
@media(max-width:760px){.header-inner{display:grid;grid-template-columns:1fr auto;gap:12px 18px}.header-tagline{grid-column:1/-1;grid-row:2;max-width:none;margin:0;padding:0;border:0;font-size:11px}.header-inner nav{grid-column:2;grid-row:1;margin:0}.about-hero{grid-template-columns:1fr;gap:28px}.about-photo{max-width:560px;aspect-ratio:4/5}.article.about-page{padding-top:45px}.about-hero h1{font-size:clamp(46px,9vw,68px)}.about-copy>p{font-size:16px}.about-copy .about-intro{font-size:26px}}

/* About portrait refinement. */
.about-hero{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,5vw,78px)}
.about-hero-media{width:100%;max-width:460px}
.about-photo-caption{font-size:15px;color:var(--muted);margin:18px 0 0}
@media(max-width:760px){.about-hero{grid-template-columns:1fr;gap:30px}.about-hero-media{max-width:320px}.about-photo-caption{font-size:14px}}

/* Keep the About caption and opening copy visible sooner. */
.article.about-page{padding-top:40px}
.about-hero{margin-bottom:30px}
.about-hero-media{max-width:320px}
@media(max-width:760px){.about-hero-media{max-width:250px}.about-hero{gap:20px;margin-bottom:26px}}

/* Batch 3: photo sources and optional editorial metadata. */
.card-image picture,.review-photo picture{display:block;width:100%;height:100%}
.card-image picture img{object-fit:cover}
.review-sub .world-50-meta{font-size:12px;color:var(--muted)}

/* Batch 4: reusable Loved by Thomas distinction. */
.stamp-frame{position:relative;overflow:visible}.loved-stamp{position:absolute;z-index:3;width:clamp(105px,18vw,180px);height:auto;top:-8%;right:-7%;transform:rotate(8deg);pointer-events:none}.loved-stamp img{display:block;width:100%;height:auto!important;object-fit:contain!important}.card-image:has(.loved-stamp){overflow:visible}.card-image:has(.loved-stamp)>picture:not(.loved-stamp){overflow:hidden}.card--unranked .card-title{padding-left:0}@media(max-width:760px){.loved-stamp{width:clamp(92px,30vw,135px);top:-6%;right:-4%}}
/* Keep the stamp compact when it sits inside a ranking-card image wrapper. */
.card-image .loved-stamp{width:clamp(100px,15vw,140px);height:auto;top:-7%;right:-5%}
@media(max-width:760px){.card-image .loved-stamp{width:clamp(86px,25vw,118px);top:-5%;right:-3%}}

/* Post-Batch 4 refinements: consistent Vietnamese display glyphs. */
.vietnamese-display{font-family:var(--serif);font-weight:400}
.drink h2.vietnamese-title{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400}
/* Ranking stamp moves farther into the top-right corner. */
.card-image .loved-stamp{top:-12%;right:-12%;transform:rotate(14deg)}
/* Review stamp keeps its height, but shifts right and shares the stronger tilt. */
.stamp-frame>.loved-stamp{top:-8%;right:-11%;transform:rotate(14deg)}
@media(max-width:760px){.card-image .loved-stamp{top:-9%;right:-8%;transform:rotate(14deg)}.stamp-frame>.loved-stamp{top:-6%;right:-8%;transform:rotate(14deg)}}

/* A smaller custom breve keeps the large editorial city name balanced. */
.soft-breve{position:relative;display:inline-block}.soft-breve::after{content:'˘';position:absolute;left:50%;top:-.18em;transform:translateX(-50%);font-family:Georgia,serif;font-size:.43em;line-height:1;font-weight:400}
.soft-breve::after{top:-.08em;font-size:.55em}
.page-heading .soft-breve::after{font-size:.32em;top:.02em}

/* Batch 5: homepage receipt, About stamp explanation, and mobile refinements. */
.home-hero{justify-content:space-between}.home-hero-copy{min-width:0}.bar-receipt{position:relative;flex:0 0 clamp(230px,23vw,292px);margin-right:clamp(24px,6vw,92px);padding:27px 27px 35px;background:#fffdf5;color:#1f1e1b;box-shadow:0 15px 35px rgba(45,38,28,.13);transform:rotate(2deg);font:500 12px/1.45 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;letter-spacing:.06em}.bar-receipt::after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:12px;background:linear-gradient(135deg,transparent 6px,#fffdf5 0) 0 0/12px 12px repeat-x}.receipt-title{text-align:center;font-size:21px;font-weight:700;letter-spacing:.12em}.receipt-tab{text-align:center;margin:5px 0 18px;font-size:10px}.receipt-rule{border-top:1px dashed #8e8980;margin:14px 0}.receipt-stats{margin:0}.receipt-stats div,.receipt-status{display:flex;justify-content:space-between;gap:28px}.receipt-stats dt,.receipt-stats dd{margin:0}.receipt-status strong{color:#7652a1}.receipt-thanks{text-align:center;margin:20px 0 12px;font-weight:700}.receipt-dots{text-align:center;color:#8e70bc;letter-spacing:.45em}.receipt-site{text-align:center;margin:12px 0 0;font-size:10px}.stamp-explainer{display:grid;grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:36px;border-top:1px solid var(--line);margin-top:48px;padding-top:4px}.stamp-explainer h2{margin-top:36px}.stamp-explainer p{margin-bottom:0}.stamp-explainer-art img{width:100%;height:auto;transform:rotate(8deg)}
@media(max-width:760px){.home-hero{align-items:flex-start}.bar-receipt{flex:none;width:min(280px,88vw);margin:8px auto 0;padding:25px 26px 33px}.location-link{grid-template-columns:minmax(0,1fr) auto;gap:18px}.location-link>div{min-width:0}.location-link h2{white-space:nowrap;font-size:clamp(39px,12vw,48px)}.circle-arrow{justify-self:end;flex-shrink:0}.card-image .loved-stamp{right:2%}.stamp-frame>.loved-stamp{right:1%}.stamp-explainer{grid-template-columns:1fr 105px;gap:20px}.stamp-explainer h2{margin-top:30px}}

/* Batch 6: shorter homepage hero and optional The Space supporting image. */
@media(min-width:761px){.home-hero{padding-top:58px;padding-bottom:50px}.bar-receipt{flex-basis:clamp(215px,21vw,264px);margin-right:clamp(18px,5vw,70px);padding:23px 24px 30px;font-size:11px}.receipt-title{font-size:19px}.receipt-tab{margin-bottom:13px}.receipt-rule{margin:11px 0}.receipt-thanks{margin:15px 0 9px}}
.review-section.space-with-image{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,320px);gap:clamp(35px,6vw,78px);align-items:start}.space-supporting-image{margin:0;justify-self:end;width:100%;max-width:320px}.space-supporting-image img{width:100%;height:auto}
@media(max-width:760px){.home-hero{padding:30px 0 30px;gap:12px}.home-hero h1{margin-bottom:9px}.bar-receipt{width:min(238px,76vw);margin:1px auto 0;padding:17px 20px 24px;font-size:10px}.receipt-title{font-size:18px}.receipt-tab{margin:3px 0 9px}.receipt-rule{margin:8px 0}.receipt-thanks{margin:10px 0 7px}.receipt-site{margin-top:7px}.review-section.space-with-image{grid-template-columns:1fr;gap:24px}.space-supporting-image{justify-self:start;max-width:320px}}