/* Huru Search — Google-style look. Light only (matches the reference). */
:root {
  --bg: #fff; --ink: #202124; --muted: #5f6368; --line: #dfe1e5; --link: #1a0dab; --visited: #681da8;
  --green: #006621; --blue: #4285f4; --red: #ea4335; --yellow: #fbbc05; --g: #34a853; --hover: #f8f9fa;
  --teal: #0f9d8a;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--bg); color: var(--ink); font: 14px/1.58 arial, "Helvetica Neue", Helvetica, "Noto Sans", "Noto Sans Bengali", sans-serif; -webkit-text-size-adjust: 100%; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
button { font: inherit; cursor: pointer; }
[dir="rtl"] body { direction: rtl; }

/* ---- top bar ---- */
.topbar { display: flex; align-items: center; justify-content: flex-end; gap: 14px; padding: 14px 22px 0; min-height: 52px; }
.lang { position: relative; }
.lang__btn { display: inline-flex; align-items: center; gap: 8px; background: none; border: 0; padding: 6px 8px; border-radius: 999px; color: var(--ink); font-weight: 600; font-size: 13px; }
.lang__btn:hover { background: var(--hover); }
.lang__flag { font-size: 18px; line-height: 1; }
.lang__menu { position: absolute; top: calc(100% + 6px); inset-inline-end: 0; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.14); padding: 6px; min-width: 170px; z-index: 50; display: none; }
.lang__menu[data-open="1"] { display: block; }
.lang__item { display: flex; align-items: center; gap: 10px; width: 100%; background: none; border: 0; padding: 8px 10px; border-radius: 8px; text-align: start; color: var(--ink); font-size: 13px; }
.lang__item:hover, .lang__item[aria-current="true"] { background: var(--hover); }

/* ---- home ---- */
.home { min-height: 100svh; display: flex; flex-direction: column; }
.home__center { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 16px 12vh; }
.brand { display: inline-flex; align-items: center; gap: 6px; text-decoration: none !important; }
.brand__icon { width: 46px; height: 46px; border-radius: 11px; }
.brand__word { font-size: 46px; font-weight: 500; letter-spacing: -1px; line-height: 1; }
.brand__word span:nth-child(1) { color: var(--blue); } .brand__word span:nth-child(2) { color: var(--red); }
.brand__word span:nth-child(3) { color: var(--yellow); } .brand__word span:nth-child(4) { color: var(--blue); }
.brand__word span:nth-child(5) { color: var(--g); } .brand__word span:nth-child(6) { color: var(--red); }
.brand__word span:nth-child(n+7) { color: var(--blue); }
.brand--small .brand__icon { width: 30px; height: 30px; } .brand--small .brand__word { font-size: 26px; }

