:root{--pink:#e91e63;--pink2:#ff4f8f;--deep:#22151b;--ink:#252226;--muted:#747077;--soft:#fff3f7;--line:#eee8eb;--gold:#d9a441;--green:#16834a;--shadow:0 10px 32px rgba(50,20,35,.09);--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Inter,Segoe UI,Arial,sans-serif;background:#fff}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}
.topbar{background:linear-gradient(90deg,#d91459,#f23879);color:#fff;padding:8px 5%;font-size:12px;display:flex;justify-content:space-between;gap:18px}.topbar span{white-space:nowrap}
.header{display:flex;align-items:center;gap:24px;padding:15px 5%;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100}.logo{color:var(--pink);font:700 29px Georgia,serif;white-space:nowrap}.tagline{display:block;font:11px Inter,Arial;color:#888;text-align:center;margin-top:1px}
.search{flex:1;max-width:690px;display:flex;border:1px solid #ddd;border-radius:30px;overflow:hidden;background:#fff}.search input{flex:1;border:0;outline:0;padding:13px 17px}.search button{border:0;background:var(--pink);color:#fff;width:58px;font-size:21px;cursor:pointer}
.actions{display:flex;gap:15px}.action{min-width:55px;text-align:center;font-size:11px;color:#555;position:relative}.action .ico{font-size:21px;display:block;line-height:22px}.badge{position:absolute;top:-5px;right:5px;background:var(--pink);color:#fff;border-radius:50%;font-size:10px;min-width:18px;height:18px;padding:3px}
.nav{display:flex;gap:22px;align-items:center;padding:10px 5%;border-bottom:1px solid var(--line);white-space:nowrap;overflow:auto;background:#fff;position:relative;z-index:90}.nav>a:hover{color:var(--pink)}.nav .all{background:var(--pink);color:#fff;padding:9px 16px;border-radius:20px}.mega{position:absolute;left:5%;right:5%;top:48px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:0 0 18px 18px;padding:25px;display:none;grid-template-columns:repeat(4,1fr);gap:25px;z-index:200}.mega.open{display:grid}.mega h4{margin:0 0 10px;color:var(--pink)}.mega a{display:block;padding:5px 0;color:#555;font-size:14px}.mega a:hover{color:var(--pink)}
.container{width:min(1280px,92%);margin:auto}.hero{margin:18px auto 0;border-radius:24px;overflow:hidden;position:relative;min-height:430px;background:#ffeaf2}.slide{display:none;min-height:430px;align-items:center;position:relative}.slide.active{display:flex}.slide-copy{padding:55px;max-width:53%;z-index:2}.eyebrow{font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--pink);font-weight:800}.slide h1{font:700 clamp(38px,5vw,64px) Georgia,serif;line-height:1.02;margin:12px 0}.slide h1 span{color:var(--pink)}.slide p{font-size:18px;color:#666;line-height:1.6}.slide-img{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:cover}.slider-btn{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:50%;background:#fff;box-shadow:0 4px 16px #0002;cursor:pointer;z-index:5}.slider-btn.prev{left:15px}.slider-btn.next{right:15px}.dots{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:7px}.dot{width:9px;height:9px;border-radius:50%;background:#ccc;border:0}.dot.active{background:var(--pink)}
.section{padding:35px 0}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.section h2{font:700 29px Georgia,serif;margin:0}.viewall{color:var(--pink);font-weight:700;font-size:14px}
.category-row{display:grid;grid-template-columns:repeat(11,1fr);gap:12px}.category-card{text-align:center;padding:10px 6px;border:1px solid var(--line);border-radius:17px;transition:.2s;background:#fff}.category-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.category-card img{display:block;width:78px;height:78px;border-radius:50%;object-fit:cover;margin:auto}.category-card b{display:block;font-size:12px;margin-top:8px}
.products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product{border:1px solid var(--line);border-radius:17px;background:#fff;overflow:hidden;position:relative;transition:.2s}.product:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.product-img{width:100%;height:320px;object-fit:cover;object-position:center top;background:#fff2f7;display:block}.wish{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;border-radius:50%;background:#fff;box-shadow:0 3px 10px #0001;cursor:pointer;font-size:19px}.wish.active{color:var(--pink)}.pbody{padding:13px}.pname{font-weight:700;line-height:1.35;min-height:38px}.desc{font-size:12px;color:#888;margin:5px 0}.stars{color:#f1a400;font-size:13px}.rating-count{color:#777}.price{font-size:20px;font-weight:800}.mrp{text-decoration:line-through;color:#999;font-size:12px;margin-left:5px}.discount{color:var(--pink);font-size:12px;font-weight:800;margin-left:5px}.p-actions{display:flex;gap:7px;margin-top:10px}.p-actions button{flex:1;border-radius:9px;padding:9px 5px;cursor:pointer;border:1px solid var(--pink);background:#fff;color:var(--pink);font-weight:700;font-size:12px}.p-actions .add{background:var(--pink);color:#fff}
.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.promo{height:220px;border-radius:20px;overflow:hidden;position:relative;background:#ffeaf2}.promo img{width:100%;height:100%;object-fit:cover;opacity:.8}.promo-content{position:absolute;left:25px;bottom:22px;max-width:60%;z-index:2}.promo-content h3{font:700 26px Georgia,serif;margin:0 0 5px}.promo-content p{margin:0 0 12px;color:#555}
.depts{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}.dept{min-height:200px;border-radius:18px;overflow:hidden;position:relative;background:#f9edf2}.dept img{width:100%;height:100%;object-fit:cover}.dept:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#0009)}.dept-text{position:absolute;left:17px;bottom:15px;color:#fff;z-index:2}.dept-text h3{margin:0 0 3px;font:700 22px Georgia,serif}
.service{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:var(--soft);border-radius:20px;padding:22px}.service-item{text-align:center}.service-icon{font-size:27px;color:var(--pink)}.service-item b{display:block;margin:5px}.muted{color:var(--muted)}
.footer{background:#24161d;color:#fff;margin-top:45px;padding:45px 5%}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:30px}.footer .logo{color:#ff6d9e}.footer a{display:block;color:#ddd;margin:8px 0;font-size:13px}.footer h4{margin:0 0 12px}.payments{margin-top:25px;padding-top:20px;border-top:1px solid #ffffff20;color:#bbb;font-size:12px}
.breadcrumb{padding:20px 0;color:#777;font-size:13px}.page-title{background:linear-gradient(110deg,#fff0f6,#fff);padding:32px;border-radius:20px;margin-bottom:25px}.page-title h1{font:700 40px Georgia,serif;margin:0 0 8px}.layout{display:grid;grid-template-columns:240px 1fr;gap:25px}.filter{border:1px solid var(--line);border-radius:18px;padding:18px;height:max-content;position:sticky;top:125px}.filter h3{margin-top:0}.filter-section{padding:13px 0;border-top:1px solid var(--line)}.filter-section label{display:block;padding:6px 0;font-size:13px}.sortbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.sortbar select{padding:9px 12px;border:1px solid #ddd;border-radius:9px}
.detail{display:grid;grid-template-columns:1.05fr .95fr;gap:35px}.gallery-main{width:100%;height:590px;object-fit:cover;border-radius:20px;background:#fff2f7}.thumbs{display:flex;gap:9px;margin-top:10px;overflow:auto}.thumbs img{width:76px;height:76px;object-fit:cover;border-radius:10px;border:2px solid transparent;cursor:pointer}.thumbs img.active{border-color:var(--pink)}.detail-info h1{font:700 37px Georgia,serif;margin:0 0 10px}.big-price{font-size:34px;font-weight:800;margin:15px 0}.stock{color:var(--green);font-weight:700}.option{margin:20px 0}.option-title{font-weight:800}.options{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.options button{padding:10px 15px;border:1px solid #ddd;background:#fff;border-radius:8px;cursor:pointer}.options button.active{border-color:var(--pink);color:var(--pink);box-shadow:0 0 0 1px var(--pink)}.qty{display:flex;align-items:center;gap:12px}.qty button{width:32px;height:32px;border:1px solid #ddd;background:#fff;border-radius:7px;cursor:pointer}.detail-actions{display:flex;gap:10px;margin-top:20px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;border-radius:10px;border:1px solid var(--pink);background:var(--pink);color:#fff;font-weight:800;cursor:pointer}.btn.secondary{background:#fff;color:var(--pink)}.tabs{margin-top:35px}.tab-buttons{display:flex;border-bottom:1px solid var(--line);gap:22px}.tab-buttons button{padding:14px 2px;border:0;background:none;cursor:pointer;color:#777;font-weight:700}.tab-buttons button.active{color:var(--pink);border-bottom:2px solid var(--pink)}.tab-content{padding:20px 0;line-height:1.7}
.modal-wrap{position:fixed;inset:0;background:#0008;display:none;align-items:center;justify-content:center;z-index:500;padding:18px}.modal-wrap.open{display:flex}.modal{background:#fff;border-radius:20px;max-width:850px;width:100%;max-height:90vh;overflow:auto;padding:24px;position:relative}.close{position:absolute;right:15px;top:12px;border:0;background:#f5f5f5;width:34px;height:34px;border-radius:50%;cursor:pointer}.quick{display:grid;grid-template-columns:1fr 1fr;gap:25px}.quick img{width:100%;height:350px;object-fit:cover;border-radius:14px}
.cart-layout{display:grid;grid-template-columns:1.45fr .7fr;gap:25px}.panel{border:1px solid var(--line);border-radius:18px;padding:20px;background:#fff}.cart-item{display:grid;grid-template-columns:90px 1fr 120px 100px;gap:15px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}.cart-item img{width:90px;height:90px;object-fit:cover;border-radius:10px}.summary-row{display:flex;justify-content:space-between;padding:8px 0}.total{font-size:23px;font-weight:800;border-top:1px solid var(--line);padding-top:14px}.coupon{display:flex;gap:7px;margin:15px 0}.coupon input{flex:1;padding:11px;border:1px solid #ddd;border-radius:8px}.coupon button{padding:10px 13px;border:0;background:var(--deep);color:#fff;border-radius:8px}.notice{padding:10px;border-radius:8px;background:#eef9f1;color:var(--green);font-size:13px}.error{background:#fff0f0;color:#c33}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field input,.field select,.field textarea{padding:12px;border:1px solid #ddd;border-radius:8px;outline:0}.field input:focus,.field textarea:focus{border-color:var(--pink)}
.steps{display:flex;gap:8px;margin-bottom:20px}.step{flex:1;text-align:center;padding:11px;background:#f5f5f5;border-radius:10px;font-size:12px}.step.active{background:#ffe0ec;color:var(--pink);font-weight:800}
.order-success{text-align:center;padding:60px 20px}.success-icon{font-size:65px;color:var(--green)}.order-id{font-size:24px;font-weight:800;margin:10px}
.orders table{width:100%;border-collapse:collapse}.orders th,.orders td{text-align:left;padding:14px;border-bottom:1px solid var(--line);font-size:14px}.status{padding:5px 9px;border-radius:20px;background:#eaf8ef;color:var(--green);font-size:11px;font-weight:800}.timeline{display:flex;justify-content:space-between;gap:5px;margin:25px 0}.timeline-step{text-align:center;flex:1;font-size:11px;color:#777;position:relative}.timeline-step:before{content:"";display:block;width:20px;height:20px;background:#ddd;border-radius:50%;margin:0 auto 7px}.timeline-step.done{color:var(--green)}.timeline-step.done:before{background:var(--green)}
.search-results{position:absolute;top:52px;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:0 0 15px 15px;box-shadow:var(--shadow);display:none;z-index:300;max-height:360px;overflow:auto}.search-results.open{display:block}.search-wrap{position:relative;flex:1;max-width:690px}.search-wrap .search{max-width:none}.search-result{display:flex;gap:10px;padding:10px;border-bottom:1px solid #eee}.search-result img{width:50px;height:50px;object-fit:cover;border-radius:7px}
.toast{position:fixed;right:20px;bottom:20px;background:#24161d;color:#fff;padding:13px 17px;border-radius:10px;box-shadow:var(--shadow);transform:translateY(30px);opacity:0;pointer-events:none;transition:.25s;z-index:1000}.toast.show{transform:none;opacity:1}
.mobile-bottom{display:none}
@media(max-width:1050px){.category-row{grid-template-columns:repeat(6,1fr)}.products{grid-template-columns:repeat(3,1fr)}.depts{grid-template-columns:repeat(3,1fr)}.header{gap:12px}.actions{gap:7px}}
@media(max-width:760px){.topbar{display:none}.header{flex-wrap:wrap;padding:12px 4%;position:sticky}.logo{font-size:24px}.actions{margin-left:auto}.action{min-width:42px}.search-wrap{order:3;flex-basis:100%;max-width:none}.nav{display:none}.category-row{grid-template-columns:repeat(4,1fr)}.category-card img{width:62px;height:62px}.products{grid-template-columns:repeat(2,1fr);gap:10px}.product-img{height:205px}.p-actions{flex-direction:column}.promo-grid{grid-template-columns:1fr}.depts{grid-template-columns:1fr 1fr}.service{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}.layout,.cart-layout,.detail,.quick{grid-template-columns:1fr}.filter{position:static}.gallery-main{height:420px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.cart-item{grid-template-columns:70px 1fr}.cart-item .cart-price,.cart-item .cart-qty{grid-column:2}.mobile-bottom{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);z-index:300;padding:7px 3px}.mobile-bottom a{text-align:center;font-size:10px}.mobile-bottom b{display:block;font-size:19px}.footer{padding-bottom:85px}.hero,.slide{min-height:500px}.slide-copy{max-width:100%;padding:35px 25px}.slide-img{width:100%;opacity:.25}.mega{position:fixed;left:3%;right:3%;top:115px;grid-template-columns:1fr 1fr;max-height:75vh;overflow:auto}.timeline{overflow:auto}.timeline-step{min-width:95px}}


/* Mega menu fix V2: keep the dropdown outside the scrollable nav on every page. */
.nav-shell{position:relative;z-index:220;background:#fff}
.nav-shell .nav{position:relative;z-index:1;overflow-x:auto;overflow-y:hidden}
.nav-shell .mega{position:absolute;top:100%;left:5%;right:5%;z-index:260;max-height:min(70vh,560px);overflow:auto}
.nav-shell .mega.open{display:grid}
@media(max-width:760px){
  .nav-shell{z-index:320}
  .nav-shell .nav{display:flex;gap:10px;padding:8px 4%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav-shell .nav::-webkit-scrollbar{display:none}
  .nav-shell .nav>a{flex:0 0 auto;font-size:12px}
  .nav-shell .mega{position:fixed;top:var(--hc-mega-top,150px);left:3%;right:3%;max-height:calc(100dvh - 230px);overflow:auto;grid-template-columns:1fr 1fr;padding:16px;gap:14px;z-index:400;border-radius:14px}
}
@media(max-width:380px){
  .nav-shell .mega{grid-template-columns:1fr;max-height:calc(100dvh - 220px)}
}

.category-card.category-image-missing{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px}
.category-card.category-image-missing:before{content:'♡';display:flex;align-items:center;justify-content:center;width:78px;height:78px;border-radius:50%;background:var(--soft);color:var(--pink);font-size:32px;border:1px solid var(--line)}
@media(max-width:760px){.category-card.category-image-missing:before{width:62px;height:62px}}

/* Huma Collections mobile overflow hardening V1.
   Additive overrides only: preserve existing desktop styles and categoryId behavior. */
html, body { width: 100%; max-width: 100%; }
body { min-width: 0; }
img, picture, video, canvas, svg, iframe { max-width: 100%; }
img, video { height: auto; }
input, select, textarea, button { max-width: 100%; }
.container, main, section, article, header, footer, nav, .panel, .page-title,
.layout, .cart-layout, .detail, .products, .category-row, .promo-grid, .depts,
.service, .footer-grid, .form-grid, .quick, .product, .cart-item, .header, .nav-shell {
  min-width: 0;
}
/* Allow long product names, URLs, addresses and user-entered values to wrap. */
.pname, .desc, .breadcrumb, .page-title, .tab-content, .panel, .field,
.order-id, .summary-row, .footer, .footer a, .product, .cart-item,
.notice, .error, .timeline-step, .modal, .mega a {
  overflow-wrap: anywhere;
  word-break: normal;
}
/* Tables must scroll within the page rather than widening the entire viewport. */
.orders { max-width: 100%; min-width: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.orders table { width: 100%; max-width: 100%; }
@media (max-width: 760px) {
  html, body { overflow-x: clip; }
  .container { width: 92%; max-width: 100%; }
  .header { gap: 10px; padding-left: 4%; padding-right: 4%; }
  .header > *, .search-wrap, .search, .search input { min-width: 0; }
  .logo { max-width: 100%; white-space: normal; font-size: clamp(20px, 6vw, 24px); }
  .actions { max-width: 100%; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
  .action { min-width: 36px; }
  .search input { width: 100%; }
  .section-head { align-items: flex-start; gap: 10px; flex-wrap: wrap; }
  .section h2 { font-size: clamp(22px, 6vw, 29px); }
  .hero, .slide { min-width: 0; max-width: 100%; }
  .slide-copy { width: 100%; max-width: 100%; padding: 28px 22px; }
  .slide h1 { font-size: clamp(30px, 8vw, 42px); overflow-wrap: anywhere; }
  .slide p { font-size: 16px; }
  .slide-img { max-width: 100%; }
  .category-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-img { width: 100%; max-width: 100%; height: clamp(150px, 52vw, 220px); object-fit: cover; }
  .pbody { padding: 10px; }
  .price { font-size: clamp(16px, 4.5vw, 20px); }
  .mrp, .discount { margin-left: 2px; }
  .p-actions { min-width: 0; }
  .p-actions button { min-width: 0; overflow-wrap: anywhere; }
  .page-title { padding: 22px 18px; }
  .page-title h1, .detail-info h1 { font-size: clamp(26px, 7vw, 36px); overflow-wrap: anywhere; }
  .layout, .cart-layout, .detail, .quick { grid-template-columns: minmax(0, 1fr); }
  .detail > *, .cart-layout > *, .layout > *, .quick > * { min-width: 0; }
  .gallery-main { width: 100%; height: auto; max-height: 70vh; object-fit: contain; }
  .detail-actions { flex-wrap: wrap; }
  .detail-actions .btn { flex: 1 1 140px; min-width: 0; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .field.full { grid-column: auto; }
  .field input, .field select, .field textarea { width: 100%; min-width: 0; }
  .cart-item { grid-template-columns: 64px minmax(0, 1fr); gap: 10px; }
  .cart-item img { width: 64px; height: 64px; }
  .cart-item > * { min-width: 0; }
  .coupon { flex-wrap: wrap; }
  .coupon input { min-width: 0; width: 100%; }
  .coupon button { flex: 0 0 auto; }
  .steps { flex-wrap: wrap; }
  .step { min-width: 0; overflow-wrap: anywhere; }
  .orders table { display: block; overflow-x: auto; white-space: nowrap; }
  .orders th, .orders td { padding: 10px; }
  .timeline { max-width: 100%; overflow-x: auto; }
  .timeline-step { flex: 0 0 85px; }
  .modal-wrap { padding: 10px; }
  .modal { max-width: 100%; padding: 18px; }
  .quick img { width: 100%; height: auto; max-height: 55vh; object-fit: contain; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; }
  .footer-grid > * { min-width: 0; }
  .service { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px 10px; }
  .nav-shell .nav { max-width: 100%; }
  .nav-shell .mega { max-width: 94%; box-sizing: border-box; }
}
@media (max-width: 420px) {
  .category-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .depts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .promo-content { left: 16px; right: 12px; max-width: calc(100% - 28px); }
  .promo-content h3 { font-size: 22px; }
  .footer { padding-left: 4%; padding-right: 4%; }
  .footer-grid { gap: 18px 12px; }
  .mobile-bottom a { min-width: 0; overflow-wrap: anywhere; }
}
@media (max-width: 340px) {
  .products, .footer-grid, .service, .depts { grid-template-columns: minmax(0, 1fr); }
  .actions { width: 100%; justify-content: space-between; }
  .category-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav-shell .mega { grid-template-columns: minmax(0, 1fr); }
}

/* =========================================================
   SF HEADER ACTIONS: align Wishlist / Account / Cart top-right
   Shared partial markup: partials/header.html
   ========================================================= */

.header {
    display: grid;
    grid-template-columns: max-content minmax(220px, 1fr) auto;
    align-items: start;
    gap: clamp(10px, 1.6vw, 22px);
}

.header > a:first-child {
    grid-column: 1;
    grid-row: 1;
    display: block;
    align-self: start;
    min-width: 0;
    text-decoration: none;
}

.header .logo {
    display: block;
}

.header .search-wrap {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    width: 100%;
    min-width: 0;
    max-width: 690px;
}

.header .actions {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    flex-wrap: nowrap;
    width: auto;
    max-width: none;
    margin: 0 0 0 auto;
    padding-top: 0;
    gap: clamp(6px, 0.9vw, 14px);
}

.header .action {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 auto;
    min-width: 55px;
    padding: 0 2px;
    line-height: 1.15;
    white-space: nowrap;
    text-align: center;
    position: relative;
}

.header .action .ico {
    display: block;
    line-height: 1;
    margin: 0 0 4px;
}

.header .action .badge {
    top: -3px;
    right: 4px;
}

/* Compact desktop / tablet */
@media (max-width: 1050px) and (min-width: 761px) {
    .header {
        grid-template-columns: max-content minmax(120px, 1fr) auto;
        gap: 10px;
        padding-left: 3%;
        padding-right: 3%;
    }

    .header .logo {
        font-size: clamp(19px, 2.3vw, 24px);
    }

    .header .tagline {
        font-size: 10px;
    }

    .header .actions {
        gap: 4px;
    }

    .header .action {
        min-width: 43px;
        font-size: 10px;
    }

    .header .action .ico {
        font-size: 20px;
    }
}

/* Mobile: actions stay at the top-right of the first header row */
@media (max-width: 760px) {
    .header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        column-gap: 7px;
        row-gap: 10px;
        padding: 12px 4%;
    }

    .header > a:first-child {
        grid-column: 1;
        grid-row: 1;
        align-self: start;
        min-width: 0;
    }

    .header .logo {
        max-width: 100%;
        font-size: clamp(18px, 5.5vw, 23px);
        line-height: 1.12;
        white-space: nowrap;
    }

    .header .tagline {
        display: none;
    }

    .header .actions {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        justify-self: end;
        width: auto;
        max-width: none;
        margin: 0;
        padding-top: 0;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 2px;
    }

    .header .action {
        min-width: clamp(34px, 10vw, 40px);
        padding: 1px;
        font-size: 9px;
    }

    .header .action .ico {
        font-size: 20px;
        line-height: 21px;
        margin-bottom: 2px;
    }

    .header .action .badge {
        top: -2px;
        right: 0;
        min-width: 16px;
        height: 16px;
        padding: 2px;
        font-size: 9px;
    }

    .header .search-wrap {
        grid-column: 1 / -1;
        grid-row: 2;
        align-self: stretch;
        width: 100%;
        min-width: 0;
        max-width: none;
        order: initial;
    }

    .header .search {
        width: 100%;
        min-width: 0;
    }

    .header .search input {
        min-width: 0;
        width: 100%;
    }
}

/* Very narrow phones */
@media (max-width: 380px) {
    .header {
        column-gap: 5px;
    }

    .header .logo {
        font-size: 18px;
    }

    .header .actions {
        gap: 0;
    }

    .header .action {
        min-width: 33px;
        font-size: 8px;
    }

    .header .action .ico {
        font-size: 18px;
    }
}