/* Hoa Hoè hero — full viewport; desktop and mobile. No modifications to Fiama core CSS. */
/* Piquant is a licensed font and not bundled. Dancing Script is a web-served Vietnamese-capable visual fallback; Georgia is the offline fallback. */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@500;600;700&display=swap');
:root{--hoa-coral:#e96e5e;--hoa-olive:#667e35;--hoa-ink:#3d4b35;--hoa-cream:#fffaf5}
.flower-hero-fullscreen,.flower-hero-fullscreen .carousel,.flower-hero-fullscreen .carousel-inner,.flower-hero-fullscreen .carousel-item{height:100vh;height:100svh;min-height:550px}
.flower-hero-fullscreen .carousel-item{overflow:hidden}
.flower-hero-fullscreen .flower-hero-slide{position:relative;width:100%;height:100%;min-height:0;overflow:hidden;display:flex;align-items:center;color:var(--hoa-ink)}
/* Trang chủ: navbar thật sự trong suốt, nằm TRÊN banner chứ không chiếm chỗ. */
.hoa-hoe-home .hoa-hoe-nav{position:absolute;top:0;left:0;width:100%;z-index:999;background:transparent!important;box-shadow:none;border:0}
.hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area:not(.sticky-active){background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;border:0!important}
/* Hai banner có tông kem/trắng: dùng chữ xanh rêu để đọc được trên nền ảnh. */
.hoa-hoe-home .hoa-hoe-nav .ltn__main-menu>ul>li>a{color:#43543d!important;text-shadow:0 1px 1px rgba(255,255,255,.45)}
.hoa-hoe-home .hoa-hoe-nav .ltn__main-menu>ul>li>a:hover,.hoa-hoe-home .hoa-hoe-nav .ltn__main-menu>ul>li:hover>a{color:#cd675b!important}
.hoa-hoe-home .hoa-hoe-nav .mini-cart-icon-2>a,.hoa-hoe-home .hoa-hoe-nav .mini-cart-icon-2>a .mini-cart-icon i,.hoa-hoe-home .hoa-hoe-nav .mini-cart-icon-2>a h6,.hoa-hoe-home .hoa-hoe-nav .mini-cart-icon-2>a h6 span{color:#43543d!important}
.hoa-hoe-home .hoa-hoe-nav .mini-cart-icon-2>a .mini-cart-icon sup{color:#fff!important;background:#d16c5c!important}
.hoa-hoe-home .hoa-hoe-nav .mobile-menu-toggle svg path{stroke:#43543d}
/* Khi kéo xuống mới dùng nền sáng để navbar nổi trên phần nội dung sản phẩm. */
.hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area.sticky-active{background:rgba(255,250,245,.97)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(90,101,75,.16);box-shadow:0 5px 20px rgba(37,47,27,.09)}
.hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area .site-logo img{max-height:78px;max-width:116px;width:auto;object-fit:contain}
.hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area.sticky-active .site-logo img{max-height:62px}
/* Giữ logo và giỏ hàng cùng một hàng trên mobile thay vì chiếm 2 tầng. */
@media(max-width:991px){
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area{padding-top:10px;padding-bottom:10px}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area>.container>.row{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area>.container>.row>.logo-column{flex:0 0 auto;width:auto;max-width:140px}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area>.container>.row>.col:last-child{flex:0 0 auto;width:auto;max-width:none}
  .hoa-hoe-home .hoa-hoe-nav .site-logo{min-width:0;margin-bottom:0;justify-content:flex-start}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-options{margin:0;justify-content:flex-end}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area .site-logo img{max-width:96px;max-height:76px}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-options>ul>li{margin-right:14px}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-options>ul>li:last-child{margin-right:0}
  .hoa-hoe-home .hoa-hoe-nav .mini-cart-icon-2>a h6{display:none}
}
@media(max-width:575px){
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area .site-logo img{max-height:66px;max-width:80px}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-middle-area.sticky-active .site-logo img{max-height:58px}
  .hoa-hoe-home .hoa-hoe-nav .ltn__header-8 .mobile-menu-toggle{top:0}
}
/* Slide 1: provided original banner, strictly no overlay text. */
.hoa-banner-only{background:#fff}
.hoa-full-cover,.hoa-full-cover img{display:block;width:100%;height:100%}
.hoa-full-cover img{object-fit:cover;object-position:center center}
/* Slide 2: provided flower-pattern, typography only. */
.hoa-banner-letter{background:#fffaf5}
.hoa-pattern-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.96;pointer-events:none}
.hoa-letter-wrap{position:relative;z-index:1;display:flex;justify-content:center;align-items:center;padding-top:70px;padding-bottom:35px}
.hoa-letter-panel{max-width:min(90vw,900px);margin:auto;padding:clamp(33px,5.2vw,80px) clamp(22px,6vw,92px);text-align:center;border:1px solid rgba(231,129,104,.28);border-radius:32px;background:rgba(255,252,246,.91);box-shadow:0 18px 80px rgba(96,74,52,.09);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.hoa-letter-eyebrow{display:block;text-transform:uppercase;letter-spacing:.25em;font-size:clamp(.64rem,.85vw,.82rem);font-weight:700;color:#9d7768;margin-bottom:20px}
.flower-hero-slide .hoa-piquant-title{font-family:'Piquant','Dancing Script','Brush Script MT',cursive;color:var(--hoa-coral);text-shadow:0 1px 0 rgba(255,255,255,.3);font-size:clamp(2.55rem,6.4vw,6.45rem);line-height:1.23;font-weight:600;max-width:none;margin:0;letter-spacing:.005em}
.flower-hero-slide .hoa-piquant-title em{font-style:normal;color:var(--hoa-olive)}
.hoa-letter-underline{display:block;width:110px;height:2px;background:linear-gradient(90deg,transparent,#e6ad9e,transparent);margin:30px auto 18px}
/* Nút slide 2 thay dòng chữ và icon hoa ở dưới lời nhắn. */
.hoa-letter-cta{display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:14px 26px;border-radius:40px;background:#526943;color:#fff!important;text-decoration:none!important;font-size:clamp(.85rem,1.05vw,1rem);font-weight:650;letter-spacing:.025em;box-shadow:0 8px 20px rgba(49,79,44,.14);transition:background .2s,transform .2s}
.hoa-letter-cta:hover,.hoa-letter-cta:focus-visible{background:#cd6c5d;color:#fff!important;transform:translateY(-2px)}
.hoa-letter-cta:focus-visible{outline:3px solid #cd6c5d;outline-offset:4px}
.hoa-letter-cta span{font-size:1.3em;line-height:1}
/* Controls visible on both light and dark artwork */
.flower-hero-fullscreen .carousel-indicators{z-index:5;bottom:25px;gap:9px;margin-bottom:0}
.flower-hero-fullscreen .carousel-indicators button{width:10px;height:10px;opacity:.55;border:0;border-radius:50%;background:#8d9b73;box-shadow:0 0 0 1px rgba(255,255,255,.7)}
.flower-hero-fullscreen .carousel-indicators button.active{background:var(--hoa-coral);opacity:1;transform:scale(1.2)}
.flower-hero-fullscreen .carousel-control-prev,.flower-hero-fullscreen .carousel-control-next{width:8%;opacity:1;z-index:6;max-width:76px}
.flower-hero-fullscreen .carousel-control-prev-icon,.flower-hero-fullscreen .carousel-control-next-icon{width:40px;height:40px;border-radius:50%;background-color:rgba(75,88,64,.67);background-size:40% 40%;box-shadow:0 5px 18px rgba(0,0,0,.12)}
.flower-hero-fullscreen .carousel-control-prev:focus-visible,.flower-hero-fullscreen .carousel-control-next:focus-visible,.flower-hero-fullscreen .carousel-indicators button:focus-visible{outline:3px solid #e96e5e;outline-offset:3px}
@media(max-width:767px){
.flower-hero-fullscreen,.flower-hero-fullscreen .carousel,.flower-hero-fullscreen .carousel-inner,.flower-hero-fullscreen .carousel-item{height:100svh;min-height:540px}
.hoa-full-cover img{object-fit:contain;object-position:center center}
/* Cover asset is landscape with central logo; use a mild zoom on mobile without cropping the logo. */
.hoa-banner-only .hoa-full-cover{transform:scale(1.3)}
.hoa-pattern-backdrop{object-fit:cover}
.hoa-letter-wrap{padding:78px 27px 30px}
.hoa-letter-panel{padding:42px 19px 38px;max-width:100%;border-radius:24px;background:rgba(255,252,246,.94)}
.flower-hero-slide .hoa-piquant-title{font-size:clamp(2.45rem,8vw,4rem);line-height:1.3}
.hoa-letter-eyebrow{font-size:.58rem;letter-spacing:.16em}
.hoa-letter-underline{margin:22px auto 15px}
.hoa-letter-cta{padding:12px 19px;font-size:.85rem}








.flower-hero-fullscreen .carousel-control-prev,.flower-hero-fullscreen .carousel-control-next{width:10%;max-width:none}
.flower-hero-fullscreen .carousel-control-prev-icon,.flower-hero-fullscreen .carousel-control-next-icon{height:30px;width:30px}
.flower-hero-fullscreen .carousel-indicators{bottom:14px}
}

@media(prefers-reduced-motion:reduce){.flower-hero-fullscreen .carousel-item{transition:none!important}.hoa-letter-cta{transition:none}}