.sbox { position: relative; width: 100%; max-width: 1420px; margin: 44px auto 0; }
.sbox__form { display: flex; align-items: center; height: 62px; border: 1px solid var(--line); border-radius: 999px; background: #fff; padding: 0 14px 0 20px; box-shadow: 0 1px 6px rgba(32,33,36,.12); transition: box-shadow .15s; }
.sbox__form:focus-within, .sbox__form:hover { box-shadow: 0 2px 10px rgba(32,33,36,.22); border-color: transparent; }
.sbox__ico { width: 24px; height: 24px; color: #9aa0a6; flex: none; }
.sbox__input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 18px; padding: 0 14px; color: var(--ink); height: 100%; }
.sbox__btn { flex: none; width: 40px; height: 40px; border: 0; background: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--muted); }
.sbox__btn:hover { background: var(--hover); }
.sbox__btn svg { width: 24px; height: 24px; }
.sbox__btn--go { color: var(--blue); }
.sbox__clear { display: none; }
.sbox__form[data-has="1"] .sbox__clear { display: inline-flex; }
.sbox__mic[data-listening="1"] { color: var(--red); animation: pulse 1s infinite; }
@keyframes pulse { 50% { transform: scale(1.15); } }
.sbox__suggest { position: absolute; left: 0; right: 0; top: calc(100% + 4px); background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 4px 16px rgba(0,0,0,.18); overflow: hidden; z-index: 40; display: none; }
.sbox__suggest[data-open="1"] { display: block; }
.sbox__suggest button { display: flex; align-items: center; gap: 12px; width: 100%; border: 0; background: none; padding: 10px 20px; text-align: start; font-size: 16px; color: var(--ink); }
.sbox__suggest button:hover, .sbox__suggest button[aria-selected="true"] { background: var(--hover); }
.sbox__suggest svg { width: 18px; height: 18px; color: #9aa0a6; flex: none; }
.home .sbox { max-width: 1420px; } .home .sbox__form { height: 64px; }
.tagline { margin-top: 26px; color: var(--muted); font-size: 14px; text-align: center; }
.home__buttons { display: flex; gap: 12px; margin-top: 26px; flex-wrap: wrap; justify-content: center; }
.home__buttons button { background: var(--hover); border: 1px solid var(--hover); border-radius: 6px; padding: 0 18px; height: 38px; color: #3c4043; font-size: 14px; }
.home__buttons button:hover { border-color: var(--line); box-shadow: 0 1px 1px rgba(0,0,0,.1); }

/* ---- footer ---- */
.footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 22px; padding: 14px 22px; border-top: 1px solid #e8eaed; color: var(--muted); font-size: 15px; background: #f2f2f2; }
.footer a { color: var(--muted); }
.footer__links { display: flex; gap: 22px; flex-wrap: wrap; }
.footer__meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.footer .lang__menu { top: auto; bottom: calc(100% + 6px); }
.more { display: none; }

/* ---- results page (classic Google: grey bar, rectangular box + blue button, underlined tabs) ---- */
.rhead { position: sticky; top: 0; z-index: 30; background: #fff; border-bottom: 1px solid #ebebeb; }
.rhead__bar { background: #f1f1f1; border-bottom: 1px solid #e5e5e5; }
.rhead__row { display: flex; align-items: center; gap: 24px; padding: 20px 28px; max-width: 1400px; }
.rhead__spacer { flex: 1; }
.brand--small .brand__icon { width: 30px; height: 30px; }
.brand--small .brand__word { font-size: 30px; letter-spacing: -.5px; }
.sbox--classic { margin: 0; flex: 0 1 820px; max-width: 820px; }
.sbox--classic .sbox__form { height: 46px; border-radius: 2px; border: 1px solid #dcdcdc; box-shadow: none; padding: 0 0 0 16px; background: #fff; }
.sbox--classic .sbox__form:focus-within, .sbox--classic .sbox__form:hover { border-color: #c6c6c6; box-shadow: inset 0 1px 2px rgba(0,0,0,.08); }
.sbox--classic .sbox__input { font-size: 18px; padding: 0 8px 0 0; }
.sbox--classic .sbox__btn { width: 36px; height: 36px; }
.sbox--classic .sbox__mic svg { width: 22px; height: 22px; }
.sbox__go { flex: none; width: 56px; height: 46px; margin-inline-end: -1px; border: 1px solid #3079ed; background: #4285f4; color: #fff; border-radius: 0 2px 2px 0; display: inline-flex; align-items: center; justify-content: center; }
.sbox__go:hover { background: #357ae8; }
.sbox__go-ico { width: 22px; height: 22px; stroke-width: 2.4; }
[dir="rtl"] .sbox__go { border-radius: 2px 0 0 2px; }
.sbox--classic .sbox__suggest { border-radius: 0 0 4px 4px; }
.tabs { display: flex; align-items: stretch; gap: 0; padding: 0 28px 0 132px; max-width: 1400px; overflow-x: auto; height: 58px; }
.tabs button, .more__btn { background: none; border: 0; border-bottom: 3px solid transparent; padding: 0 16px; margin: 0 2px; color: #777; font-size: 14px; display: inline-flex; align-items: center; white-space: nowrap; height: 100%; }
.tabs button[aria-selected="true"] { color: #1a73e8; border-bottom-color: #1a73e8; font-weight: 700; }
.tabs button:hover, .more__btn:hover { color: #222; }
.more { position: relative; display: inline-flex; }
.more__menu { position: absolute; top: 100%; inset-inline-start: 0; background: #fff; border: 1px solid #dfe1e5; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,.15); min-width: 170px; padding: 6px 0; display: none; z-index: 40; }
.more[data-open="1"] .more__menu { display: block; }
.more__menu a { display: block; padding: 8px 16px; color: #222; font-size: 14px; }
.more__menu a:hover { background: #f5f5f5; text-decoration: none; }
.rmain { max-width: 1400px; padding: 10px 28px 40px 132px; min-height: calc(100svh - 200px); }
.results { max-width: 880px; }
.notice { background: #fef7e0; border: 1px solid #f9e3a3; color: #5f4b00; border-radius: 6px; padding: 14px 16px; margin: 16px 0; line-height: 1.5; }
.stats { color: #70757a; font-size: 14px; margin: 14px 0 12px; }
.related { max-width: 880px; margin-top: 8px; padding-top: 22px; border-top: 1px solid #e5e5e5; }
.related h2 { font-size: 24px; font-weight: 400; color: #555; margin: 0 0 14px; }
.related ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 40px; max-width: 700px; }
.related a { color: var(--link); font-size: 17px; }
.related a b { font-weight: 700; }

/* ---- Google Programmable Search results, styled like classic Google ---- */
/* Google's locale CSS (e.g. -ar) flips direction; follow the page direction instead. */
.gsc-control-cse, .gsc-control-cse .gs-title, .gsc-control-cse .gs-snippet, .gsc-control-cse .gs-visibleUrl, .gsc-control-cse .gsc-cursor-box { direction: inherit !important; text-align: start !important; }
.gsc-control-cse, .gsc-control-cse-en { padding: 0 !important; border: 0 !important; background: transparent !important; font-family: inherit !important; }
.gsc-above-wrapper-area, .gsc-tabsArea, .gsc-refinementsArea { display: none !important; }
.gsc-results { padding: 0 !important; }
.gsc-adBlock, .gsc-adBlockNoHeight { margin: 0 0 20px !important; }
.gsc-webResult.gsc-result, .gsc-results .gsc-imageResult { border: 0 !important; border-bottom: 1px solid #e5e5e5 !important; padding: 14px 0 22px !important; margin: 0 !important; background: transparent !important; }
.gsc-webResult.gsc-result:hover { border-color: #e5e5e5 !important; }
.gsc-thumbnail-inside, .gsc-url-top, .gsc-url-bottom { padding: 0 !important; }
.gsc-table-result { display: block !important; }
.gsc-table-cell-thumbnail { display: none !important; }
.gs-webResult .gs-title, .gs-title { font-size: 22px !important; line-height: 1.3 !important; margin: 0 0 6px !important; text-decoration: none !important; height: auto !important; overflow: visible !important; }
.gs-webResult .gs-title a, .gs-webResult .gs-title b, .gs-title a.gs-title, .gs-title a.gs-title b { color: #1a0dab !important; font-weight: 400 !important; text-decoration: none !important; }
.gs-webResult .gs-title a b, .gs-title a.gs-title b { font-weight: 700 !important; }
.gs-webResult .gs-title a:hover { text-decoration: underline !important; }
.gs-webResult .gs-title a:visited, .gs-webResult .gs-title a:visited b { color: #609 !important; }
.gs-webResult div.gs-snippet, .gs-snippet { color: #222 !important; font-size: 16px !important; line-height: 1.6 !important; }
.gs-snippet b { font-weight: 700 !important; color: #222 !important; }
.gs-webResult div.gs-visibleUrl, .gs-visibleUrl { color: #006621 !important; font-size: 16px !important; line-height: 1.5 !important; margin-top: 4px !important; }
.gs-visibleUrl-short { display: inline !important; }
.gs-visibleUrl-long { display: none !important; }
.gs-webResult.gs-result { display: flex !important; flex-direction: column !important; }
.gs-webResult .gsc-url-top { order: 3; }
.gs-visibleUrl-breadcrumb { display: none !important; }
.gs-image-box img { border-radius: 4px !important; }
.gsc-cursor-box { margin: 26px 0 0 !important; text-align: center !important; }
.gsc-cursor { display: inline-flex !important; gap: 4px !important; }
.gsc-cursor-page { color: #666 !important; font-size: 24px !important; min-width: 48px !important; padding: 4px 8px !important; border-radius: 2px !important; text-decoration: none !important; }
.gsc-cursor-current-page { color: #fff !important; background: #4285f4 !important; font-weight: 700 !important; }
.gsc-cursor-page:hover { text-decoration: none !important; background: #f1f1f1 !important; }
.gsc-cursor-current-page:hover { background: #4285f4 !important; }
.gsc-result-info, .gsc-orderby-container { color: #70757a !important; font-size: 14px !important; padding: 8px 0 !important; }
.gs-no-results-result .gs-snippet, .gs-error-result .gs-snippet { background: transparent !important; border: 0 !important; padding: 0 !important; color: var(--ink) !important; font-size: 16px !important; }
.gsc-control-cse .gs-spelling { color: #222 !important; font-size: 16px !important; padding: 8px 0 14px !important; }
.gsc-control-cse .gs-spelling a { color: #1a0dab !important; font-weight: 500 !important; }
.gsc-loading-fade { opacity: .6; }
.gcsc-find-more-on-google, .gcsc-more-maybe-branding-root { display: none !important; }
.gsc-imageResult-column { width: 180px !important; padding: 6px !important; }
.gsc-imageResult .gs-image-box img { max-width: 100% !important; height: auto !important; }

/* ---- static pages ---- */
.page { max-width: 760px; margin: 0 auto; padding: 30px 20px 60px; font-size: 16px; line-height: 1.7; }
.page h1 { font-size: 30px; font-weight: 500; margin: 20px 0 8px; }
.page h2 { font-size: 20px; font-weight: 500; margin: 26px 0 6px; }
.page p, .page li { color: #3c4043; }
.page .meta { color: var(--muted); font-size: 14px; }
.card { border: 1px solid var(--line); border-radius: 12px; padding: 18px 20px; margin: 14px 0; }
.form label { display: block; font-weight: 600; margin: 14px 0 6px; color: var(--ink); }
.form input, .form textarea { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; font: inherit; }
.form button { background: #1a73e8; color: #fff; border: 0; border-radius: 8px; padding: 10px 18px; font-weight: 600; margin-top: 14px; }

@media (max-width: 720px) {
  .topbar { padding: 10px 12px 0; }
  .brand__icon { width: 36px; height: 36px; } .brand__word { font-size: 36px; }
  .home__center { padding-bottom: 8vh; }
  .sbox { margin-top: 30px; }
  .home .sbox__form { height: 54px; padding-inline-start: 14px; }
  .sbox__input { font-size: 16px; padding: 0 8px; }
  .gs-webResult .gs-title { font-size: 18px !important; line-height: 24px !important; }
  .footer { font-size: 14px; padding: 12px 14px; justify-content: center; text-align: center; }
  .footer__links { justify-content: center; }
}

/* native search-input chrome off (we draw our own clear button) */
.sbox__input::-webkit-search-cancel-button, .sbox__input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }

/* ---- site row (favicon + host) injected into each result; desktop hides it ---- */
.hs-site { display: none; align-items: center; gap: 10px; margin-bottom: 8px; }
.hs-site__ico { width: 22px; height: 22px; border-radius: 50%; background: #f1f3f4; object-fit: contain; padding: 2px; flex: none; }
.hs-site__ico--txt { display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #5f6368; }
.hs-site__col { display: flex; flex-direction: column; min-width: 0; }
.hs-site__name { color: #202124; font-size: 15px; line-height: 1.3; }
.hs-site__url { color: #5f6368; font-size: 13px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.only-mobile { display: none; }

/* ====================== MOBILE: DuckDuckGo-style results ====================== */
@media (max-width: 720px) {
  .only-desktop { display: none; } .only-mobile { display: inline; }
  body.is-results { background: #e8eaed; }
  .rhead { border-bottom: 0; }
  .rhead__bar { background: #fff; border-bottom: 0; }
  .rhead__row { position: relative; flex-wrap: wrap; gap: 6px; padding: 8px 12px 2px; }
  /* header = compact centered "Search Result" wordmark (text only), search box, tabs — no dead space */
  .rhead__row .brand { order: 1; flex: 1 1 100%; justify-content: center; text-align: center; padding: 0; line-height: 1; }
  .rhead__row .brand__icon { display: none; }
  .rhead__row .brand__word { display: inline; font-size: 21px; font-weight: 700; letter-spacing: -.3px; }
  .rhead__spacer { display: none; }
  .rhead__row .lang { display: none; }
  .sbox--classic { order: 2; flex: 1 1 100%; max-width: none; }
  .sbox--classic .sbox__form { height: 48px; border-radius: 999px; border: 1px solid #c9ccd1; padding: 0 6px 0 18px; box-shadow: none; }
  .sbox--classic .sbox__form:focus-within, .sbox--classic .sbox__form:hover { border-color: #4285f4; box-shadow: none; }
  .sbox--classic .sbox__input { font-size: 18px; }
  .sbox--classic .sbox__mic { display: none; }
  .sbox--classic .sbox__clear { display: inline-flex; color: #5f6368; }
  .sbox--classic .sbox__form[data-has="0"] .sbox__clear { visibility: hidden; }
  .sbox__go { width: 40px; height: 40px; margin: 0; border: 0; background: none; color: #5f6368; border-radius: 50%; }
  .sbox__go:hover { background: #f1f3f4; }
  .sbox__go-ico { width: 24px; height: 24px; stroke-width: 2; }
  .sbox--classic .sbox__suggest { border-radius: 16px; }
  .tabs { background: #fff; height: 40px; padding: 0 6px; border-bottom: 1px solid #e0e0e0; }
  .more { display: none; }
  .sbox--classic { margin-top: 2px; }
  .footer__meta { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; width: 100%; }
  .footer .lang__btn { border: 1px solid #dfe1e5; border-radius: 999px; padding: 6px 12px; background: #fff; font-size: 14px; }
  .footer .lang__menu { top: auto; bottom: calc(100% + 6px); inset-inline-end: auto; inset-inline-start: 0; max-height: 60vh; overflow-y: auto; }
  .tabs button, .more__btn { padding: 0 10px; margin: 0; font-size: 16px; color: #494949; border-bottom-width: 2px; }
  .tabs button[aria-selected="true"] { color: #3969ef; border-bottom-color: #3969ef; font-weight: 500; }
  .rhead { position: sticky; top: 0; z-index: 30; box-shadow: 0 1px 0 #e0e0e0, 0 4px 14px rgba(0,0,0,.06); }
  .rmain { padding: 8px 0 24px; background: #eef1f4; }
  .results { max-width: none; }
  .notice, .stats { margin: 12px 14px; }
  .gsc-control-cse { background: transparent !important; }
  .gsc-wrapper, .gsc-results-wrapper-nooverlay, .gsc-results { width: 100% !important; max-width: 100% !important; }
  .gsc-results { background: transparent !important; }
  .gsc-webResult.gsc-result { background: #fff !important; border: 0 !important; border-bottom: 0 !important; padding: 16px 16px 18px !important; margin: 0 10px 10px !important; border-radius: 14px !important; box-shadow: 0 1px 2px rgba(0,0,0,.05) !important; }
  .gs-webResult.gs-result { display: flex !important; flex-direction: column !important; }
  .hs-site { display: flex; order: 0; }
  .gsc-thumbnail-inside { order: 1; }
  .gs-webResult .gsc-table-result, .gs-webResult .gs-bidi-start-align.gs-snippet { order: 2; }
  .gs-webResult .gsc-url-top, .gsc-url-bottom { display: none !important; }
  .gs-webResult .gs-title, .gs-title { font-size: 20px !important; line-height: 1.32 !important; margin: 0 0 6px !important; }
  .gs-webResult .gs-title a, .gs-webResult .gs-title b, .gs-title a.gs-title, .gs-title a.gs-title b { color: #2d4ecc !important; }
  .gs-webResult .gs-title a:visited, .gs-webResult .gs-title a:visited b { color: #6c37a5 !important; }
  .gs-webResult div.gs-snippet, .gs-snippet { font-size: 16px !important; line-height: 1.5 !important; color: #3d3d3d !important; }
  /* ads: Google sizes the ad iframe from this block's width at request time — keep it full-width, no side padding */
  .gsc-adBlock { background: #fff !important; padding: 6px 0 !important; margin: 0 10px 10px !important; width: auto !important; max-width: none !important; overflow-x: hidden !important; border-radius: 14px !important; box-shadow: 0 1px 2px rgba(0,0,0,.05) !important; }
  .gsc-adBlock iframe { width: 100% !important; max-width: 100% !important; display: block !important; }
  .gsc-adBlockNoHeight { background: transparent !important; padding: 0 !important; margin: 0 !important; height: 0 !important; overflow: hidden !important; }
  .gsc-cursor-box { background: #fff !important; margin: 0 10px 10px !important; padding: 14px 0 !important; border-radius: 14px !important; }
  .gsc-cursor-page { font-size: 18px !important; min-width: 36px !important; padding: 6px 4px !important; }
  .gsc-results .gsc-imageResult { background: #fff !important; }
  .related { background: #fff; margin: 0 10px 10px; padding: 16px 18px 20px; border-top: 0; max-width: none; border-radius: 14px; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
  .related a { display: block; padding: 8px 12px; border-radius: 999px; background: #f1f3f4; color: #202124; }
  .related li { margin: 0; }
  .related ul { gap: 8px; }
  .related h2 { font-size: 20px; }
  .related ul { grid-template-columns: 1fr; gap: 10px; }
  .related a { font-size: 16px; }
  .footer { background: #fff; border-top: 1px solid #e0e0e0; }
}