/* Alfred: a paper-and-ink visual language, built on the approved palette. */ #alfred-site .am-hero-grid { align-items:center; padding-block:64px; gap:76px; } #alfred-site .am-fee-stage { position:relative; padding:7px 3px; isolation:isolate; } #alfred-site .am-fee-stage::before, #alfred-site .am-fee-stage::after { content:''; position:absolute; inset:7px 3px; border-radius:19px; z-index:-1; border:1px solid #3e183f20; } #alfred-site .am-fee-stage::before { background:#d9c6ec; transform:rotate(6deg) translate(7px,5px); } #alfred-site .am-fee-stage::after { background:#f1e9f7; transform:rotate(-5deg) translate(-6px,5px); } #alfred-site .am-fee-card { padding:26px 32px 29px; min-height:430px; border-radius:18px; background:#fffefd; box-shadow:0 15px 28px #74251b1c; overflow:hidden; transform:rotate(-2deg); border:1px solid #fff; } #alfred-site .am-fee-card:hover { box-shadow:0 20px 40px #74251b30; } #alfred-site .am-fee-content { position:relative; z-index:1; } #alfred-site .am-fee-topline { display:flex; justify-content:space-between; align-items:center; gap:15px; text-transform:uppercase; font-size:10px; font-weight:600; letter-spacing:.18em; } #alfred-site .am-fee-spark { font-size:25px; line-height:1; font-weight:400; } #alfred-site .am-fee-title { font-size:36px; line-height:1.1; font-weight:500; letter-spacing:-.055em; margin-top:20px; } #alfred-site .am-fee-number { display:block; font:700 clamp(105px,12vw,156px)/.91 'Inter',Arial,sans-serif; letter-spacing:-.09em; margin-bottom:11px; } #alfred-site .am-percent { font-size:.67em; display:inline-block; padding-left:.09em; vertical-align:top; margin-top:.12em; letter-spacing:-.085em; } #alfred-site .am-fee-orbit { position:absolute; width:240px; height:240px; right:-111px; top:67px; border-radius:50%; background:repeating-radial-gradient(ellipse at center,transparent 0 7px,#c8b6dc 7.8px 8.5px,transparent 9.2px 13px); opacity:.66; transform:rotate(-20deg) scaleX(.9); } #alfred-site .am-fee-bottom { border-top:1px dashed #bdaacb; margin-top:30px; padding-top:21px; position:relative; } #alfred-site .am-fee-bottom::before, #alfred-site .am-fee-bottom::after { content:''; position:absolute; width:20px; height:20px; background:var(--alfred-red); border-radius:50%; top:-10px; } #alfred-site .am-fee-bottom::before { left:-43px; } #alfred-site .am-fee-bottom::after { right:-43px; } #alfred-site .am-same-day { margin:0; font-size:20px; letter-spacing:-.03em; } #alfred-site .am-fee-context { max-width:235px; margin-top:7px; font-size:13px; line-height:1.5; } #alfred-site .am-fee-card .am-inline-link { font-size:14px; margin-top:14px; text-decoration-color:#141315; } #alfred-site .am-stamp { bottom:26px; right:26px; z-index:2; } #alfred-site .am-stamp-letter { font-size:61px; } #alfred-site .am-hero-cta { box-shadow:3px 4px 0 #14131526; } #alfred-site .am-trust { padding-block:32px; } #alfred-site .am-body { padding-top:42px; } #alfred-site .am-use-cases { padding-bottom:42px; } #alfred-site .am-case { position:relative; min-height:102px; padding:22px; justify-content:flex-start; border:0; border-bottom:3px solid #c4afd9; border-radius:11px; gap:17px; } #alfred-site .am-case svg { width:40px; height:40px; padding:6px; border-radius:10px; background:#f0e8f8; overflow:visible; } #alfred-site .am-case:nth-child(2) svg { background:#ffede9; } #alfred-site .am-case:nth-child(3) svg { background:#e9e3f5; } #alfred-site .am-case-label { font-size:17px; } /* Needs: a personal worksheet, with distinct illustrated options. */ #alfred-site .am-needs { position:relative; padding:38px; border:1px solid #bba6cf; border-radius:22px; background:#dac9eb; box-shadow:0 6px 0 #cbbbdb; } #alfred-site .am-needs-layout { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr); gap:40px; } #alfred-site .am-needs-intro { display:flex; flex-direction:column; align-items:flex-start; padding-block:3px; } #alfred-site .am-needs-intro .am-eyebrow { display:flex; align-items:center; gap:10px; font-size:10px; letter-spacing:.09em; } #alfred-site .am-chapter { display:grid; place-items:center; width:29px; height:29px; background:var(--alfred-red); border:1px solid #141315; border-radius:50%; font-size:11px; letter-spacing:0; } #alfred-site .am-needs .am-section-title { margin-top:28px; font-size:clamp(48px,5vw,67px); letter-spacing:-.06em; line-height:.99; font-weight:400; } #alfred-site .am-needs .am-section-title em { font-weight:400; } #alfred-site .am-needs-caption { font-size:15px; line-height:1.65; color:#44334e; margin-top:21px; } #alfred-site .am-needs-note { margin-top:auto; padding-top:26px; } #alfred-site .am-needs-note p { margin-top:7px; font-size:12px; color:#54405f; } #alfred-site .am-needs .am-badge { background:transparent; color:#483253; border-color:#9e83b5; border-radius:99px; padding:5px 10px; font-size:10px; } #alfred-site .am-need-options { margin:0; gap:14px; } #alfred-site .am-need-options li { display:flex; flex-direction:column; align-items:flex-start; position:relative; justify-content:flex-start; gap:0; min-height:181px; background:#fffefd; padding:19px 21px 20px; border:1px solid #bdabc9; border-radius:11px; box-shadow:0 3px 0 #bca9cd; transition:transform .25s,box-shadow .25s; } #alfred-site .am-need-options li:hover { transform:translateY(-3px); box-shadow:0 6px 0 #bca9cd; } #alfred-site .am-option-top { display:flex; justify-content:space-between; align-items:center; width:100%; gap:12px; color:#695775; font-size:9px; font-weight:500; letter-spacing:.11em; } #alfred-site .am-choice-mark { width:16px; height:16px; border-color:#9e8aaa; border-radius:4px; } #alfred-site .am-need-icon { display:grid; place-items:center; width:63px; height:63px; margin-top:14px; background:#eee5f7; border-radius:50%; position:relative; } #alfred-site .am-need-icon::after { content:''; position:absolute; inset:6px -4px -3px 5px; border:1px solid #b29ac5; border-radius:50%; transform:rotate(-12deg); } #alfred-site .am-need-icon svg { width:31px; height:31px; stroke-width:1.4; position:relative; z-index:1; } #alfred-site .am-need-options li:nth-child(2) .am-need-icon, #alfred-site .am-need-options li:nth-child(3) .am-need-icon { background:#ffe3dc; } #alfred-site .am-need-options li:nth-child(2) .am-need-icon::after, #alfred-site .am-need-options li:nth-child(3) .am-need-icon::after { border-color:#d8a697; } #alfred-site .am-option-name { margin-top:17px; font-size:18px; font-weight:500; letter-spacing:-.04em; line-height:1.3; } #alfred-site .am-journey { margin-top:29px; border-top-color:#b29ac5; } #alfred-site .am-journey summary { padding-top:21px; font-size:14px; } #alfred-site .am-journey summary > span { width:28px; height:28px; display:grid; place-items:center; border:1px solid #ad95bf; border-radius:50%; font-size:20px; } #alfred-site .am-question-list li { border-color:#bda5cf; } #alfred-site .am-question-list p, #alfred-site .am-journey-note { color:#45314f; } #alfred-site .am-step-tag { border-color:#a88cbd; color:#432c51; } /* A considered, quiet proof strip; the story carries the personality. */ #alfred-site .am-proof { padding-block:43px; } #alfred-site .am-stat strong { font-size:32px; } #alfred-site .am-about { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); column-gap:68px; padding:50px 0 34px; border-top:1px solid #bfaacf; } #alfred-site .am-about-story { padding-top:7px; } #alfred-site .am-about h2 { font:400 clamp(34px,3.8vw,49px)/1.12 Georgia,serif; letter-spacing:-.055em; margin:22px 0 24px; } #alfred-site .am-about h2 em { font-weight:400; } #alfred-site .am-about-story > p:not(.am-eyebrow) { font-size:16px; line-height:1.75; max-width:520px; color:#473a50; } #alfred-site .am-about-story > p + p { margin-top:16px; } #alfred-site .am-founders { display:flex; align-items:center; gap:14px; margin-top:28px; } #alfred-site .am-founder-monogram { display:flex; align-items:center; justify-content:center; gap:4px; width:63px; height:45px; background:#f7f1fc; border:1px solid #c7b4d6; border-radius:99px; font:400 22px/1 Georgia,serif; } #alfred-site .am-founder-monogram > span { font:12px/1 Arial,sans-serif; color:#877193; } #alfred-site .am-founders p { font-size:15px; font-weight:600; } #alfred-site .am-founders p > span { display:block; font-size:12px; font-weight:400; color:#665172; margin-top:3px; } #alfred-site .am-heritage { align-self:center; border:1px solid #c2abd3; background:#f7f2fb; border-radius:2px 2px 80px 2px; padding:27px 30px 24px; position:relative; box-shadow:8px 8px 0 #d5c5e2; transform:rotate(2deg); } #alfred-site .am-heritage-top { display:flex; align-items:center; justify-content:space-between; gap:12px; } #alfred-site .am-heritage-top .am-eyebrow { font-size:9px; letter-spacing:.12em; } #alfred-site .am-heritage-year { font:11px/1.4 'DM Sans',Arial,sans-serif; white-space:nowrap; color:#6c567a; } #alfred-site .am-heritage-name { margin-top:34px; font:500 24px/1.1 'DM Sans',Arial,sans-serif; letter-spacing:.2em; color:#695277; } #alfred-site .am-heritage-name > span { display:block; font-size:10px; letter-spacing:.3em; margin-top:7px; } #alfred-site .am-heritage-line { height:47px; display:flex; align-items:flex-start; flex-direction:column; justify-content:space-between; border-left:1px dashed #a38bb6; margin:17px 0 12px 4px; } #alfred-site .am-heritage-line span { width:5px; height:5px; border-radius:50%; background:#a38bb6; transform:translateX(-3px); } #alfred-site .am-heritage-alfred { font-size:72px; letter-spacing:-4px; } #alfred-site .am-heritage-alfred small { font-size:12px; margin-left:7px; } #alfred-site .am-heritage > p { font-size:14px; line-height:1.6; margin-top:17px; color:#5c4769; } #alfred-site .am-heritage-foot { display:flex; justify-content:space-between; align-items:center; padding-top:24px; margin-top:22px; border-top:1px solid #d7c9e1; font-size:8px; letter-spacing:.16em; } #alfred-site .am-heritage-foot > span:last-child { color:#e9493b; font-size:28px; line-height:1; padding-right:22px; } #alfred-site .am-values { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:53px; } #alfred-site .am-values > div { border-top:1px solid #bfaacf; padding-top:16px; } #alfred-site .am-values > div > span { font-size:10px; letter-spacing:.07em; color:#765e88; } #alfred-site .am-values h3 { font-size:15px; font-weight:500; margin-top:6px; } #alfred-site .am-locations { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:28px; padding-top:26px; border-top:1px solid #c5b4d5; } #alfred-site .am-locations .am-eyebrow { font-size:10px; color:#5c476b; } #alfred-site .am-locations p { font-size:16px; } #alfred-site .am-locations p > span { margin-inline:16px; color:#a187b6; } #alfred-site .am-support { padding-top:36px; } @media(max-width:1000px) { #alfred-site .am-hero-grid { gap:45px; } #alfred-site .am-fee-card { padding-inline:26px; } #alfred-site .am-fee-title { font-size:31px; } #alfred-site .am-fee-bottom::before { left:-37px; } #alfred-site .am-fee-bottom::after { right:-37px; } #alfred-site .am-fee-context { max-width:195px; } #alfred-site .am-stamp { right:20px; bottom:28px; } #alfred-site .am-needs { padding:29px; } #alfred-site .am-needs-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.6fr); gap:26px; } #alfred-site .am-need-options li { padding:16px; } #alfred-site .am-option-name { font-size:17px; } #alfred-site .am-about { column-gap:40px; } #alfred-site .am-heritage { padding:24px; } #alfred-site .am-heritage-top { align-items:flex-start; flex-direction:column; gap:6px; } } @media(max-width:700px) { #alfred-site .am-hero-grid { gap:40px; padding-block:35px 43px; } #alfred-site .am-fee-stage { width:calc(100% - 14px); margin-inline:auto; padding:5px 3px; } #alfred-site .am-fee-card { padding:25px 25px 28px; min-height:390px; } #alfred-site .am-fee-number { font-size:130px; } #alfred-site .am-fee-title { font-size:31px; } #alfred-site .am-fee-topline { font-size:9px; } #alfred-site .am-fee-orbit { width:210px; height:210px; right:-110px; } #alfred-site .am-fee-bottom { margin-top:26px; padding-top:19px; } #alfred-site .am-fee-bottom::before { left:-36px; } #alfred-site .am-fee-bottom::after { right:-36px; } #alfred-site .am-same-day { font-size:19px; } #alfred-site .am-fee-context { font-size:13px; max-width:210px; } #alfred-site .am-stamp { right:19px; bottom:22px; width:34px; } #alfred-site .am-stamp-letter { font-size:50px; } #alfred-site .am-fee-card .am-inline-link { font-size:14px; max-width:calc(100% - 36px); } #alfred-site .am-body { padding-top:32px; } #alfred-site .am-case { min-height:82px; gap:18px; } #alfred-site .am-use-cases { padding-bottom:32px; } #alfred-site .am-needs { padding:24px 19px; border-radius:16px; } #alfred-site .am-needs-layout { grid-template-columns:1fr; gap:24px; } #alfred-site .am-needs .am-section-title { font-size:50px; margin-top:21px; } #alfred-site .am-needs .am-section-title br { display:none; } #alfred-site .am-needs .am-section-title em::before { content:' '; } #alfred-site .am-needs-caption { font-size:14px; margin-top:13px; } #alfred-site .am-needs-caption br { display:none; } #alfred-site .am-needs-note { padding-top:16px; display:flex; gap:10px; align-items:center; flex-wrap:wrap; } #alfred-site .am-needs-note p { margin:0; font-size:11px; } #alfred-site .am-need-options { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } #alfred-site .am-need-options li { min-height:190px; padding:14px 12px; } #alfred-site .am-option-top { font-size:8px; letter-spacing:.03em; gap:5px; } #alfred-site .am-choice-mark { width:13px; height:13px; border-radius:3px; } #alfred-site .am-need-icon { width:54px; height:54px; margin-top:20px; } #alfred-site .am-need-icon svg { width:28px; height:28px; } #alfred-site .am-option-name { font-size:17px; margin-top:20px; } #alfred-site .am-journey summary { font-size:13px; line-height:1.4; gap:10px; } #alfred-site .am-journey summary > span { flex:none; } #alfred-site .am-proof { padding-block:32px; } #alfred-site .am-stat strong { font-size:28px; } #alfred-site .am-about { grid-template-columns:1fr; padding-top:32px; } #alfred-site .am-about h2 { font-size:38px; margin-block:17px 23px; } #alfred-site .am-about-story > p:not(.am-eyebrow) { font-size:15px; } #alfred-site .am-heritage { margin:35px 7px 0 0; padding:26px; transform:rotate(1deg); } #alfred-site .am-heritage-top { flex-direction:row; } #alfred-site .am-heritage-name { margin-top:29px; } #alfred-site .am-values { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 18px; margin-top:36px; } #alfred-site .am-values h3 { font-size:14px; } #alfred-site .am-locations { align-items:flex-start; flex-direction:column; gap:10px; margin-top:25px; padding-top:23px; } #alfred-site .am-locations p { font-size:15px; } #alfred-site .am-locations p > span { margin-inline:9px; } } @media(max-width:359px) { #alfred-site .am-needs { padding-inline:14px; } #alfred-site .am-option-top { font-size:7px; } #alfred-site .am-fee-context { max-width:180px; font-size:12px; } #alfred-site .am-fee-number { font-size:115px; } #alfred-site .am-stamp { right:14px; bottom:24px; } } @media(prefers-reduced-motion:reduce) { #alfred-site .am-fee-card, #alfred-site .am-heritage, #alfred-site .am-need-options li:hover { transform:none!important; } #alfred-site *, #alfred-site *::before, #alfred-site *::after { animation:none!important; transition:none!important; } } /* Studio direction: a material photograph, live typography and one clear grid. */ #alfred-site[data-palette] { --studio-rule:color-mix(in srgb,var(--alfred-ink) 22%,transparent); } #alfred-site[data-palette] .am-wrap { width:88%; max-width:1280px; } #alfred-site[data-palette] .am-header-inner { min-height:94px; } #alfred-site[data-palette] .am-header .am-logo { font-size:48px; letter-spacing:-2.6px; } #alfred-site[data-palette] .am-nav { gap:32px; font-size:14px; } #alfred-site[data-palette] .am-pill { border-radius:5px; min-height:48px; padding:13px 23px; font-size:14px; box-shadow:none; font-weight:500; } #alfred-site[data-palette] .am-pill:hover { transform:translateY(-1px); box-shadow:0 8px 20px color-mix(in srgb,var(--alfred-ink) 12%,transparent); } #alfred-site[data-palette] .am-preview-bar { font-size:11px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-hero-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); align-items:center; gap:7%; padding-block:48px; } #alfred-site[data-palette] main .am-hero-copy { padding-block:28px 44px; } #alfred-site[data-palette] main .am-title { font:700 clamp(54px,6.5vw,96px)/.97 'Inter',Arial,sans-serif; letter-spacing:-.07em; } #alfred-site[data-palette] main .am-subtitle { font:400 clamp(21px,2vw,28px)/1.4 Georgia,serif; letter-spacing:-.035em; max-width:460px; margin-top:28px; } #alfred-site[data-palette] main .am-subtitle span { display:block; font:400 15px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:0; margin-top:13px; } #alfred-site[data-palette] main .am-hero-cta { margin-top:32px; color:var(--alfred-white); background:var(--alfred-ink); border-color:var(--alfred-ink); } #alfred-site[data-palette] main .am-fee-stage { isolation:auto; padding:0; width:100%; max-width:480px; margin:0 0 0 auto; } #alfred-site[data-palette] main .am-fee-stage::before, #alfred-site[data-palette] main .am-fee-stage::after { display:none; } #alfred-site[data-palette] main .am-fee-card, #alfred-site[data-palette] main .am-fee-card:hover { position:relative; padding:0; min-height:0; aspect-ratio:4 / 4.65; border:0; border-radius:4px; background:#d5bc92; box-shadow:0 18px 40px rgb(54 36 15 / 12%); transform:none!important; overflow:hidden; } #alfred-site[data-palette] main .am-material-image { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 52%; } #alfred-site[data-palette] main .am-fee-content { position:absolute; inset:17% 20% auto; z-index:1; color:#2c1d16; } #alfred-site[data-palette] main .am-fee-topline { font:500 11px/1.4 'DM Sans',Arial,sans-serif; letter-spacing:.12em; } #alfred-site[data-palette] main .am-fee-title { color:#2c1d16; font:500 clamp(24px,2.2vw,33px)/1.15 'DM Sans',Arial,sans-serif; letter-spacing:-.055em; margin:26px 0 0; } #alfred-site[data-palette] main .am-fee-number { display:block; font:700 clamp(96px,10vw,154px)/.91 'Inter',Arial,sans-serif; letter-spacing:-.095em; margin-bottom:16px; } #alfred-site[data-palette] main .am-percent { font-size:.59em; margin-top:.065em; padding-left:.11em; } #alfred-site[data-palette] main .am-stamp { bottom:16%; right:20%; width:42px; height:auto; transform:rotate(-7deg); } #alfred-site[data-palette] main .am-stamp-letter { font-size:57px; } #alfred-site[data-palette] main .am-fee-bottom { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin:0; padding:21px 0 0; border:0; } #alfred-site[data-palette] main .am-fee-bottom::before, #alfred-site[data-palette] main .am-fee-bottom::after { display:none; } #alfred-site[data-palette] main .am-same-day { font:500 14px/1.4 'DM Sans',Arial,sans-serif; margin:0; letter-spacing:-.02em; } #alfred-site[data-palette] main .am-fee-context { font:400 12px/1.5 'DM Sans',Arial,sans-serif; color:var(--alfred-ink); opacity:.85; max-width:230px; margin-top:6px; } #alfred-site[data-palette] main .am-fee-bottom .am-inline-link { font:500 12px/1.5 'DM Sans',Arial,sans-serif; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; white-space:nowrap; margin:0; } #alfred-site[data-palette] main .am-trust { display:grid; grid-template-columns:1.1fr 1fr auto; align-items:center; gap:28px; padding-block:32px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-trust-title { font:400 20px/1.3 Georgia,serif; letter-spacing:-.04em; padding-right:32px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-countries { font-size:14px; } #alfred-site[data-palette] main .am-eligibility { font-size:13px; } .palette-heading { min-height:48px; } .palette-inner { width:88%; max-width:1280px; } .palette-toggle { min-height:32px; } @media(min-width:1440px) { #alfred-site[data-palette] main .am-hero-grid { padding-block:64px; } } @media(max-width:1000px) { #alfred-site[data-palette] .am-nav { gap:19px; } #alfred-site[data-palette] main .am-hero-grid { gap:5%; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); } #alfred-site[data-palette] main .am-title { font-size:clamp(43px,6.5vw,65px); } #alfred-site[data-palette] main .am-fee-number { font-size:clamp(85px,10.1vw,110px); } #alfred-site[data-palette] main .am-fee-title { font-size:24px; margin-top:20px; } #alfred-site[data-palette] main .am-fee-topline { font-size:10px; letter-spacing:.08em; } #alfred-site[data-palette] main .am-fee-bottom { flex-direction:column; gap:13px; padding-top:17px; } #alfred-site[data-palette] main .am-fee-context { max-width:270px; } #alfred-site[data-palette] main .am-trust { grid-template-columns:1fr 1fr; gap:18px; } #alfred-site[data-palette] main .am-trust-title { grid-row:span 2; font-size:21px; } #alfred-site[data-palette] main .am-eligibility { grid-column:2; } } @media(max-width:700px) { #alfred-site[data-palette] .am-wrap,.palette-inner { width:88%; } #alfred-site[data-palette] .am-header-inner { min-height:78px; } #alfred-site[data-palette] .am-header .am-logo { font-size:41px; } #alfred-site[data-palette] main .am-hero-grid { grid-template-columns:1fr; gap:32px; padding-block:32px 36px; } #alfred-site[data-palette] main .am-hero-copy { padding:0; } #alfred-site[data-palette] main .am-title { font-size:clamp(45px,10.5vw,70px); } #alfred-site[data-palette] main .am-subtitle { font-size:23px; line-height:1.3; max-width:430px; margin-top:24px; } #alfred-site[data-palette] main .am-hero-cta { margin-top:24px; } #alfred-site[data-palette] main .am-fee-stage { max-width:480px; margin:0 auto; } #alfred-site[data-palette] main .am-fee-content { top:18%; } #alfred-site[data-palette] main .am-fee-number { font-size:clamp(99px,26vw,140px); margin-bottom:12px; } #alfred-site[data-palette] main .am-fee-title { font-size:clamp(25px,6.6vw,32px); margin-top:20px; } #alfred-site[data-palette] main .am-fee-topline { font-size:11px; } #alfred-site[data-palette] main .am-stamp { right:20%; bottom:15%; width:35px; } #alfred-site[data-palette] main .am-stamp-letter { font-size:50px; } #alfred-site[data-palette] main .am-fee-bottom { flex-direction:row; gap:18px; } #alfred-site[data-palette] main .am-fee-context { max-width:205px; } #alfred-site[data-palette] main .am-fee-bottom .am-inline-link { white-space:normal; max-width:100px; text-align:right; } #alfred-site[data-palette] main .am-trust { grid-template-columns:1fr; gap:14px; padding-block:28px; } #alfred-site[data-palette] main .am-trust-title { grid-row:auto; padding:0; border:0; max-width:300px; } #alfred-site[data-palette] main .am-eligibility { grid-column:1; } .palette-toggle { min-height:44px; } } @media(max-width:360px) { #alfred-site[data-palette] main .am-title { font-size:clamp(37px,10.4vw,43px); } #alfred-site[data-palette] main .am-fee-topline { font-size:10px; } #alfred-site[data-palette] main .am-fee-number { font-size:91px; } #alfred-site[data-palette] main .am-fee-title { font-size:23px; } #alfred-site[data-palette] main .am-fee-bottom { gap:12px; } } #alfred-site[data-palette] .am-menu-toggle { border-radius:5px; } #alfred-site[data-palette="original"] main .am-material-image-solar, #alfred-site[data-palette="solar"] main .am-material-image-original { display:none; } #alfred-site[data-palette="original"] main .am-fee-content, #alfred-site[data-palette="original"] main .am-fee-title { color:#141315; } /* Alfred — studio revision below the hero. Existing copy, type families and prototype semantics are retained. Scoped to both palettes; selectors intentionally outrank earlier theme rules. */ #alfred-site[data-palette] { --studio-paper:var(--am-theme-paper,#fffdfc); --studio-ink:var(--alfred-ink); --studio-muted:var(--am-theme-muted,#55475f); --studio-rule:color-mix(in srgb,var(--alfred-ink) 20%,transparent); --studio-field:var(--am-theme-secondary,#d8c7eb); --studio-field-ink:var(--am-theme-on-secondary,#30213d); --studio-dark-copy:var(--am-theme-on-dark,#f8f3fe); --studio-dark-muted:var(--am-theme-on-dark-muted,#d9cfe3); } #alfred-site[data-palette] main .am-body { padding-block:0 76px; } #alfred-site[data-palette] main .am-trust { padding-block:32px; gap:28px; border-bottom:1px solid var(--studio-rule); } #alfred-site[data-palette] main .am-trust-title { font-size:21px; line-height:1.3; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-countries { font-size:15px; letter-spacing:-.015em; } #alfred-site[data-palette] main .am-eligibility { font-size:14px; } /* Three purposes form one continuous line of business, with no floating tiles. */ #alfred-site[data-palette] main .am-use-cases { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,2.1fr); align-items:center; gap:48px; padding-block:68px; } #alfred-site[data-palette] main .am-use-cases .am-section-title { font-size:clamp(27px,2.6vw,36px); line-height:1.1; max-width:260px; } #alfred-site[data-palette] main .am-cases { margin:0; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; } #alfred-site[data-palette] main .am-case, #alfred-site[data-palette] main .am-case:hover { background:transparent; border:0; border-radius:0; box-shadow:none; transform:none; min-height:88px; padding:0 20px; gap:16px; align-items:flex-start; justify-content:center; flex-direction:column; transition:none; } #alfred-site[data-palette] main .am-case + .am-case { border-left:1px solid var(--studio-rule); } #alfred-site[data-palette] main .am-case svg, #alfred-site[data-palette] main .am-case:nth-child(2) svg, #alfred-site[data-palette] main .am-case:nth-child(3) svg, #alfred-site[data-palette] main .am-case:hover svg { background:transparent; border-radius:0; width:29px; height:29px; padding:0; stroke-width:1.25; transform:none; } #alfred-site[data-palette] main .am-case-label { font-size:16px; font-weight:500; letter-spacing:-.025em; } /* A single split composition: a vivid editorial cover beside four open cells. */ #alfred-site[data-palette] main .am-needs { padding:0; overflow:hidden; background:var(--studio-paper); color:var(--studio-ink); border:1px solid color-mix(in srgb,var(--studio-ink) 10%,transparent); border-radius:8px; box-shadow:0 20px 55px -36px color-mix(in srgb,var(--studio-ink) 45%,transparent); } #alfred-site[data-palette] main .am-needs .am-needs-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.55fr); gap:0; } #alfred-site[data-palette] main .am-needs .am-needs-intro { padding:40px 36px 32px; min-width:0; background:var(--studio-field); color:var(--studio-field-ink); } #alfred-site[data-palette] main .am-needs .am-needs-intro .am-eyebrow { gap:12px; font-size:11px; letter-spacing:.12em; line-height:1.6; } #alfred-site[data-palette] main .am-needs .am-chapter { display:inline; width:auto; height:auto; background:transparent; border:0; border-radius:0; color:inherit; font-size:11px; padding-right:12px; border-right:1px solid currentColor; } #alfred-site[data-palette] main .am-needs .am-section-title { font-size:clamp(58px,6.2vw,84px); line-height:.94; letter-spacing:-.055em; margin-top:35px; font-weight:400; } #alfred-site[data-palette] main .am-needs .am-needs-caption { color:var(--studio-field-ink); font-size:14px; line-height:1.7; max-width:230px; margin-top:28px; } #alfred-site[data-palette] main .am-needs .am-needs-note { padding-top:40px; } #alfred-site[data-palette] main .am-needs .am-badge { display:block; border:0; border-radius:0; padding:0; background:transparent; color:var(--studio-field-ink); font-size:11px; font-weight:600; } #alfred-site[data-palette] main .am-needs .am-needs-note p { font-size:11px; line-height:1.6; color:var(--studio-field-ink); margin-top:3px; } #alfred-site[data-palette] main .am-needs .am-need-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; padding:22px 24px; margin:0; } #alfred-site[data-palette] main .am-needs .am-need-options li { display:flex; position:relative; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:0; min-height:218px; min-width:0; border:0; border-radius:0; padding:24px 25px; background:transparent; box-shadow:none; transform:none; cursor:default; transition:none; } #alfred-site[data-palette] main .am-needs .am-need-options li:nth-child(odd) { border-right:1px solid var(--studio-rule); } #alfred-site[data-palette] main .am-needs .am-need-options li:nth-child(-n+2) { border-bottom:1px solid var(--studio-rule); } #alfred-site[data-palette] main .am-needs .am-option-top { display:block; width:auto; max-width:calc(100% - 22px); color:var(--studio-muted); font-size:11px; font-weight:500; letter-spacing:.09em; line-height:1.6; } #alfred-site[data-palette] main .am-needs .am-choice-mark { display:none; } #alfred-site[data-palette] main .am-needs .am-need-icon, #alfred-site[data-palette] main .am-needs .am-need-options li:nth-child(2) .am-need-icon, #alfred-site[data-palette] main .am-needs .am-need-options li:nth-child(3) .am-need-icon { position:absolute; right:24px; top:22px; width:22px; height:22px; margin:0; border:0; border-radius:0; background:transparent; } #alfred-site[data-palette] main .am-needs .am-need-icon::after { content:none; } #alfred-site[data-palette] main .am-needs .am-need-icon svg { width:22px; height:22px; stroke-width:1.25; } #alfred-site[data-palette] main .am-needs .am-option-name { display:block; margin-top:auto; padding-top:48px; font-size:clamp(21px,2.35vw,30px); font-weight:500; line-height:1.15; letter-spacing:-.045em; max-width:205px; } #alfred-site[data-palette] main .am-needs .am-journey { margin:0; padding:0 36px; border-top:1px solid var(--studio-rule); background:var(--studio-paper); } #alfred-site[data-palette] main .am-needs .am-journey summary { padding-block:20px; color:var(--studio-muted); font-size:13px; font-weight:400; } #alfred-site[data-palette] main .am-needs .am-journey summary > span { border:0; width:22px; height:22px; font-size:24px; color:var(--studio-ink); } #alfred-site[data-palette] main .am-needs .am-question-list { margin-top:0; } #alfred-site[data-palette] main .am-needs .am-question-list li { border-color:var(--studio-rule); padding-block:24px; } #alfred-site[data-palette] main .am-needs .am-question-list p, #alfred-site[data-palette] main .am-needs .am-step, #alfred-site[data-palette] main .am-needs .am-step-tag, #alfred-site[data-palette] main .am-needs .am-journey-note { color:var(--studio-muted); } #alfred-site[data-palette] main .am-needs .am-journey-note { padding-bottom:26px; } /* Experience is a measured typographic interlude, not a giant sales claim. */ #alfred-site[data-palette] main .am-proof { padding-block:64px; gap:56px; } #alfred-site[data-palette] main .am-proof .am-stat { text-align:left; } #alfred-site[data-palette] main .am-proof .am-stat + .am-stat { padding-left:56px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-proof .am-stat strong { font-size:38px; letter-spacing:-.06em; font-weight:600; } #alfred-site[data-palette] main .am-proof .am-stat p { margin-top:8px; color:var(--studio-muted); font-size:12px; } /* Editorial story and a precisely set brand transition, without certificate styling. */ #alfred-site[data-palette] main .am-about { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); column-gap:80px; padding-block:76px 68px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-about .am-about-story { padding:0; } #alfred-site[data-palette] main .am-about h2 { font-size:clamp(36px,4vw,53px); line-height:1.08; letter-spacing:-.045em; margin-block:24px 30px; } #alfred-site[data-palette] main .am-about .am-about-story > p:not(.am-eyebrow) { font-size:16px; line-height:1.8; color:var(--studio-muted); max-width:520px; } #alfred-site[data-palette] main .am-about .am-founders { margin-top:30px; padding-top:22px; border-top:1px solid var(--studio-rule); width:fit-content; min-width:210px; } #alfred-site[data-palette] main .am-about .am-founder-monogram { display:none; } #alfred-site[data-palette] main .am-about .am-founders p { font-size:15px; font-weight:500; } #alfred-site[data-palette] main .am-about .am-founders p > span { font-size:12px; color:var(--studio-muted); } #alfred-site[data-palette] main .am-about .am-heritage { align-self:stretch; display:flex; flex-direction:column; margin:0; padding:34px 36px 28px; border:0; border-radius:8px; background:var(--studio-ink); color:var(--studio-dark-copy); transform:none; box-shadow:none; } #alfred-site[data-palette] main .am-about .am-heritage-top { flex-direction:row; flex-wrap:wrap; align-items:center; gap:10px 16px; } #alfred-site[data-palette] main .am-about .am-heritage-top .am-eyebrow { font-size:11px; letter-spacing:.1em; } #alfred-site[data-palette] main .am-about .am-heritage-year { font-size:11px; color:var(--studio-dark-muted); } #alfred-site[data-palette] main .am-about .am-heritage-name { font-size:26px; font-weight:400; letter-spacing:.16em; margin-top:42px; color:var(--studio-dark-muted); } #alfred-site[data-palette] main .am-about .am-heritage-name > span { font-size:11px; letter-spacing:.23em; margin-top:6px; } #alfred-site[data-palette] main .am-about .am-heritage-line { height:28px; margin:20px 0 15px; border:0; border-left:1px solid color-mix(in srgb,var(--studio-dark-copy) 35%,transparent); } #alfred-site[data-palette] main .am-about .am-heritage-line span { display:none; } #alfred-site[data-palette] main .am-about .am-heritage-alfred { font-size:72px; line-height:1; letter-spacing:-4px; } #alfred-site[data-palette] main .am-about .am-heritage > p { font-size:14px; line-height:1.65; margin-top:22px; color:var(--studio-dark-muted); } #alfred-site[data-palette] main .am-about .am-heritage-foot { margin-top:auto; padding-top:26px; border:0; font-size:11px; letter-spacing:.13em; color:var(--studio-dark-muted); } #alfred-site[data-palette] main .am-about .am-heritage-foot > span:last-child { display:none; } #alfred-site[data-palette] main .am-about .am-values { gap:26px; margin-top:60px; } #alfred-site[data-palette] main .am-about .am-values > div { padding-top:20px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-about .am-values > div > span { font-size:11px; color:var(--studio-muted); } #alfred-site[data-palette] main .am-about .am-values h3 { margin-top:13px; font-size:17px; line-height:1.35; font-weight:500; letter-spacing:-.025em; } #alfred-site[data-palette] main .am-about .am-locations { margin-top:34px; padding-top:26px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-about .am-locations .am-eyebrow { color:var(--studio-muted); font-size:11px; } #alfred-site[data-palette] main .am-about .am-locations p { font-size:17px; letter-spacing:-.025em; } #alfred-site[data-palette] main .am-about .am-locations p > span { color:var(--studio-muted); margin-inline:16px; } /* Generous readable questions, aligned with the story rather than boxed into cards. */ #alfred-site[data-palette] main .am-support { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.45fr); gap:56px; padding-top:66px; border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-support .am-section-intro { flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:20px; margin:0; } #alfred-site[data-palette] main .am-support .am-section-title { font-size:clamp(32px,3.3vw,44px); line-height:1.08; max-width:290px; } #alfred-site[data-palette] main .am-support .am-section-intro .am-eyebrow { color:var(--studio-muted); font-size:11px; } #alfred-site[data-palette] main .am-support .am-faq { border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-support .am-faq details { border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-support .am-faq summary { font-size:17px; padding-block:25px; line-height:1.4; } #alfred-site[data-palette] main .am-support .am-faq summary::after { flex:none; width:22px; text-align:center; } #alfred-site[data-palette] main .am-support .am-faq-answer { font-size:15px; padding-bottom:26px; padding-right:35px; line-height:1.75; color:var(--studio-muted); } #alfred-site[data-palette] main .am-review { margin-top:70px; border:1px solid var(--studio-rule); border-radius:8px; } #alfred-site[data-palette] main .am-review summary { padding:20px 24px; } #alfred-site[data-palette] main .am-review summary .am-eyebrow { font-size:11px; color:var(--studio-muted); } #alfred-site[data-palette] main .am-review #am-review-heading { font-size:16px; } #alfred-site[data-palette] main .am-review .am-review-count { color:var(--studio-muted); font-size:12px; } #alfred-site[data-palette] main .am-review .am-review-grid article { border-color:var(--studio-rule); } #alfred-site[data-palette] main .am-review .am-review-grid article > p:last-child { color:var(--studio-muted); } #alfred-site[data-palette] footer.am-footer { background:var(--studio-ink); color:var(--studio-dark-copy); } #alfred-site[data-palette] footer.am-footer .am-footer-inner { padding-block:42px 32px; gap:24px; } #alfred-site[data-palette] footer.am-footer .am-logo { font-size:48px; } #alfred-site[data-palette] footer.am-footer .am-footer-copy { color:var(--studio-dark-muted); font-size:13px; } #alfred-site[data-palette] footer.am-footer .am-chat-launcher, #alfred-site[data-palette] footer.am-footer .am-replay { border:1px solid color-mix(in srgb,var(--studio-dark-copy) 35%,transparent); border-radius:99px; color:var(--studio-dark-copy); padding:10px 17px; min-height:44px; font-size:12px; } #alfred-site[data-palette] footer.am-footer .am-footer-meta { color:var(--studio-dark-muted); border-top:1px solid color-mix(in srgb,var(--studio-dark-copy) 20%,transparent); padding-block:20px 28px; font-size:11px; } @media(max-width:1000px) { #alfred-site[data-palette] main .am-use-cases { gap:24px; } #alfred-site[data-palette] main .am-case { padding-inline:14px; } #alfred-site[data-palette] main .am-case-label { font-size:15px; } #alfred-site[data-palette] main .am-needs .am-needs-intro { padding:32px 27px; } #alfred-site[data-palette] main .am-needs .am-need-options { padding:16px; } #alfred-site[data-palette] main .am-needs .am-need-options li { padding:22px 20px; min-height:210px; } #alfred-site[data-palette] main .am-needs .am-need-icon { right:18px; } #alfred-site[data-palette] main .am-needs .am-option-top { font-size:11px; letter-spacing:.04em; } #alfred-site[data-palette] main .am-about { column-gap:40px; } #alfred-site[data-palette] main .am-about .am-heritage { padding:30px 28px; } #alfred-site[data-palette] main .am-support { gap:36px; } } @media(max-width:700px) { #alfred-site[data-palette] main .am-body { padding-bottom:48px; } #alfred-site[data-palette] main .am-trust { padding-block:26px; gap:12px; } #alfred-site[data-palette] main .am-trust-title { border:0; font-size:23px; } #alfred-site[data-palette] main .am-use-cases { grid-template-columns:1fr; gap:28px; padding-block:42px; } #alfred-site[data-palette] main .am-use-cases .am-section-title { max-width:none; font-size:30px; } #alfred-site[data-palette] main .am-cases { grid-template-columns:repeat(3,minmax(0,1fr)); } #alfred-site[data-palette] main .am-case { justify-content:flex-start; align-items:flex-start; padding:0 13px; min-height:95px; gap:14px; } #alfred-site[data-palette] main .am-case:first-child { padding-left:0; } #alfred-site[data-palette] main .am-case-label { font-size:14px; line-height:1.35; } #alfred-site[data-palette] main .am-case svg, #alfred-site[data-palette] main .am-case:nth-child(2) svg, #alfred-site[data-palette] main .am-case:nth-child(3) svg, #alfred-site[data-palette] main .am-case:hover svg { width:26px; height:26px; } #alfred-site[data-palette] main .am-needs { border-radius:8px; } #alfred-site[data-palette] main .am-needs .am-needs-layout { grid-template-columns:1fr; } #alfred-site[data-palette] main .am-needs .am-needs-intro { padding:28px 25px; } #alfred-site[data-palette] main .am-needs .am-section-title { font-size:62px; margin-top:23px; max-width:none; } #alfred-site[data-palette] main .am-needs .am-section-title br { display:none; } #alfred-site[data-palette] main .am-needs .am-needs-caption { margin-top:19px; max-width:300px; font-size:14px; } #alfred-site[data-palette] main .am-needs .am-needs-note { padding-top:20px; display:flex; gap:7px 14px; flex-wrap:wrap; align-items:center; } #alfred-site[data-palette] main .am-needs .am-needs-note p { margin:0; } #alfred-site[data-palette] main .am-needs .am-need-options { padding:12px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; } #alfred-site[data-palette] main .am-needs .am-need-options li { display:flex; min-height:179px; padding:19px 15px 23px; } #alfred-site[data-palette] main .am-needs .am-option-top { font-size:11px; max-width:100%; letter-spacing:.035em; } #alfred-site[data-palette] main .am-needs .am-need-icon, #alfred-site[data-palette] main .am-needs .am-need-options li:nth-child(2) .am-need-icon, #alfred-site[data-palette] main .am-needs .am-need-options li:nth-child(3) .am-need-icon { position:static; margin-top:17px; width:22px; height:22px; } #alfred-site[data-palette] main .am-needs .am-need-icon svg { width:22px; height:22px; } #alfred-site[data-palette] main .am-needs .am-option-name { font-size:22px; padding-top:20px; line-height:1.14; } #alfred-site[data-palette] main .am-needs .am-journey { padding-inline:25px; } #alfred-site[data-palette] main .am-needs .am-journey summary { font-size:12px; padding-block:20px; } #alfred-site[data-palette] main .am-proof { padding-block:42px; gap:24px; } #alfred-site[data-palette] main .am-proof .am-stat + .am-stat { padding-left:24px; } #alfred-site[data-palette] main .am-proof .am-stat strong { font-size:29px; } #alfred-site[data-palette] main .am-proof .am-stat p { font-size:11px; line-height:1.5; } #alfred-site[data-palette] main .am-about { grid-template-columns:1fr; gap:0; padding-block:46px; } #alfred-site[data-palette] main .am-about h2 { font-size:39px; margin-block:20px 25px; } #alfred-site[data-palette] main .am-about .am-about-story > p:not(.am-eyebrow) { font-size:15px; line-height:1.75; } #alfred-site[data-palette] main .am-about .am-founders { margin-top:24px; } #alfred-site[data-palette] main .am-about .am-heritage { margin-top:34px; padding:28px; min-height:400px; } #alfred-site[data-palette] main .am-about .am-heritage-name { margin-top:32px; font-size:24px; } #alfred-site[data-palette] main .am-about .am-heritage-alfred { font-size:68px; } #alfred-site[data-palette] main .am-about .am-heritage-foot { padding-top:24px; } #alfred-site[data-palette] main .am-about .am-values { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 23px; margin-top:36px; } #alfred-site[data-palette] main .am-about .am-values h3 { font-size:16px; margin-top:9px; } #alfred-site[data-palette] main .am-about .am-locations { margin-top:30px; padding-top:22px; gap:12px; align-items:flex-start; } #alfred-site[data-palette] main .am-about .am-locations p { font-size:16px; } #alfred-site[data-palette] main .am-about .am-locations p > span { margin-inline:8px; } #alfred-site[data-palette] main .am-support { grid-template-columns:1fr; gap:26px; padding-top:42px; } #alfred-site[data-palette] main .am-support .am-section-title { max-width:none; font-size:36px; } #alfred-site[data-palette] main .am-support .am-section-intro { gap:14px; } #alfred-site[data-palette] main .am-support .am-faq summary { font-size:16px; padding-block:22px; } #alfred-site[data-palette] main .am-support .am-faq-answer { font-size:14px; padding-right:18px; padding-bottom:24px; } #alfred-site[data-palette] main .am-review { margin-top:42px; } #alfred-site[data-palette] main .am-review summary { padding:18px; gap:12px; } #alfred-site[data-palette] main .am-review .am-review-count { gap:10px; } #alfred-site[data-palette] footer.am-footer .am-footer-inner { padding-block:34px 28px; gap:20px; } #alfred-site[data-palette] footer.am-footer .am-logo { font-size:44px; } #alfred-site[data-palette] footer.am-footer .am-footer-copy { margin:0; } #alfred-site[data-palette] footer.am-footer .am-footer-meta { font-size:11px; line-height:1.6; } } @media(max-width:359px) { #alfred-site[data-palette] main .am-needs .am-needs-intro { padding-inline:21px; } #alfred-site[data-palette] main .am-needs .am-section-title { font-size:55px; } #alfred-site[data-palette] main .am-needs .am-need-options { padding:9px; } #alfred-site[data-palette] main .am-needs .am-need-options li { padding-inline:12px; min-height:182px; } #alfred-site[data-palette] main .am-needs .am-option-top { font-size:11px; } #alfred-site[data-palette] main .am-needs .am-option-name { font-size:20px; } #alfred-site[data-palette] main .am-proof { gap:18px; } #alfred-site[data-palette] main .am-proof .am-stat + .am-stat { padding-left:18px; } #alfred-site[data-palette] main .am-proof .am-stat strong { font-size:25px; } #alfred-site[data-palette] main .am-about h2 { font-size:34px; } } #alfred-site[data-palette] main .am-review .am-journey { margin:0 24px 24px; } #alfred-site[data-palette] main .am-review > details > .am-journey-note { margin:0 24px 24px; } #alfred-site[data-palette] main .am-review .am-replay { margin:0 24px 24px; border:1px solid var(--studio-rule); border-radius:5px; background:transparent; padding:12px 18px; color:var(--studio-ink); font:400 13px/1.4 'DM Sans',Arial,sans-serif; } /* Lima solar: material used as a clear financial information surface. */ #alfred-site[data-palette] main .am-hero-descriptor { font:500 12px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; margin:0 0 26px; } #alfred-site[data-palette] main .am-hero-copy { padding-block:20px 32px; } #alfred-site[data-palette] main .am-fee-stage { max-width:480px; } #alfred-site[data-palette] main .am-fee-mount { position:relative; padding:23px; border:1px solid color-mix(in srgb,var(--alfred-ink) 35%,transparent); border-radius:12px; background:var(--alfred-ink); box-shadow:0 25px 45px color-mix(in srgb,var(--alfred-ink) 14%,transparent); } #alfred-site[data-palette] main .am-finance-caption { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:0 1px 20px; color:var(--alfred-white); font:400 11px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:.1em; text-transform:uppercase; } #alfred-site[data-palette] main .am-finance-caption span:last-child { opacity:.8; } #alfred-site[data-palette] main .am-fee-card.am-finance-glass, #alfred-site[data-palette] main .am-fee-card.am-finance-glass:hover { position:relative; aspect-ratio:auto; min-height:0; padding:7px; border-radius:8px; border:1px solid rgb(255 255 255 / 75%); background:linear-gradient(115deg,#e8e0f4 0%,#fff 4%,#b0a5ba 5%,#f4f0f8 7%,#f6f3fa 72%,#c0b7ca 94%,#fff 97%); box-shadow:inset 1px 1px 1px rgb(255 255 255 / 80%),3px 5px 0 rgb(0 0 0 / 15%),0 16px 24px rgb(0 0 0 / 13%); } #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass { background:linear-gradient(115deg,#f2ebbb 0%,#fffbea 4%,#aaaa73 5%,#f2edcf 7%,#f9f2d9 72%,#c0b986 94%,#fffbea 97%); } #alfred-site[data-palette] main .am-finance-glass .am-fee-content { position:relative; inset:auto; padding:30px 28px 20px; color:var(--alfred-ink); background:linear-gradient(125deg,rgb(255 255 255 / 82%),rgb(255 255 255 / 20%) 48%,rgb(255 255 255 / 65%)); border:1px solid rgb(255 255 255 / 75%); border-radius:3px; box-shadow:inset 0 0 28px rgb(255 255 255 / 25%); } #alfred-site[data-palette] main .am-finance-glass .am-fee-topline { font:400 14px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:0; text-transform:none; } #alfred-site[data-palette] main .am-finance-glass .am-fee-title { margin:27px 0 32px; font:400 25px/1.2 'DM Sans',Arial,sans-serif; letter-spacing:-.035em; color:var(--alfred-ink); } #alfred-site[data-palette] main .am-finance-glass .am-fee-number { font:500 clamp(94px,9.4vw,130px)/.85 'Inter',Arial,sans-serif; letter-spacing:-.09em; margin-bottom:18px; } #alfred-site[data-palette] main .am-finance-glass .am-percent { font-size:.6em; padding-left:.13em; vertical-align:top; } #alfred-site[data-palette] main .am-bank-routes { padding-top:22px; border-top:1px solid color-mix(in srgb,var(--alfred-ink) 24%,transparent); } #alfred-site[data-palette] main .am-bank-routes > p { margin:0 0 13px; font:400 12px/1.5 'DM Sans',Arial,sans-serif; } #alfred-site[data-palette] main .am-bank-routes ul { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; list-style:none; padding:0; margin:0; } #alfred-site[data-palette] main .am-bank-routes li { font:600 clamp(15px,1.6vw,21px)/1.3 'Inter',Arial,sans-serif; letter-spacing:-.04em; } #alfred-site[data-palette] main .am-bank-routes li + li { border-left:1px solid color-mix(in srgb,var(--alfred-ink) 22%,transparent); padding-left:18px; } #alfred-site[data-palette] main .am-bank-return { display:flex; align-items:end; justify-content:space-between; gap:15px; margin-top:26px; } #alfred-site[data-palette] main .am-bank-return p { font:400 12px/1.5 'DM Sans',Arial,sans-serif; margin:0 0 4px; } #alfred-site[data-palette] main .am-finance-glass .am-stamp { position:static; inset:auto; width:33px; margin:0; transform:rotate(-7deg); } #alfred-site[data-palette] main .am-finance-glass .am-stamp-letter { font-size:47px; } #alfred-site[data-palette] main .am-finance-footnote { color:var(--alfred-white); font:400 12px/1.5 'DM Sans',Arial,sans-serif; margin:19px 1px 0; opacity:.85; } @media (min-width:701px) and (max-width:1000px) { #alfred-site[data-palette] main .am-hero-grid { gap:4%; } #alfred-site[data-palette] main .am-fee-mount { padding:15px; } #alfred-site[data-palette] main .am-finance-caption { font-size:10px; letter-spacing:.04em; padding-bottom:15px; } #alfred-site[data-palette] main .am-finance-glass .am-fee-content { padding:24px 18px 16px; } #alfred-site[data-palette] main .am-finance-glass .am-fee-number { font-size:88px; } #alfred-site[data-palette] main .am-finance-glass .am-fee-title { font-size:23px; } #alfred-site[data-palette] main .am-bank-routes li + li { padding-left:10px; } } @media(max-width:700px) { #alfred-site[data-palette] main .am-hero-copy { padding:0; } #alfred-site[data-palette] main .am-hero-descriptor { margin-bottom:20px; font-size:11px; } #alfred-site[data-palette] main .am-fee-mount { padding:20px; } #alfred-site[data-palette] main .am-finance-glass .am-fee-content { padding:27px 23px 19px; } #alfred-site[data-palette] main .am-finance-glass .am-fee-number { font-size:110px; } #alfred-site[data-palette] main .am-finance-glass .am-fee-title { margin-block:26px 29px; } #alfred-site[data-palette] main .am-bank-routes li { font-size:18px; } #alfred-site[data-palette] main .am-bank-routes li + li { padding-left:14px; } } @media(max-width:360px) { #alfred-site[data-palette] main .am-fee-mount { padding:15px; } #alfred-site[data-palette] main .am-finance-caption { font-size:10px; letter-spacing:.04em; } #alfred-site[data-palette] main .am-finance-glass .am-fee-content { padding-inline:17px; } #alfred-site[data-palette] main .am-bank-routes li { font-size:15px; } #alfred-site[data-palette] main .am-bank-routes li + li { padding-left:9px; } #alfred-site[data-palette] main .am-finance-footnote { font-size:11px; } } #alfred-site[data-palette] main .am-brief-audit { margin:0 24px 24px; border-block:1px solid var(--studio-rule); } #alfred-site[data-palette] main .am-brief-audit > summary { font:500 14px/1.5 'DM Sans',Arial,sans-serif; padding:21px 0; } #alfred-site[data-palette] main .am-audit-intro { margin:0 0 22px; font:400 13px/1.65 'DM Sans',Arial,sans-serif; color:var(--studio-muted); max-width:700px; } #alfred-site[data-palette] main .am-audit-list article { padding:21px 0; border-top:1px solid var(--studio-rule); } #alfred-site[data-palette] main .am-audit-list article > div { display:flex; justify-content:space-between; align-items:baseline; gap:20px; } #alfred-site[data-palette] main .am-audit-list h3 { font:500 16px/1.5 'DM Sans',Arial,sans-serif; margin:0; } #alfred-site[data-palette] main .am-audit-list h3 span { display:inline-block; min-width:76px; font-size:12px; color:var(--studio-muted); } #alfred-site[data-palette] main .am-audit-list p { font:400 13px/1.7 'DM Sans',Arial,sans-serif; color:var(--studio-muted); margin:10px 0 0; max-width:800px; } #alfred-site[data-palette] main .am-audit-status { font:500 12px/1.5 'DM Sans',Arial,sans-serif; text-align:right; flex-shrink:0; } @media(max-width:600px) { #alfred-site[data-palette] main .am-brief-audit { margin-inline:18px; } #alfred-site[data-palette] main .am-audit-list article > div { display:block; } #alfred-site[data-palette] main .am-audit-list h3 span { display:block; } #alfred-site[data-palette] main .am-audit-status { display:block; text-align:left; margin-top:6px; } } /* Alfred — a service directory, with custom financial stationery illustrations. Static descriptions only. Append after studio-rest.css in the visual bundle. */ #alfred-site[data-palette] main .am-needs.am-service-directory { --service-orange:var(--am-theme-secondary,#d8c7eb); --service-lime:var(--am-theme-hero,#ff4439); --service-paper:var(--am-theme-paper,#fffdfc); --service-sheet:#fffdf7; --service-shadow:color-mix(in srgb,var(--alfred-ink) 10%,transparent); --service-rule:color-mix(in srgb,var(--alfred-ink) 19%,transparent); overflow:hidden; padding:0; border:1px solid var(--service-rule); border-radius:5px; background:var(--service-paper); color:var(--alfred-ink); box-shadow:none; } #alfred-site[data-palette] main .am-service-directory .am-needs-layout { display:block; padding:0; } #alfred-site[data-palette] main .am-service-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:32px; padding:39px 43px 37px; border-bottom:1px solid var(--service-rule); background:var(--service-orange); } #alfred-site[data-palette] main .am-service-kicker { display:flex; align-items:center; gap:12px; margin:0 0 17px; font:500 12px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:.1em; text-transform:uppercase; } #alfred-site[data-palette] main .am-service-kicker > span { padding-right:12px; border-right:1px solid color-mix(in srgb,var(--alfred-ink) 40%,transparent); letter-spacing:0; } #alfred-site[data-palette] main .am-service-title { margin:0; font:400 clamp(50px,5.8vw,82px)/1 Georgia,'Times New Roman',serif; letter-spacing:-.055em; } #alfred-site[data-palette] main .am-service-title em { font-weight:400; } #alfred-site[data-palette] main .am-service-intro { margin:0 0 2px; font:400 17px/1.55 'DM Sans',Arial,sans-serif; letter-spacing:-.02em; } #alfred-site[data-palette] main .am-service-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); list-style:none; margin:0; padding:0; } #alfred-site[data-palette] main .am-service-item { display:grid; grid-template-columns:minmax(0,1fr) minmax(115px,.72fr); gap:15px; min-width:0; min-height:244px; padding:33px 26px 33px 35px; border:0; background:transparent; position:relative; } #alfred-site[data-palette] main .am-service-item:nth-child(odd) { border-right:1px solid var(--service-rule); } #alfred-site[data-palette] main .am-service-item:nth-child(-n+2) { border-bottom:1px solid var(--service-rule); } #alfred-site[data-palette] main .am-service-content { display:flex; flex-direction:column; min-width:0; position:relative; z-index:1; } #alfred-site[data-palette] main .am-service-category { display:flex; align-items:baseline; gap:13px; margin:0 0 28px; color:var(--studio-muted); font:500 12px/1.5 'DM Sans',Arial,sans-serif; letter-spacing:.06em; text-transform:uppercase; } #alfred-site[data-palette] main .am-service-category > span { letter-spacing:0; font-variant-numeric:tabular-nums; } #alfred-site[data-palette] main .am-service-item h3 { margin:0; max-width:215px; font:500 clamp(24px,2.25vw,31px)/1.12 'Inter',Arial,sans-serif; letter-spacing:-.045em; } #alfred-site[data-palette] main .am-service-description { margin:14px 0 0; font:400 14px/1.55 'DM Sans',Arial,sans-serif; color:var(--studio-muted); letter-spacing:-.005em; max-width:230px; } #alfred-site[data-palette] main .am-service-art { min-width:0; align-self:center; position:relative; transform:translateY(9px); } #alfred-site[data-palette] main .am-service-art svg { display:block; width:100%; height:auto; overflow:visible; } #alfred-site[data-palette] main .am-service-svg-shadow { fill:var(--service-shadow); } #alfred-site[data-palette] main .am-service-svg-paper { fill:var(--service-sheet); stroke:color-mix(in srgb,var(--alfred-ink) 30%,var(--service-sheet)); stroke-width:1; } #alfred-site[data-palette] main .am-service-svg-back { fill:color-mix(in srgb,var(--alfred-ink) 10%,var(--service-paper)); stroke:color-mix(in srgb,var(--alfred-ink) 28%,var(--service-paper)); stroke-width:1; } #alfred-site[data-palette] main .am-service-svg-orange { fill:var(--service-orange); stroke:color-mix(in srgb,var(--alfred-ink) 35%,var(--service-orange)); stroke-width:1; } #alfred-site[data-palette] main .am-service-svg-lime { fill:var(--service-lime); stroke:color-mix(in srgb,var(--alfred-ink) 24%,var(--service-lime)); stroke-width:1; } #alfred-site[data-palette] main .am-service-svg-line { stroke:color-mix(in srgb,var(--alfred-ink) 52%,var(--service-sheet)); stroke-width:2; stroke-linecap:round; } #alfred-site[data-palette] main .am-service-svg-rule { stroke:color-mix(in srgb,var(--alfred-ink) 21%,var(--service-sheet)); stroke-width:1; } #alfred-site[data-palette] main .am-service-svg-outline { stroke:var(--alfred-ink); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } #alfred-site[data-palette] main .am-service-svg-ring { stroke:color-mix(in srgb,var(--alfred-ink) 45%,transparent); stroke-width:1; } #alfred-site[data-palette] main .am-service-svg-fold { fill:color-mix(in srgb,var(--alfred-ink) 6%,var(--service-sheet)); stroke:color-mix(in srgb,var(--alfred-ink) 28%,var(--service-sheet)); stroke-width:1; } #alfred-site[data-palette] main .am-service-footer { display:flex; justify-content:space-between; align-items:center; gap:25px; padding:21px 35px; border-top:1px solid var(--service-rule); background:color-mix(in srgb,var(--service-paper) 72%,var(--am-theme-body,#e8e0f4)); } #alfred-site[data-palette] main .am-service-footer > p { margin:0; font:400 13px/1.5 'DM Sans',Arial,sans-serif; } #alfred-site[data-palette] main .am-service-rails { display:flex; gap:22px; font-weight:600!important; letter-spacing:.08em; } @media(max-width:1050px) { #alfred-site[data-palette] main .am-service-heading { padding:32px; } #alfred-site[data-palette] main .am-service-item { padding:28px 20px 28px 27px; gap:4px; grid-template-columns:minmax(0,1fr) 111px; } #alfred-site[data-palette] main .am-service-category { font-size:12px; gap:9px; letter-spacing:.025em; } #alfred-site[data-palette] main .am-service-item h3 { font-size:25px; } #alfred-site[data-palette] main .am-service-description { font-size:13px; } #alfred-site[data-palette] main .am-service-desktop-break { display:none; } #alfred-site[data-palette] main .am-service-footer { padding-inline:27px; } } @media(max-width:800px) and (min-width:601px) { #alfred-site[data-palette] main .am-service-item { grid-template-columns:minmax(0,1fr); padding:25px; min-height:300px; } #alfred-site[data-palette] main .am-service-category { margin-bottom:84px; } #alfred-site[data-palette] main .am-service-art { position:absolute; right:20px; top:21px; width:110px; transform:none; } #alfred-site[data-palette] main .am-service-category { max-width:122px; } #alfred-site[data-palette] main .am-service-item h3 { max-width:none; } #alfred-site[data-palette] main .am-service-description { max-width:245px; } #alfred-site[data-palette] main .am-service-intro { font-size:15px; } } @media(max-width:600px) { #alfred-site[data-palette] main .am-service-heading { padding:27px 25px 25px; display:block; } #alfred-site[data-palette] main .am-service-kicker { margin-bottom:19px; } #alfred-site[data-palette] main .am-service-title { font-size:54px; } #alfred-site[data-palette] main .am-service-intro { margin-top:18px; font-size:15px; } #alfred-site[data-palette] main .am-service-intro br { display:none; } #alfred-site[data-palette] main .am-service-list { grid-template-columns:1fr; } #alfred-site[data-palette] main .am-service-item { min-height:215px; grid-template-columns:minmax(0,1fr) 112px; gap:10px; padding:27px 18px 27px 25px; } #alfred-site[data-palette] main .am-service-item:nth-child(odd) { border-right:0; } #alfred-site[data-palette] main .am-service-item:not(:last-child) { border-bottom:1px solid var(--service-rule); } #alfred-site[data-palette] main .am-service-category { margin-bottom:23px; font-size:12px; } #alfred-site[data-palette] main .am-service-item h3 { font-size:25px; } #alfred-site[data-palette] main .am-service-description { font-size:13px; margin-top:11px; } #alfred-site[data-palette] main .am-service-art { transform:translateY(6px); } #alfred-site[data-palette] main .am-service-footer { align-items:flex-start; gap:15px; flex-direction:column; padding:21px 25px; } #alfred-site[data-palette] main .am-service-footer > p { font-size:12px; } } @media(max-width:360px) { #alfred-site[data-palette] main .am-service-heading { padding-inline:20px; } #alfred-site[data-palette] main .am-service-title { font-size:46px; } #alfred-site[data-palette] main .am-service-item { grid-template-columns:minmax(0,1fr) 91px; padding-inline:20px 10px; gap:5px; } #alfred-site[data-palette] main .am-service-item h3 { font-size:23px; } #alfred-site[data-palette] main .am-service-category { gap:7px; letter-spacing:0; } #alfred-site[data-palette] main .am-service-footer { padding-inline:20px; } } /* White masthead: the Alfred wordmark and one quiet navigation control. */ #alfred-site[data-palette] .am-header { position:relative; z-index:20; background:#fff; color:#211d1a; border:0; } #alfred-site[data-palette] .am-header-inner { min-height:96px; position:relative; flex-wrap:nowrap; gap:24px; } #alfred-site[data-palette] .am-header .am-logo { color:#f68b42; font-size:52px; letter-spacing:-2.6px; padding-block:9px; } #alfred-site[data-palette] .am-header .am-logo small { font-size:11px; margin-left:5px; } #alfred-site[data-palette] .am-header .am-menu-toggle { display:inline-flex; flex:none; align-items:center; justify-content:center; width:48px; height:48px; min-height:48px; padding:10px; gap:0; border:0; border-radius:50%; color:#211d1a; background:transparent; cursor:pointer; } #alfred-site[data-palette] .am-header .am-menu-toggle:hover, #alfred-site[data-palette] .am-header .am-menu-toggle[aria-expanded="true"] { background:#f3f3f1; } #alfred-site[data-palette] .am-header .am-menu-dots { fill:currentColor; } #alfred-site[data-palette] .am-header .am-menu-close { display:none; } #alfred-site[data-palette] .am-header .am-menu-toggle[aria-expanded="true"] .am-menu-dots { display:none; } #alfred-site[data-palette] .am-header .am-menu-toggle[aria-expanded="true"] .am-menu-close { display:block; } #alfred-site[data-palette] .am-header .am-nav { position:absolute; top:calc(100% - 7px); right:0; width:288px; max-width:100%; padding:16px 24px 24px; margin:0; display:flex; flex-direction:column; flex-wrap:nowrap; align-items:stretch; gap:0; background:#fff; color:#211d1a; border:1px solid #e8e6e3; border-radius:6px; box-shadow:0 18px 34px rgb(35 29 24 / 12%); } #alfred-site[data-palette] .am-header .am-nav[hidden] { display:none; } #alfred-site[data-palette] .am-header .am-nav .am-nav-link { display:block; padding:16px 0; min-height:48px; font:400 17px/1.35 'DM Sans',Arial,sans-serif; border-bottom:1px solid #eceae7; } #alfred-site[data-palette] .am-header .am-nav-link::after { content:none; } #alfred-site[data-palette] .am-header .am-nav-link:hover { color:#694a37; } #alfred-site[data-palette] .am-header .am-nav .am-pill { width:100%; margin-top:20px; color:#fff; background:#442b22; border-color:#442b22; font-size:14px; } #alfred-site[data-palette] [id] { scroll-margin-top:20px; } #alfred-site[data-palette] main .palette-lab { position:static; z-index:auto; margin:0 24px 26px; background:transparent; color:var(--alfred-ink); box-shadow:none; border-block:1px solid var(--studio-rule); } #alfred-site[data-palette] main .palette-inner { width:100%; max-width:none; } #alfred-site[data-palette] main .palette-heading { padding-block:16px; min-height:0; } #alfred-site[data-palette] main .palette-description { margin-bottom:0; } #alfred-site[data-palette] .am-footer-meta { display:flex; justify-content:space-between; align-items:baseline; gap:16px 30px; flex-wrap:wrap; } #alfred-site[data-palette] .am-review-link { color:inherit; text-decoration:underline; text-underline-offset:4px; } @media(max-width:700px) { #alfred-site[data-palette] .am-header-inner { min-height:84px; } #alfred-site[data-palette] .am-header .am-logo { font-size:46px; letter-spacing:-2.3px; } #alfred-site[data-palette] .am-header .am-nav { width:100%; top:calc(100% - 2px); } #alfred-site[data-palette] main .palette-lab { margin-inline:18px; } } /* ================================================ Visual upgrade: hero mesh gradient (improvement 1) Slow-drifting radial gradient behind hero content. ================================================ */ #alfred-site[data-palette] main .am-hero { position:relative; overflow:hidden; } #alfred-site[data-palette] main .am-hero::before { content:''; position:absolute; inset:0; width:100%; height:100%; background: radial-gradient(ellipse at 20% 35%, #CEDD4A 0%, transparent 52%), radial-gradient(ellipse at 78% 28%, #F68B42 0%, transparent 48%), radial-gradient(ellipse at 54% 88%, #EFE4D2 0%, transparent 50%); opacity:0.35; z-index:0; pointer-events:none; animation:am-hero-mesh 13s ease-in-out infinite alternate; transform-origin:center center; } #alfred-site[data-palette] main .am-hero-grid { position:relative; z-index:1; } @keyframes am-hero-mesh { 0% { transform:scale(1) translate(0%, 0%); } 50% { transform:scale(1.06) translate(4%, 2%); } 100% { transform:scale(1.03) translate(-3%, 4%); } } @media(prefers-reduced-motion:reduce) { #alfred-site[data-palette] main .am-hero::before { animation:none !important; } } /* ================================================ Visual upgrade: bigger, more aggressive headline (improvement 2) ================================================ */ #alfred-site[data-palette] main .am-title { font-size:clamp(3.2rem, 7.5vw, 6.5rem); } #alfred-site[data-palette] main .am-hero-grid { padding-block:38px; } /* ================================================ Visual upgrade: heavier fee card (improvement 3) ================================================ */ #alfred-site[data-palette] main .am-fee-card.am-finance-glass, #alfred-site[data-palette] main .am-fee-card.am-finance-glass:hover { box-shadow: inset 1px 1px 1px rgb(255 255 255 / 80%), 3px 5px 0 rgb(0 0 0 / 15%), 0 24px 60px rgba(68, 43, 34, 0.18), 0 4px 16px rgba(68, 43, 34, 0.10); border:1px solid rgba(206, 221, 74, 0.25); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); } /* ================================================ Visual upgrade: trust stats bar (improvement 4) ================================================ */ #alfred-site .am-stats-row { display:flex; justify-content:center; align-items:center; gap:56px; padding:32px 0; border-bottom:1px solid color-mix(in srgb, var(--alfred-ink) 12%, transparent); } #alfred-site .am-stat-item { display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; } #alfred-site .am-stat-item strong { display:block; font:700 2.5rem/1 'Inter',Arial,sans-serif; letter-spacing:-.05em; color:#442B22; } #alfred-site .am-stat-item span { display:block; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:rgba(68, 43, 34, 0.55); } @media(max-width:700px) { #alfred-site .am-stats-row { gap:20px 36px; padding:24px 0; flex-wrap:wrap; justify-content:center; } #alfred-site .am-stat-item strong { font-size:2rem; } } @media(max-width:360px) { #alfred-site .am-stats-row { gap:16px 28px; } #alfred-site .am-stat-item strong { font-size:1.75rem; } } /* Visual upgrade: transparent header */ #alfred-site[data-palette] .am-header { background: transparent; box-shadow: none; border-bottom: none; position: relative; z-index: 10; } #alfred-site[data-palette] .am-header .am-menu-toggle { color: #442B22; } #alfred-site[data-palette] .am-header .am-menu-toggle:hover, #alfred-site[data-palette] .am-header .am-menu-toggle[aria-expanded="true"] { background: rgba(68,43,34,0.08); } /* Visual upgrade: price tag fee card — v21 */ /* --- Card body: realistic hanging tag shape --- */ #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass, #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass:hover { position: relative; aspect-ratio: auto; min-height: 0; padding: 2.5rem 2rem 2rem; border: none; border-radius: 10px; background: linear-gradient(160deg, #3d2519 0%, #442B22 45%, #3a2418 100%); color: #FFFAF0; transform: rotate(-3deg) !important; box-shadow: 8px 14px 40px rgba(20,10,5,0.45), 2px 4px 10px rgba(20,10,5,0.25), inset 0 1px 0 rgba(255,255,255,0.06); overflow: visible; backdrop-filter: none; -webkit-backdrop-filter: none; margin-top: 50px; /* V-notch at top center — like a real price tag */ clip-path: polygon(0% 0%, 44% 0%, 50% 7%, 56% 0%, 100% 0%, 100% 100%, 0% 100%); } /* --- Punched hole: sits at the notch point --- */ #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%) translateY(-40%); width: 20px; height: 20px; border-radius: 50%; background: #1a0e08; box-shadow: 0 0 0 4px #3d2519, 0 0 0 6px rgba(206,221,74,0.5); z-index: 3; } /* --- String/cord going upward from the tag --- */ #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass::after { content: ''; position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 2px; height: 55px; background: linear-gradient(to bottom, transparent 0%, rgba(255,250,240,0.6) 30%, rgba(255,250,240,0.4) 100%); z-index: 2; } /* --- Inner content area --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-fee-content { position: relative; inset: auto; background: transparent; border: none; box-shadow: none; padding: 10px 4px 4px; color: #FFFAF0; } /* --- Topline label --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-fee-topline { color: rgba(255,250,240,0.55); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; } /* --- Fee title line (e.g. "service fee.") --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-fee-title { color: rgba(255,250,240,0.8); font-size: 1.1rem; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-fee-title span:last-child { color: rgba(255,250,240,0.6); } /* --- Big "1" number --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-fee-number { color: #CEDD4A; font-size: clamp(4rem, 9vw, 6rem); margin-bottom: 14px; } /* --- "%" symbol --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-percent { color: #F68B42; } /* --- Divider above bank routes --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-routes { border-top-color: rgba(255,250,240,0.12); } /* --- "Bank to crypto, too." subtext --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-routes > p { color: rgba(255,250,240,0.6); } /* --- ACH, IBAN, SWIFT items --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-routes li { color: #FFFAF0; font-size: 0.85rem; letter-spacing: 0.05em; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-routes li + li { border-left-color: rgba(255,250,240,0.2); } /* --- Bank return subtext --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-return p { color: rgba(255,250,240,0.7); } /* --- Stamp element --- */ #alfred-site[data-palette="solar"] main .am-finance-glass .am-stamp { color: #CEDD4A; border-color: #CEDD4A; } /* --- Caption above card: "ALFRED EXCHANGE / CRYPTO / BANK" --- */ #alfred-site[data-palette="solar"] main .am-finance-caption { color: rgba(255,250,240,0.5); letter-spacing: 0.1em; font-size: 0.65rem; opacity: 1; } #alfred-site[data-palette="solar"] main .am-finance-caption span:last-child { opacity: 1; } /* --- Fee bottom: "Same-day options" block (sits on lima background) --- */ #alfred-site[data-palette="solar"] main .am-fee-bottom .am-same-day { color: #CEDD4A; font-weight: 700; font-size: 1rem; letter-spacing: 0.03em; } #alfred-site[data-palette="solar"] main .am-fee-bottom .am-fee-context { color: rgba(255,250,240,0.65); font-size: 0.8rem; } #alfred-site[data-palette="solar"] main .am-fee-bottom .am-inline-link { color: #F68B42; font-weight: 600; text-decoration: underline; text-decoration-color: #F68B42; } /* --- Footnote below card: "For your team..." --- */ #alfred-site[data-palette="solar"] main .am-finance-footnote { color: rgba(255,250,240,0.5); font-size: 0.75rem; } /* Visual upgrade: force light text on dark fee card (v22 fix) */ #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass, #alfred-site[data-palette="solar"] main .am-fee-card.am-finance-glass * { color: #FFFAF0; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-fee-number { color: #CEDD4A !important; font-size: clamp(4rem, 9vw, 6rem) !important; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-percent { color: #F68B42 !important; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-routes { border-top-color: rgba(255,250,240,0.15) !important; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-bank-routes li + li { border-left-color: rgba(255,250,240,0.15) !important; } #alfred-site[data-palette="solar"] main .am-finance-glass .am-stamp-letter { color: #CEDD4A !important; } /* Same-day options — boost visibility */ #alfred-site[data-palette="solar"] .am-same-day { color: #CEDD4A !important; font-weight: 700 !important; font-size: 1rem !important; } #alfred-site[data-palette="solar"] .am-fee-context { color: rgba(255,250,240,0.7) !important; } #alfred-site[data-palette="solar"] .am-fee-bottom .am-inline-link { color: #F68B42 !important; text-decoration: underline !important; } /* Visual upgrade: fix same-day text visibility on lime background (v23) */ #alfred-site[data-palette="solar"] .am-same-day { color: #442B22 !important; font-weight: 700 !important; font-size: 1.05rem !important; } #alfred-site[data-palette="solar"] .am-fee-context { color: #694A37 !important; font-size: 0.85rem !important; } #alfred-site[data-palette="solar"] .am-fee-bottom .am-inline-link { color: #442B22 !important; font-weight: 600 !important; text-decoration: underline !important; } #alfred-site[data-palette="solar"] .am-finance-footnote { color: #694A37 !important; } /* Visual upgrade: price tag card (v24) */ #alfred-site .am-fee-card.am-tag-card { position: relative; background: none; border: none; box-shadow: none; padding: 0; backdrop-filter: none; overflow: visible; display: flex; align-items: center; justify-content: center; } #alfred-site .am-tag-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 16px; z-index: 0; pointer-events: none; display: block; } #alfred-site .am-fee-card.am-tag-card .am-fee-content { position: relative; z-index: 1; padding: 56px 28px 28px; width: 100%; } #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-fee-topline, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-fee-title, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-fee-number, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-percent, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-fee-title span, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-bank-routes, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-bank-routes p, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-bank-routes li, #alfred-site[data-palette="solar"] .am-fee-card.am-tag-card .am-bank-return p { color: #442B22 !important; } /* Hanging tag — single baked cutout PNG, transparent background (v33). */ #alfred-site .am-tag-mount { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; } #alfred-site .am-tag-mount .am-finance-caption, #alfred-site .am-tag-mount .am-finance-footnote { display: none !important; } #alfred-site .am-fee-card.am-tag-card { position: relative !important; background: none !important; border: none !important; box-shadow: none !important; transform: rotate(-1deg) !important; padding: 0 !important; min-height: 0 !important; overflow: visible !important; display: flex !important; justify-content: center !important; } #alfred-site .am-tag-bg { position: relative !important; width: 108% !important; max-width: none !important; height: auto !important; object-fit: contain !important; display: block !important; border-radius: 0 !important; inset: auto !important; z-index: 1 !important; filter: drop-shadow(0 18px 34px rgba(68,43,34,0.22)) !important; mix-blend-mode: normal !important; } @media (max-width: 700px) { #alfred-site .am-tag-bg { width: 92% !important; max-width: 340px !important; } #alfred-site .am-fee-card.am-tag-card { transform: rotate(-0.5deg) !important; } } @media (max-width: 400px) { #alfred-site .am-tag-bg { width: 88% !important; max-width: 290px !important; } } /* ── Y ↔ $ flip animation in hero heading ── */ #alfred-site .am-flip-wrap { display: inline-block !important; position: relative; overflow: visible; vertical-align: bottom; } #alfred-site .am-flip-y { display: inline-block !important; vertical-align: bottom; } #alfred-site .am-flip-dollar { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: visible; color: #442b22; -webkit-text-fill-color: #442b22; } #alfred-site .am-dollar-img { display: none !important; } @keyframes am-flip-to-dollar { 0%, 42% { opacity: 1; transform: translateY(0); } 50%, 92% { opacity: 0; transform: translateY(-110%); } 100% { opacity: 1; transform: translateY(0); } } @keyframes am-flip-from-dollar { 0%, 42% { opacity: 0; transform: translateY(110%); } 50%, 92% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(110%); } } #alfred-site .am-flip-y { animation: none !important; opacity: 1 !important; } #alfred-site .am-flip-dollar { display: none !important; } @media (prefers-reduced-motion: reduce) { #alfred-site .am-flip-y, #alfred-site .am-flip-dollar { animation: none; } #alfred-site .am-flip-dollar { display: none; } } /* ── Sequential word loop: ACH then IBAN then SWIFT, side by side, opacity only ── */ #alfred-site .am-word-loop { display: inline !important; opacity: 0; animation: am-word-loop 1.5s linear infinite; animation-delay: calc(var(--wl, 0) * 0.5s); } @keyframes am-word-loop { 0% { opacity: 0; } 1% { opacity: 1; } 33% { opacity: 1; } 34% { opacity: 0; } 100% { opacity: 0; } } @media (prefers-reduced-motion: reduce) { #alfred-site .am-word-loop { animation: none; opacity: 1; } } /* ── Mobile: center button + tag, no gap, rope connector ── */ @media (max-width: 700px) { #alfred-site .am-hero-grid { gap: 0 !important; } #alfred-site .am-hero-cta { display: block !important; text-align: center !important; margin-inline: auto !important; } #alfred-site .am-fee-stage { display: flex !important; flex-direction: column !important; align-items: center !important; padding-top: 0 !important; margin-top: 0 !important; } #alfred-site .am-tag-mount { position: relative; width: 100%; display: flex !important; flex-direction: column !important; align-items: center !important; } #alfred-site .am-tag-mount::before { display: none !important; } } /* ── no-break wrapper for Y/$ animation ── */ #alfred-site .am-nowrap { display: inline !important; white-space: nowrap !important; } /* ── Tag card: CSS crystalline "a" overlay ── */ #alfred-site .am-tag-card { position: relative; } #alfred-site .am-tag-a { position: absolute; bottom: 11%; left: 50%; transform: translateX(-50%) rotate(-6deg); z-index: 3 !important; font: 600 168px/.85 'Bodoni Moda', Georgia, serif; letter-spacing: -6px; background: linear-gradient(118deg, #3f6212 0%, #84cc16 18%, #d9f99d 32%, #fde68a 46%, #fb923c 62%, #ea580c 78%, #9a3412 100% ); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 6px 14px rgba(120, 45, 0, 0.45)) drop-shadow(0 2px 3px rgba(255,200,80,0.25)); pointer-events: none; display: block; line-height: 1; } @media (max-width: 700px) { #alfred-site .am-tag-a { font-size: 120px; bottom: 9%; } } /* ── Header bar: black — clean contrast with lime hero ── */ #alfred-site .am-header { background: #000000 !important; border: 0 !important; border-bottom: 0 !important; box-shadow: none !important; outline: 0 !important; } #alfred-site .am-header::after, #alfred-site .am-header::before { display: none !important; } #alfred-site .am-hero { background: linear-gradient(to bottom, #d8e858 0%, #cedd4a 12%, #cedd4a 78%, #caca38 91%, #bfb622 100%) !important; } #alfred-site .am-header .am-logo { color: #f5f0e8 !important; font-size: 32px !important; letter-spacing: -1.6px !important; } #alfred-site .am-header .am-menu-toggle { color: #f5f0e8 !important; } #alfred-site .am-header .am-menu-dots { fill: #f5f0e8 !important; } /* ── Tag rope connector CSS removed (rope is in the PNG) ── */ #alfred-site .am-tag-card::before { display: none !important; } /* ── Kill orange mesh blob overlay — pure lime hero ── */ #alfred-site main .am-hero::before { display: none !important; } /* ── Hide duplicate footer below tag (same info is on the tag itself) ── */ #alfred-site .am-fee-bottom { display: none !important; } /* ── Tag HTML overlay: text directly on clean PNG (no background rect) ── */ #alfred-site[data-palette] main .am-fee-card.am-tag-card { container-type: inline-size; } #alfred-site .am-tag-html { position: absolute; inset: 0; pointer-events: none; z-index: 2 !important; } #alfred-site .am-tag-a { display: none !important; } /* Positions are % of the full RGBA image height (rope=~18%, paper face=18%-92%) */ #alfred-site .am-tag-pct { position: absolute; top: 28%; left: 0; right: 0; text-align: center; font: 800 clamp(52px,18cqi,90px)/1 'DM Sans',Arial,sans-serif; color: #1a120a; letter-spacing: -0.04em; margin: 0; } #alfred-site .am-tag-svc { position: absolute; top: 44%; left: 0; right: 0; text-align: center; font: 500 clamp(12px,3.8cqi,21px)/1.3 'DM Sans',Arial,sans-serif; color: #3a2a1a; margin: 0; } #alfred-site .am-tag-divider { position: absolute; top: 53%; left: 12%; right: 12%; border: none; border-top: 1px solid #b8a888; margin: 0; } #alfred-site .am-tag-footer { position: absolute; top: 57%; left: 10%; right: 10%; display: flex; flex-direction: column; align-items: center; gap: clamp(3px,1.2cqi,7px); } #alfred-site .am-tag-sd { font: 700 clamp(11px,3.2cqi,18px)/1.2 'DM Sans',Arial,sans-serif; color: #1a120a; text-align: center; } #alfred-site .am-tag-ca { font: 400 clamp(10px,2.8cqi,15px)/1.3 'DM Sans',Arial,sans-serif; color: #1a120a; text-decoration: underline; text-underline-offset: 3px; text-align: center; } /* ══ TAG CARD CLEAN REBUILD v96 — #am-fees ID beats all palette class rules ══ */ /* Fee stage: pull up to nav boundary by negating hero grid's 48px top padding */ #alfred-site .am-fee-stage { padding-top: 0 !important; margin-top: -48px !important; align-self: flex-start !important; justify-content: flex-start !important; } #alfred-site #am-fees { position: relative !important; background: none !important; border: none !important; box-shadow: none !important; transform: rotate(-1deg) !important; padding: 0 !important; min-height: 0 !important; overflow: visible !important; display: block !important; aspect-ratio: unset !important; width: 420px !important; margin: 0 auto !important; container-type: inline-size !important; } #alfred-site #am-fees .am-tag-bg { position: relative !important; width: 420px !important; max-width: 420px !important; height: auto !important; display: block !important; border-radius: 0 !important; object-fit: contain !important; inset: auto !important; filter: drop-shadow(0 6px 10px rgba(68,43,34,0.30)) drop-shadow(0 22px 44px rgba(68,43,34,0.20)) !important; } #alfred-site #am-fees .am-tag-html { position: absolute !important; inset: 0 !important; pointer-events: none !important; z-index: 2 !important; } #alfred-site #am-fees .am-tag-a { display: none !important; } #alfred-site #am-fees .am-tag-block { position: absolute; top: 43%; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; gap: clamp(2px,0.8cqi,6px); } #alfred-site #am-fees .am-tag-pct { position: static; text-align: center; font: 800 clamp(72px,26cqi,140px)/1 'DM Sans',Arial,sans-serif; letter-spacing: -0.04em; margin: 0; color: transparent; background: linear-gradient(105deg,#1a120a 0%,#1a120a 25%,#b8a080 38%,#fffaf0 50%,#b8a080 62%,#1a120a 75%,#1a120a 100%); background-size: 280% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: am-tag-glint 5s ease-in-out infinite; } #alfred-site #am-fees .am-tag-svc { position: static; text-align: center; font: 700 clamp(18px,5.5cqi,30px)/1.1 'DM Sans',Arial,sans-serif; margin: 0; letter-spacing: 0.01em; color: transparent; background: linear-gradient(105deg,#3a2a1a 0%,#3a2a1a 28%,#c0a888 40%,#fffaf0 50%,#c0a888 60%,#3a2a1a 72%,#3a2a1a 100%); background-size: 260% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: am-tag-glint 5s ease-in-out 0.8s infinite; } #alfred-site #am-fees .am-tag-divider { display: none !important; } #alfred-site .am-hero-descriptor { display: none !important; } #alfred-site #am-fees .am-tag-footer { position: absolute; top: 76%; left: 8%; right: 8%; display: flex; flex-direction: column; align-items: center; gap: clamp(6px,2.2cqi,13px); } #alfred-site #am-fees .am-tag-sd { font: 700 clamp(13px,3.8cqi,20px)/1.2 'DM Sans',Arial,sans-serif; color: transparent; background: linear-gradient(105deg,#1a120a 0%,#1a120a 28%,#c0a888 40%,#fffaf0 50%,#c0a888 60%,#1a120a 72%,#1a120a 100%); background-size: 260% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: am-tag-glint 4.5s ease-in-out 1.6s infinite; text-align: center; } @keyframes am-tag-glint { 0%,25%{ background-position:160% center; } 65%,100%{ background-position:-160% center; } } @keyframes am-tag-drop { 0%{ transform:translateY(-260px) rotate(-4deg); opacity:0; } 58%{ transform:translateY(16px) rotate(1deg); opacity:1; } 74%{ transform:translateY(-9px) rotate(-0.5deg); } 87%{ transform:translateY(5px) rotate(0.2deg); } 100%{ transform:translateY(0) rotate(0); } } #alfred-site .am-fee-stage { animation: am-tag-drop 1.25s cubic-bezier(0.33,1,0.68,1) 0.4s both; } #alfred-site #am-fees .am-tag-ca { font: 400 clamp(11px,3cqi,16px)/1.3 'DM Sans',Arial,sans-serif; color: #1a120a; text-decoration: underline; text-underline-offset: 3px; text-align: center; } #alfred-site #am-fees .am-tag-bank { font: 400 italic clamp(9px,2.2cqi,12px)/1.4 'DM Sans',Arial,sans-serif; color: #6a5040; text-align: center; } @media (max-width: 700px) { #alfred-site[data-palette] main .am-hero-grid { gap: 0 !important; } #alfred-site .am-fee-stage { margin-top: -2px !important; position: relative !important; z-index: 5 !important; padding-top: 0 !important; } #alfred-site .am-finance-caption { display: none !important; } #alfred-site #am-fees { transform: rotate(-0.5deg) !important; width: 280px !important; } #alfred-site #am-fees .am-tag-bg { width: 280px !important; max-width: 280px !important; } #alfred-site #am-fees .am-tag-footer { top: 69% !important; overflow-wrap: anywhere !important; word-break: break-word !important; } #alfred-site #am-fees .am-tag-bank { font-size: 8.5px !important; line-height: 1.5 !important; } .am-mobile-br { display: block !important; height: 0 !important; } #alfred-site #am-fees .am-tag-ca { margin-top: 6px !important; } } /* ══ v130 — hero layout: bank tagline, bigger subtitle, prominent CTA ══ */ #alfred-site .am-bank-tag { font: 500 13px/1.4 'DM Sans', Arial, sans-serif; letter-spacing: 0.12em; text-transform: uppercase; margin: 10px 0 20px; opacity: 0.65; } #alfred-site[data-palette] main .am-subtitle { font-size: clamp(28px, 3vw, 40px) !important; font-weight: 600 !important; line-height: 1.2 !important; margin-top: 0 !important; } #alfred-site[data-palette] main .am-hero-cta { font-size: clamp(16px, 1.8vw, 20px) !important; padding: 18px 44px !important; margin-top: 32px !important; font-weight: 700 !important; letter-spacing: 0.01em !important; } /* ══ v131 — all-3 moment then solo cycling ══ */ /* 2s cycle: all-3 (0.5s) → ACH solo (0.5s) → IBAN solo (0.5s) → SWIFT solo (0.5s) */ @keyframes am-word-ach { 0% { opacity: 1; } 50% { opacity: 1; } 50.1% { opacity: 0; } 100% { opacity: 0; } } @keyframes am-word-iban { 0% { opacity: 1; } 25% { opacity: 1; } 25.1% { opacity: 0; } 49.9% { opacity: 0; } 50% { opacity: 1; } 75% { opacity: 1; } 75.1% { opacity: 0; } 100% { opacity: 0; } } @keyframes am-word-swift { 0% { opacity: 1; } 25% { opacity: 1; } 25.1% { opacity: 0; } 74.9% { opacity: 0; } 75% { opacity: 1; } 100% { opacity: 1; } } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-ach 2s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-iban 2s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-swift 2s linear infinite !important; animation-delay: 0s !important; } @media (prefers-reduced-motion: reduce) { #alfred-site .am-word-loop[style*="--wl:0"], #alfred-site .am-word-loop[style*="--wl:1"], #alfred-site .am-word-loop[style*="--wl:2"] { animation: none !important; opacity: 1 !important; } } /* ══ v132 — correct animation order + polish ══ */ /* Cycle 2.25s: ACH(0.5s)→IBAN(0.5s)→SWIFT(0.5s)→all-3(0.5s)→blank(0.25s)→repeat */ @keyframes am-word-ach-v2 { 0% { opacity: 1; } 21.9% { opacity: 1; } 22% { opacity: 0; } 66.9% { opacity: 0; } 67% { opacity: 1; } 88.9% { opacity: 1; } 89% { opacity: 0; } 100% { opacity: 0; } } @keyframes am-word-iban-v2 { 0% { opacity: 0; } 21.9% { opacity: 0; } 22% { opacity: 1; } 43.9% { opacity: 1; } 44% { opacity: 0; } 66.9% { opacity: 0; } 67% { opacity: 1; } 88.9% { opacity: 1; } 89% { opacity: 0; } 100% { opacity: 0; } } @keyframes am-word-swift-v2 { 0% { opacity: 0; } 43.9% { opacity: 0; } 44% { opacity: 1; } 88.9% { opacity: 1; } 89% { opacity: 0; } 100% { opacity: 0; } } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-ach-v2 2.25s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-iban-v2 2.25s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-swift-v2 2.25s linear infinite !important; animation-delay: 0s !important; } @media (prefers-reduced-motion: reduce) { #alfred-site .am-word-loop[style*="--wl:0"], #alfred-site .am-word-loop[style*="--wl:1"], #alfred-site .am-word-loop[style*="--wl:2"] { animation: none !important; opacity: 1 !important; } } /* Bank tag: left-align to title edge + destello shimmer */ @keyframes am-bank-shimmer { 0% { left: -80%; opacity: 1; } 30% { left: 130%; opacity: 1; } 31% { left: 130%; opacity: 0; } 99% { left: -80%; opacity: 0; } 100% { left: -80%; opacity: 1; } } #alfred-site .am-bank-tag { position: relative !important; overflow: hidden !important; opacity: 1 !important; margin-left: 0 !important; padding-left: 0 !important; } #alfred-site .am-bank-tag::after { content: ''; position: absolute; top: -10%; left: -80%; width: 45%; height: 120%; background: linear-gradient(105deg, transparent 20%, rgba(255,248,120,0.7) 50%, transparent 80%); animation: am-bank-shimmer 4s 1.5s ease-in-out infinite; pointer-events: none; } /* Subtitle: large but light weight — less noise */ #alfred-site[data-palette] main .am-subtitle { font-size: clamp(22px, 2.2vw, 30px) !important; font-weight: 400 !important; line-height: 1.3 !important; margin-top: 6px !important; } /* CTA: refined pill, not a block */ #alfred-site[data-palette] main .am-hero-cta { font-size: clamp(14px, 1.4vw, 17px) !important; padding: 14px 36px !important; margin-top: 24px !important; font-weight: 600 !important; letter-spacing: 0.04em !important; border-radius: 50px !important; display: inline-block !important; } /* ══ v133 — bank-tag tag-glint shimmer + mobile CTA center ══ */ /* Kill ::after sweep, use same gradient-text glint as the price tag */ #alfred-site .am-bank-tag::after { display: none !important; } #alfred-site .am-bank-tag { color: transparent !important; background: linear-gradient(105deg,#442b22 0%,#442b22 28%,#8b7355 40%,#e8dcc8 50%,#8b7355 60%,#442b22 72%,#442b22 100%) !important; background-size: 260% auto !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; animation: am-tag-glint 4.5s ease-in-out 1s infinite !important; opacity: 1 !important; overflow: visible !important; } /* CTA centered on mobile */ @media (max-width: 768px) { #alfred-site[data-palette] main .am-hero-cta { display: block !important; width: max-content !important; margin-left: auto !important; margin-right: auto !important; } } /* ══ v135 — animation v4: 5% blank gaps between each word + before all-3 ══ */ /* Cycle 3s: ACH(0-20%)→blank(20-25%)→IBAN(25-45%)→blank(45-50%)→SWIFT(50-70%)→blank(70-75%)→all-3(75-90%)→blank(90-100%) */ /* ══ v134 — animation v3: longer blank so SWIFT visibly disappears ══ */ /* 2.5s cycle: ACH(0.5s)→IBAN(0.5s)→SWIFT(0.5s)→all-3(0.5s)→BLANK(0.5s)→repeat */ @keyframes am-word-ach-v3 { 0% { opacity: 1; } 20% { opacity: 1; } 20.1% { opacity: 0; } 59.9% { opacity: 0; } 60% { opacity: 1; } 80% { opacity: 1; } 80.1% { opacity: 0; } 100% { opacity: 0; } } @keyframes am-word-iban-v3 { 0% { opacity: 0; } 19.9% { opacity: 0; } 20% { opacity: 1; } 40% { opacity: 1; } 40.1% { opacity: 0; } 59.9% { opacity: 0; } 60% { opacity: 1; } 80% { opacity: 1; } 80.1% { opacity: 0; } 100% { opacity: 0; } } @keyframes am-word-swift-v3 { 0% { opacity: 0; } 39.9% { opacity: 0; } 40% { opacity: 1; } 80% { opacity: 1; } 80.1% { opacity: 0; } 100% { opacity: 0; } } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-ach-v3 2.5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-iban-v3 2.5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-swift-v3 2.5s linear infinite !important; animation-delay: 0s !important; } @media (prefers-reduced-motion: reduce) { #alfred-site .am-word-loop[style*="--wl:0"], #alfred-site .am-word-loop[style*="--wl:1"], #alfred-site .am-word-loop[style*="--wl:2"] { animation: none !important; opacity: 1 !important; } } @keyframes am-word-ach-v4 { 0%{opacity:1;} 20%{opacity:1;} 20.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 90%{opacity:1;} 90.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-iban-v4 { 0%{opacity:0;} 24.9%{opacity:0;} 25%{opacity:1;} 45%{opacity:1;} 45.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 90%{opacity:1;} 90.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-swift-v4 { 0%{opacity:0;} 49.9%{opacity:0;} 50%{opacity:1;} 70%{opacity:1;} 70.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 90%{opacity:1;} 90.1%{opacity:0;} 100%{opacity:0;} } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-ach-v4 3s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-iban-v4 3s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-swift-v4 3s linear infinite !important; animation-delay: 0s !important; } /* ══ v136 — 5-word animation: CRYPTO→TO→ACH→IBAN→SWIFT→all-together ══ */ /* 5s cycle: each solo=0.6s, gap=0.15s, all-together=0.6s, blank=0.65s */ @keyframes am-word-crypto-v5 { 0%{opacity:1;} 12%{opacity:1;} 12.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 87%{opacity:1;} 87.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-to-v5 { 0%{opacity:0;} 14.9%{opacity:0;} 15%{opacity:1;} 27%{opacity:1;} 27.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 87%{opacity:1;} 87.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-ach-v5 { 0%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 42%{opacity:1;} 42.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 87%{opacity:1;} 87.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-iban-v5 { 0%{opacity:0;} 44.9%{opacity:0;} 45%{opacity:1;} 57%{opacity:1;} 57.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 87%{opacity:1;} 87.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-swift-v5 { 0%{opacity:0;} 59.9%{opacity:0;} 60%{opacity:1;} 72%{opacity:1;} 72.1%{opacity:0;} 74.9%{opacity:0;} 75%{opacity:1;} 87%{opacity:1;} 87.1%{opacity:0;} 100%{opacity:0;} } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-crypto-v5 5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-to-v5 5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-ach-v5 5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:3"] { animation: am-word-iban-v5 5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:4"] { animation: am-word-swift-v5 5s linear infinite !important; animation-delay: 0s !important; } /* rope fade-in on mobile — smooth top edge where rope meets button */ @media (max-width: 700px) { #alfred-site .am-tag-bg { -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 10%); mask-image: linear-gradient(to bottom, transparent 0%, black 10%); } } /* ══ v137 — animation speed x2 (2.5s cycle) ══ */ #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-crypto-v5 2.5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-to-v5 2.5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-ach-v5 2.5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:3"] { animation: am-word-iban-v5 2.5s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:4"] { animation: am-word-swift-v5 2.5s linear infinite !important; animation-delay: 0s !important; } /* ══ v138 — 8s cycle: fast solos (~0.4s each), 5s all-together ══ */ /* Phases: CRYPTO(0-5%)→gap→TO(6-11%)→gap→ACH(12-17%)→gap→IBAN(18-23%)→gap→SWIFT(24-29%)→gap→ALL(30-92.5%)→blank(92.6-100%) */ @keyframes am-word-crypto-v6 { 0%{opacity:1;} 5%{opacity:1;} 5.1%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 92.5%{opacity:1;} 92.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-to-v6 { 0%{opacity:0;} 5.9%{opacity:0;} 6%{opacity:1;} 11%{opacity:1;} 11.1%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 92.5%{opacity:1;} 92.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-ach-v6 { 0%{opacity:0;} 11.9%{opacity:0;} 12%{opacity:1;} 17%{opacity:1;} 17.1%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 92.5%{opacity:1;} 92.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-iban-v6 { 0%{opacity:0;} 17.9%{opacity:0;} 18%{opacity:1;} 23%{opacity:1;} 23.1%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 92.5%{opacity:1;} 92.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-swift-v6 { 0%{opacity:0;} 23.9%{opacity:0;} 24%{opacity:1;} 29%{opacity:1;} 29.1%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 92.5%{opacity:1;} 92.6%{opacity:0;} 100%{opacity:0;} } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-crypto-v6 8s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-to-v6 8s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-ach-v6 8s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:3"] { animation: am-word-iban-v6 8s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:4"] { animation: am-word-swift-v6 8s linear infinite !important; animation-delay: 0s !important; } /* ══ v139 — 6 words (added SINPE wl:5), 9s cycle: 0.45s solos, 5s all-together ══ */ /* CRYPTO(0-5%)→TO(6-11%)→ACH(12-17%)→IBAN(18-23%)→SWIFT(24-29%)→SINPE(30-35%)→ALL(36-91.5%)→blank */ @keyframes am-word-crypto-v7 { 0%{opacity:1;} 5%{opacity:1;} 5.1%{opacity:0;} 35.9%{opacity:0;} 36%{opacity:1;} 91.5%{opacity:1;} 91.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-to-v7 { 0%{opacity:0;} 5.9%{opacity:0;} 6%{opacity:1;} 11%{opacity:1;} 11.1%{opacity:0;} 35.9%{opacity:0;} 36%{opacity:1;} 91.5%{opacity:1;} 91.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-ach-v7 { 0%{opacity:0;} 11.9%{opacity:0;} 12%{opacity:1;} 17%{opacity:1;} 17.1%{opacity:0;} 35.9%{opacity:0;} 36%{opacity:1;} 91.5%{opacity:1;} 91.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-iban-v7 { 0%{opacity:0;} 17.9%{opacity:0;} 18%{opacity:1;} 23%{opacity:1;} 23.1%{opacity:0;} 35.9%{opacity:0;} 36%{opacity:1;} 91.5%{opacity:1;} 91.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-swift-v7 { 0%{opacity:0;} 23.9%{opacity:0;} 24%{opacity:1;} 29%{opacity:1;} 29.1%{opacity:0;} 35.9%{opacity:0;} 36%{opacity:1;} 91.5%{opacity:1;} 91.6%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-sinpe-v7 { 0%{opacity:0;} 29.9%{opacity:0;} 30%{opacity:1;} 35%{opacity:1;} 35.1%{opacity:0;} 35.9%{opacity:0;} 36%{opacity:1;} 91.5%{opacity:1;} 91.6%{opacity:0;} 100%{opacity:0;} } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-crypto-v7 9s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-to-v7 9s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-ach-v7 9s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:3"] { animation: am-word-iban-v7 9s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:4"] { animation: am-word-swift-v7 9s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:5"] { animation: am-word-sinpe-v7 9s linear infinite !important; animation-delay: 0s !important; } /* ══ v140 — 7s cycle: faster solos (0.25s each), less blank ══ */ /* CRYPTO(0-3.5%)→TO(4.3-7.8%)→ACH(8.6-12.1%)→IBAN(12.9-16.4%)→SWIFT(17.1-20.6%)→SINPE(21.4-24.9%)→ALL(25.7-97%)→blank(97.1-100%) */ @keyframes am-word-crypto-v8 { 0%{opacity:1;} 3.5%{opacity:1;} 3.6%{opacity:0;} 25.6%{opacity:0;} 25.7%{opacity:1;} 97%{opacity:1;} 97.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-to-v8 { 0%{opacity:0;} 4.2%{opacity:0;} 4.3%{opacity:1;} 7.8%{opacity:1;} 7.9%{opacity:0;} 25.6%{opacity:0;} 25.7%{opacity:1;} 97%{opacity:1;} 97.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-ach-v8 { 0%{opacity:0;} 8.5%{opacity:0;} 8.6%{opacity:1;} 12.1%{opacity:1;} 12.2%{opacity:0;} 25.6%{opacity:0;} 25.7%{opacity:1;} 97%{opacity:1;} 97.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-iban-v8 { 0%{opacity:0;} 12.8%{opacity:0;} 12.9%{opacity:1;} 16.4%{opacity:1;} 16.5%{opacity:0;} 25.6%{opacity:0;} 25.7%{opacity:1;} 97%{opacity:1;} 97.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-swift-v8 { 0%{opacity:0;} 17%{opacity:0;} 17.1%{opacity:1;} 20.6%{opacity:1;} 20.7%{opacity:0;} 25.6%{opacity:0;} 25.7%{opacity:1;} 97%{opacity:1;} 97.1%{opacity:0;} 100%{opacity:0;} } @keyframes am-word-sinpe-v8 { 0%{opacity:0;} 21.3%{opacity:0;} 21.4%{opacity:1;} 24.9%{opacity:1;} 25%{opacity:0;} 25.6%{opacity:0;} 25.7%{opacity:1;} 97%{opacity:1;} 97.1%{opacity:0;} 100%{opacity:0;} } #alfred-site .am-word-loop[style*="--wl:0"] { animation: am-word-crypto-v8 7s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:1"] { animation: am-word-to-v8 7s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:2"] { animation: am-word-ach-v8 7s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:3"] { animation: am-word-iban-v8 7s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:4"] { animation: am-word-swift-v8 7s linear infinite !important; animation-delay: 0s !important; } #alfred-site .am-word-loop[style*="--wl:5"] { animation: am-word-sinpe-v8 7s linear infinite !important; animation-delay: 0s !important; } /* ══ v141 — nav tabs visible in header, smaller logo ══ */ #alfred-site .am-logo { font-size: 0.75rem !important; letter-spacing: 0.01em !important; } @media (min-width: 700px) { #alfred-site .am-menu-toggle { display: none !important; } #alfred-site #am-navigation[hidden] { display: flex !important; } #alfred-site #am-navigation { display: flex !important; flex-direction: row !important; gap: 1.75rem !important; align-items: center !important; position: static !important; background: transparent !important; padding: 0 !important; } #alfred-site .am-nav-link { font-size: 0.7rem !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; opacity: 0.75; } #alfred-site .am-nav-link:hover { opacity: 1; } } /* ══ v142 — nav tabs: plain white text, centered, no pills ══ */ @media (min-width: 700px) { #alfred-site .am-header-inner { display: flex !important; justify-content: space-between !important; align-items: center !important; } #alfred-site .am-menu-toggle { display: none !important; } #alfred-site #am-navigation[hidden] { display: flex !important; } #alfred-site #am-navigation { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important; gap: 2.5rem !important; position: static !important; background: transparent !important; padding: 0 !important; flex: 1 !important; } #alfred-site .am-nav-link { font-size: 0.72rem !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #fff !important; background: none !important; border: none !important; padding: 0 !important; box-shadow: none !important; border-radius: 0 !important; opacity: 0.8 !important; text-decoration: none !important; } #alfred-site .am-nav-link:hover { opacity: 1 !important; } } /* ══ v143 — nav: centered absolutely, bigger text, no box ══ */ @media (min-width: 700px) { #alfred-site .am-header-inner { position: relative !important; } #alfred-site #am-navigation[hidden] { display: flex !important; } #alfred-site #am-navigation { position: absolute !important; left: 50% !important; transform: translateX(-50%) !important; display: flex !important; flex-direction: row !important; align-items: center !important; gap: 2.5rem !important; background: none !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; } #alfred-site .am-nav-link { background: none !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; color: #fff !important; font-size: 0.82rem !important; font-weight: 600 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; opacity: 0.85 !important; text-decoration: none !important; } #alfred-site .am-nav-link:hover { opacity: 1 !important; } } /* ══ v144 — logo smaller + corner ══ */ #alfred-site .am-logo { font-size: 0.62rem !important; letter-spacing: 0em !important; padding: 0 !important; margin: 0 !important; } /* ══ v145 — nav INSIDE header, centered, bigger, underline tabs, tiny logo ══ */ @media (min-width: 700px) { #alfred-site .am-header-inner { position: relative !important; } #alfred-site .am-menu-toggle { display: none !important; } #alfred-site #am-navigation[hidden] { display: flex !important; } #alfred-site #am-navigation { position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; display: flex !important; flex-direction: row !important; justify-content: center !important; align-items: center !important; gap: 3.5rem !important; background: none !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 !important; pointer-events: none !important; } #alfred-site .am-nav-link { pointer-events: all !important; background: none !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 0 4px !important; margin: 0 !important; color: #fff !important; font-size: 0.95rem !important; font-weight: 600 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; opacity: 0.9 !important; text-decoration: none !important; border-bottom: 1.5px solid rgba(255,255,255,0.55) !important; } #alfred-site .am-nav-link:hover { opacity: 1 !important; border-bottom-color: #fff !important; } #alfred-site .am-logo { font-size: 0.55rem !important; letter-spacing: 0em !important; padding: 0 !important; margin: 0 !important; position: relative !important; z-index: 2 !important; } } /* ══ v146 — nav centered point (no overlap), bigger, underline ══ */ @media (min-width: 700px) { #alfred-site .am-header-inner { position: relative !important; display: flex !important; align-items: center !important; } #alfred-site .am-menu-toggle { display: none !important; } #alfred-site #am-navigation[hidden] { display: flex !important; } #alfred-site #am-navigation { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: auto !important; display: flex !important; flex-direction: row !important; align-items: center !important; gap: 3rem !important; white-space: nowrap !important; background: none !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; } #alfred-site .am-nav-link { background: none !important; border: none !important; outline: none !important; box-shadow: none !important; padding: 0 0 5px !important; margin: 0 !important; color: #fff !important; font-size: 0.9rem !important; font-weight: 600 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; opacity: 0.9 !important; text-decoration: none !important; border-bottom: 1.5px solid rgba(255,255,255,0.55) !important; } #alfred-site .am-nav-link:hover { opacity: 1 !important; border-bottom-color: #fff !important; } #alfred-site .am-logo { font-size: 0.55rem !important; letter-spacing: 0em !important; padding: 0 !important; margin: 0 !important; flex-shrink: 0 !important; position: relative !important; z-index: 2 !important; } } /* ══ v147 — underline right under text, higher specificity, more gap ══ */ @media (min-width: 700px) { #alfred-site #am-navigation { gap: 4rem !important; } #alfred-site #am-navigation .am-nav-link { display: inline-block !important; padding: 0 !important; margin: 0 !important; min-height: 0 !important; min-width: 0 !important; border-bottom: none !important; color: #fff !important; font-size: 0.9rem !important; font-weight: 600 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; opacity: 0.9 !important; text-decoration: underline !important; text-decoration-color: rgba(255,255,255,0.5) !important; text-underline-offset: 5px !important; text-decoration-thickness: 1.5px !important; background: none !important; box-shadow: none !important; } #alfred-site #am-navigation .am-nav-link:hover { opacity: 1 !important; text-decoration-color: #fff !important; } } /* ══ v148 — 3 nav items + minimalist icons ══ */ @media (min-width: 700px) { #alfred-site #am-navigation { gap: 5rem !important; } #alfred-site #am-navigation .am-nav-link { display: inline-flex !important; align-items: center !important; gap: 5px !important; } #alfred-site .am-nav-icon { flex-shrink: 0 !important; vertical-align: middle !important; } } /* ══ v149 — nav links bigger ══ */ @media (min-width: 700px) { #alfred-site #am-navigation .am-nav-link { font-size: 1.05rem !important; } #alfred-site .am-nav-icon { width: 14px !important; height: 14px !important; } } /* ══ v150 — icons bigger, glow with text on hover ══ */ @media (min-width: 700px) { #alfred-site .am-nav-icon { width: 17px !important; height: 17px !important; } #alfred-site .am-nav-icon text { opacity: 1 !important; font-size: 15px !important; } #alfred-site .am-nav-icon rect { fill-opacity: 1 !important; stroke-opacity: 1 !important; } #alfred-site #am-navigation .am-nav-link { opacity: 0.75 !important; transition: opacity 0.2s !important; } #alfred-site #am-navigation .am-nav-link:hover { opacity: 1 !important; } } /* ══ v151 — icons right side, slightly smaller ══ */ @media (min-width: 700px) { #alfred-site #am-navigation .am-nav-link { font-size: 0.92rem !important; } #alfred-site .am-nav-icon { width: 14px !important; height: 14px !important; } #alfred-site .am-nav-icon text { font-size: 13px !important; } } /* ══ v155 — Login + Language picker ══ */ @media (min-width: 700px) { #alfred-site .am-header-actions { display: flex !important; align-items: center !important; gap: 0.6rem !important; flex-shrink: 0 !important; z-index: 3 !important; color: rgba(255,255,255,0.75) !important; font-size: 0.78rem !important; font-weight: 500 !important; letter-spacing: 0.06em !important; } #alfred-site .am-login-link { color: rgba(255,255,255,0.75) !important; text-decoration: none !important; transition: color 0.18s !important; white-space: nowrap !important; } #alfred-site .am-login-link:hover { color: #fff !important; } #alfred-site .am-header-divider { color: rgba(255,255,255,0.3) !important; font-size: 0.7rem !important; user-select: none !important; } #alfred-site .am-lang-picker { position: relative !important; cursor: pointer !important; color: rgba(255,255,255,0.75) !important; transition: color 0.18s !important; outline: none !important; list-style: none !important; } #alfred-site .am-lang-picker[open], #alfred-site .am-lang-picker:hover { color: #fff !important; } #alfred-site .am-lang-picker:hover .am-lang-dropdown { display: block !important; } #alfred-site .am-lang-summary { list-style: none !important; cursor: pointer !important; outline: none !important; display: flex !important; align-items: center !important; } #alfred-site .am-lang-summary::-webkit-details-marker { display: none !important; } #alfred-site .am-lang-icon { display: block !important; } #alfred-site .am-lang-dropdown { position: absolute !important; top: calc(100% + 2px) !important; right: 0 !important; background: #1a1a1a !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 8px !important; padding: 6px 0 !important; min-width: 150px !important; box-shadow: 0 8px 24px rgba(0,0,0,0.4) !important; z-index: 100 !important; } #alfred-site .am-lang-option { display: flex !important; align-items: center !important; gap: 8px !important; width: 100% !important; padding: 9px 14px !important; background: none !important; border: none !important; color: rgba(255,255,255,0.75) !important; font-size: 0.82rem !important; font-weight: 400 !important; letter-spacing: 0.03em !important; cursor: pointer !important; text-align: left !important; transition: background 0.15s, color 0.15s, transform 0.15s !important; transform-origin: left center !important; } #alfred-site .am-lang-option:hover, #alfred-site .am-lang-option:active { background: rgba(255,255,255,0.1) !important; color: #fff !important; transform: scale(1.04) !important; } #alfred-site .am-flag { font-size: 1.1rem !important; } } @media (max-width: 699px) { #alfred-site .am-header-actions { display: none !important; } } /* ══ v152 — icon grows on hover ══ */ @media (min-width: 700px) { #alfred-site .am-nav-icon { transition: transform 0.2s ease !important; transform-origin: center !important; } #alfred-site #am-navigation .am-nav-link:hover .am-nav-icon { transform: scale(1.4) !important; } } /* ══ v153 — Explore your needs + Check availability grow on hover ══ */ #alfred-site .am-hero-cta { transition: transform 0.18s ease !important; display: inline-block !important; } #alfred-site .am-hero-cta:hover { transform: scale(1.06) !important; } #alfred-site .am-tag-ca { transition: transform 0.18s ease !important; display: inline-block !important; pointer-events: auto !important; } #alfred-site .am-tag-ca:hover { transform: scale(1.1) !important; cursor: pointer !important; } #alfred-site .am-inline-link { transition: transform 0.18s ease !important; display: inline-block !important; } #alfred-site .am-inline-link:hover { transform: scale(1.06) !important; } /* ══ v162 — contact capture widget ══ */ #alfred-site .am-no-spam { font-size: 0.72rem !important; color: rgba(255,255,255,0.4) !important; letter-spacing: 0.04em !important; margin: 0 0 0.65rem !important; font-weight: 400 !important; } #alfred-site .am-capture { max-width: 420px !important; margin-top: 2rem !important; } #alfred-site .am-capture-inner { display: flex !important; align-items: center !important; background: rgba(255,255,255,0.07) !important; border: 1px solid rgba(255,255,255,0.15) !important; border-radius: 100px !important; overflow: visible !important; position: relative !important; backdrop-filter: blur(8px) !important; transition: border-color 0.2s !important; } #alfred-site .am-capture-inner:focus-within { border-color: rgba(255,255,255,0.32) !important; } #alfred-site .am-platform-picker { position: relative !important; flex-shrink: 0 !important; list-style: none !important; outline: none !important; } #alfred-site .am-platform-summary { display: flex !important; align-items: center !important; gap: 4px !important; padding: 10px 8px 10px 14px !important; cursor: pointer !important; color: rgba(255,255,255,0.65) !important; list-style: none !important; outline: none !important; transition: color 0.15s !important; } #alfred-site .am-platform-summary::-webkit-details-marker { display: none !important; } #alfred-site .am-platform-summary:hover { color: #fff !important; } #alfred-site .am-plat-chevron { transition: transform 0.18s !important; flex-shrink: 0 !important; } #alfred-site .am-platform-picker[open] .am-plat-chevron { transform: rotate(180deg) !important; } #alfred-site .am-platform-dropdown { position: absolute !important; top: calc(100% + 6px) !important; left: 0 !important; background: #111 !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 10px !important; padding: 5px 0 !important; min-width: 148px !important; box-shadow: 0 8px 28px rgba(0,0,0,0.55) !important; z-index: 200 !important; } #alfred-site .am-platform-option { display: flex !important; align-items: center !important; gap: 9px !important; width: 100% !important; padding: 9px 14px !important; background: none !important; border: none !important; color: rgba(255,255,255,0.65) !important; font-size: 0.8rem !important; font-weight: 400 !important; cursor: pointer !important; text-align: left !important; transition: background 0.12s, color 0.12s !important; } #alfred-site .am-platform-option:hover, #alfred-site .am-platform-option.is-active { background: rgba(255,255,255,0.08) !important; color: #fff !important; } #alfred-site .am-capture-sep { width: 1px !important; height: 16px !important; background: rgba(255,255,255,0.15) !important; flex-shrink: 0 !important; } #alfred-site .am-capture-input { flex: 1 !important; background: none !important; border: none !important; outline: none !important; color: rgba(255,255,255,0.85) !important; font-size: 0.82rem !important; font-family: inherit !important; padding: 11px 8px !important; min-width: 0 !important; } #alfred-site .am-capture-input::placeholder { color: rgba(255,255,255,0.28) !important; } #alfred-site .am-capture-submit { display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; width: 34px !important; height: 34px !important; margin: 4px 4px 4px 0 !important; background: rgba(255,255,255,0.1) !important; border: none !important; border-radius: 100px !important; color: rgba(255,255,255,0.65) !important; cursor: pointer !important; transition: background 0.15s, color 0.15s !important; } #alfred-site .am-capture-submit:hover { background: rgba(255,255,255,0.2) !important; color: #fff !important; } /* ══ v163 — capture widget spacing + no-spam visibility + remove sep line ══ */ #alfred-site .am-subtitle { margin-bottom: 1.8rem !important; } #alfred-site .am-no-spam { color: rgba(255,255,255,0.6) !important; margin-bottom: 0.8rem !important; } #alfred-site .am-capture-sep { display: none !important; } /* ══ v164 — capture widget: dark-on-lime palette (hero bg is lime green) ══ */ #alfred-site .am-no-spam { color: rgba(30,18,5,0.7) !important; font-size: 0.92rem !important; margin-bottom: 0.35rem !important; text-align: center !important; max-width: 420px !important; } #alfred-site .am-capture-inner { background: rgba(30,18,5,0.07) !important; border-color: rgba(30,18,5,0.22) !important; backdrop-filter: none !important; } #alfred-site .am-capture-inner:focus-within { border-color: rgba(30,18,5,0.42) !important; } #alfred-site .am-platform-summary { color: rgba(30,18,5,0.6) !important; } #alfred-site .am-platform-summary:hover { color: rgba(30,18,5,0.95) !important; } #alfred-site .am-plat-current { stroke: rgba(30,18,5,0.7) !important; } #alfred-site .am-capture-input { color: rgba(30,18,5,0.88) !important; } #alfred-site .am-capture-input::placeholder { color: rgba(30,18,5,0.35) !important; } #alfred-site .am-capture-submit { background: rgba(30,18,5,0.1) !important; color: rgba(30,18,5,0.6) !important; } #alfred-site .am-capture-submit:hover { background: rgba(30,18,5,0.2) !important; color: rgba(30,18,5,1) !important; } #alfred-site .am-capture-sep { display: none !important; } /* ══ v165 — bigger no-spam, bigger input, dropdown opens upward ══ */ #alfred-site .am-no-spam { font-size: 0.9rem !important; } #alfred-site .am-capture-input { font-size: 0.9rem !important; padding: 13px 10px !important; } #alfred-site .am-platform-summary { padding: 13px 8px 13px 16px !important; } #alfred-site .am-capture-submit { width: 38px !important; height: 38px !important; margin: 5px 5px 5px 0 !important; } #alfred-site .am-platform-dropdown { top: auto !important; bottom: calc(100% + 6px) !important; } /* ══ v166 — BANK/CRYPTO alternating headline + brand colors ══ */ /* styles.css sets .am-title span { display:block } — must force inline here */ #alfred-site .am-dir-crypto { color: #F68B42; display: inline !important; } #alfred-site .am-dir-bank { display: none; color: #EFE4D2; } #alfred-site .am-title.am-mode-bank .am-dir-crypto { display: none; } #alfred-site .am-title.am-mode-bank .am-dir-bank { display: inline; } /* ══ v166b — force single-word display with !important ══ */ #alfred-site .am-dir-bank { display: none !important; } #alfred-site .am-title.am-mode-bank .am-dir-crypto { display: none !important; } #alfred-site .am-title.am-mode-bank .am-dir-bank { display: inline !important; } /* ══ v168c — platform icon row: translucent frosted glass, monochrome icons ══ */ #alfred-site .am-capture-inner { display: flex !important; align-items: center !important; padding: 8px 8px 8px 12px !important; gap: 0 !important; overflow: hidden !important; background: rgba(255,255,255,0.32) !important; border: 1px solid rgba(255,255,255,0.55) !important; border-radius: 100px !important; box-shadow: 0 12px 40px rgba(68,43,34,0.18), 0 2px 8px rgba(68,43,34,0.08), inset 0 1px 0 rgba(255,255,255,0.65) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; } #alfred-site .am-plat-row { display: flex !important; align-items: center !important; gap: 4px !important; flex-shrink: 0 !important; } #alfred-site .am-plat-icon { display: flex !important; align-items: center !important; justify-content: center !important; width: 48px !important; height: 48px !important; max-width: 48px !important; border-radius: 50% !important; border: none !important; background: transparent !important; color: rgba(30,18,5,0.5) !important; cursor: pointer !important; overflow: hidden !important; transition: color 0.2s, background 0.2s, transform 0.2s, max-width 0.4s ease, opacity 0.35s ease !important; } #alfred-site .am-plat-icon:hover { color: rgba(30,18,5,0.9) !important; transform: scale(1.12) !important; background: rgba(30,18,5,0.08) !important; } #alfred-site .am-plat-icon.is-preselected { color: rgba(30,18,5,0.88) !important; background: rgba(30,18,5,0.1) !important; } #alfred-site .am-plat-icon.is-selected { color: rgba(30,18,5,0.88) !important; background: rgba(30,18,5,0.1) !important; } /* Collapse non-selected icons: slide-shrink left */ #alfred-site .am-capture.is-chosen .am-plat-icon:not(.is-selected) { max-width: 0 !important; opacity: 0 !important; } /* Input field: hidden until chosen */ #alfred-site .am-capture-field { display: flex !important; align-items: center !important; flex: 1 !important; max-width: 0 !important; opacity: 0 !important; overflow: hidden !important; transition: max-width 0.45s ease, opacity 0.3s ease 0.2s !important; } #alfred-site .am-capture.is-chosen .am-capture-field { max-width: 500px !important; opacity: 1 !important; } #alfred-site .am-capture-field .am-capture-input { flex: 1 !important; border: none !important; background: transparent !important; outline: none !important; min-width: 0 !important; color: #2a1a0e !important; font-size: 0.9rem !important; padding: 11px 8px !important; } #alfred-site .am-capture-field .am-capture-input::placeholder { color: rgba(30,18,5,0.4) !important; } #alfred-site .am-capture-field .am-capture-submit { flex-shrink: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; width: 38px !important; height: 38px !important; border-radius: 50% !important; border: none !important; background: rgba(30,18,5,0.12) !important; color: rgba(30,18,5,0.7) !important; cursor: pointer !important; transition: background 0.2s, transform 0.15s !important; } #alfred-site .am-capture-field .am-capture-submit:hover { background: rgba(30,18,5,0.22) !important; transform: scale(1.08) !important; color: rgba(30,18,5,1) !important; } /* ══ v169 — "BUY CRYPTO VIA:" mode + smaller unbolded payment rails ══ */ /* Hide "TO" when in bank/via mode */ #alfred-site .am-title.am-mode-bank .am-word-loop[style*="--wl:1"] { display: none !important; animation: none !important; } /* Payment rails: smaller, unbolded */ #alfred-site .am-title .am-word-loop[style*="--wl:2"], #alfred-site .am-title .am-word-loop[style*="--wl:3"], #alfred-site .am-title .am-word-loop[style*="--wl:4"], #alfred-site .am-title .am-word-loop[style*="--wl:5"] { font-weight: 400 !important; font-size: 0.65em !important; } /* ══ v171 — headline always visible; only payment rails animate ══ */ #alfred-site .am-word-loop[style*="--wl:0"], #alfred-site .am-word-loop[style*="--wl:1"] { opacity: 1 !important; animation: none !important; } /* ══ v172 — "TO"/"VIA:" animate with rails; only wl:0 is fixed ══ */ /* Override v171: wl:1 animates normally again */ #alfred-site .am-word-loop[style*="--wl:1"] { opacity: unset !important; animation: am-word-to-v8 7s linear infinite !important; animation-delay: 0s !important; } /* Override v169: wl:1 stays in DOM in bank mode (shows VIA: via am-dir-bank) */ #alfred-site .am-title.am-mode-bank .am-word-loop[style*="--wl:1"] { display: unset !important; animation: am-word-to-v8 7s linear infinite !important; } /* ══ v173 — selected language flag in header ══ */ #alfred-site .am-sel-flag { font-size: 1.15rem; line-height: 1; display: inline-flex; align-items: center; } /* ══ v174 — rails same size as TO/VIA: (revert v169 size reduction) ══ */ #alfred-site .am-title .am-word-loop[style*="--wl:2"], #alfred-site .am-title .am-word-loop[style*="--wl:3"], #alfred-site .am-title .am-word-loop[style*="--wl:4"], #alfred-site .am-title .am-word-loop[style*="--wl:5"] { font-weight: unset !important; font-size: unset !important; } /* ══ v176 — wl:0 as block so rails flow on same line as TO ══ */ #alfred-site .am-word-loop[style*="--wl:0"] { display: block !important; } /* v180 — static br after CRYPTO + stacked cycling words */ #alfred-site .am-crypto-break { display: block !important; } #alfred-site .am-rail-stack { position: relative; display: inline-block !important; vertical-align: baseline; } #alfred-site .am-rail-stack .am-word-loop[style*="--wl:3"], #alfred-site .am-rail-stack .am-word-loop[style*="--wl:4"], #alfred-site .am-rail-stack .am-word-loop[style*="--wl:5"] { position: absolute !important; left: 0 !important; top: 0 !important; white-space: nowrap; } /* v183 — explicit block lines via am-hline; eliminates anonymous-block wrapping ambiguity */ #alfred-site .am-hline { display: block !important; } /* v184 — force content onto one line in am-hline-nowrap */ #alfred-site .am-hline-nowrap { white-space: nowrap !important; } /* v186 — SELL/BUY CRYPTO alternating headline; VIA fixed in café on ACH line */ #alfred-site .am-sb-sell { color: #ffffff; display: inline !important; white-space: nowrap !important; } #alfred-site .am-sb-buy { display: none !important; color: #F68B42; white-space: nowrap !important; } #alfred-site .am-title.am-mode-buy .am-sb-sell { display: none !important; } #alfred-site .am-title.am-mode-buy .am-sb-buy { display: inline !important; } #alfred-site .am-sb-via { color: #442B22; display: inline !important; } /* v182 — HTML restructured: dropped wl:1-5 and am-crypto-break; TO/VIA inline after block wl:0; explicit
for IBAN/SWIFT/SINPE lines */ /* v181 — rail words always visible, no cycling animation */ #alfred-site .am-title .am-word-loop[style*="--wl:2"], #alfred-site .am-title .am-word-loop[style*="--wl:3"], #alfred-site .am-title .am-word-loop[style*="--wl:4"], #alfred-site .am-title .am-word-loop[style*="--wl:5"] { opacity: 1 !important; animation: none !important; position: static !important; display: inline !important; } /* v187 — sequential word animation: ACH IBAN SWIFT SINPE one by one */ #alfred-site .am-aw { opacity: 0; transition: opacity 0.35s ease; display: inline !important; } #alfred-site .am-aw.am-aw-on { opacity: 1; } /* v187b — method lines 20% smaller than SELL/BUY CRYPTO */ #alfred-site .am-hline-sub { font-size: 0.8em; } /* v188 — CRYPTO fixed in café; only SELL/BUY alternates */ #alfred-site .am-sb-crypto { color: #442B22; display: inline !important; } /* v188b — word animation disabled; all fixed visible */ #alfred-site .am-aw { opacity: 1 !important; } /* ══ v203 — Liquid Glass: pseudo-element glow gives blur something to work with on solid bg ══ */ #alfred-site .am-capture { max-width: 420px !important; margin-top: 2.8rem !important; position: relative !important; } #alfred-site .am-capture::before { content: none !important; } #alfred-site .am-capture-inner { position: relative !important; z-index: 1 !important; overflow: visible !important; background: rgba(255,255,255,0.035) !important; border: 1px solid rgba(68,43,34,0.14) !important; border-radius: 100px !important; box-shadow: 0 10px 24px rgba(68,43,34,0.14), inset 0 1px 0 rgba(255,255,255,0.24) !important; backdrop-filter: blur(10px) saturate(1) !important; -webkit-backdrop-filter: blur(10px) saturate(1) !important; } #alfred-site .am-plat-icon { color: #442B22 !important; opacity: 0.65 !important; transition: color 0.2s, background 0.2s, transform 0.28s cubic-bezier(0.34,1.56,0.64,1), max-width 0.4s ease, opacity 0.35s ease !important; } #alfred-site .am-plat-icon:hover { color: #442B22 !important; opacity: 1 !important; transform: scale(1.24) !important; background: rgba(68,43,34,0.09) !important; } #alfred-site .am-plat-icon.is-preselected:not(:hover):not(:active):not(.is-selected) { color: #442B22 !important; opacity: 0.75 !important; background: transparent !important; } #alfred-site .am-plat-icon.is-selected { color: #442B22 !important; opacity: 1 !important; transform: scale(1.18) !important; background: rgba(68,43,34,0.11) !important; } #alfred-site .am-no-spam { color: rgba(30,18,5,0.7) !important; font-size: 0.92rem !important; margin-bottom: 0.35rem !important; text-align: center !important; max-width: 420px !important; } /* Private Safari review candidate. No palette, copy, headline, tag or timing changes. */ #alfred-site .am-capture::before { content: none !important; } #alfred-site .am-capture .am-capture-inner { background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.025) 55%, rgba(255,255,255,.055)) !important; border: 1px solid rgba(255,255,255,.30) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(68,43,34,.09), 0 4px 12px rgba(68,43,34,.07) !important; -webkit-backdrop-filter: blur(12px) !important; backdrop-filter: blur(12px) !important; } #alfred-site .am-capture .am-capture-inner:focus-within { border-color: rgba(68,43,34,.30) !important; } /* Explicit state priority. Preselection is a suggestion, not a selection. */ #alfred-site .am-capture .am-plat-icon { transform: scale(1) !important; } #alfred-site .am-capture .am-plat-icon:hover { transform: scale(1.24) !important; } #alfred-site .am-capture .am-plat-icon.is-selected { transform: scale(1.18) !important; } #alfred-site .am-capture .am-plat-icon:focus-visible { outline: 2px solid #442B22; outline-offset: 2px; } /* Collapsed controls must not intercept pointer input. */ #alfred-site .am-capture.is-chosen .am-plat-icon:not(.is-selected) { pointer-events: none !important; } /* v2: append after current capture rules. Capture-only, no JS/HTML changes. */ /* This painted sibling sits BEHIND the backdrop-filter, not inside it. No opacity/filter/mask on the parent: do not establish a backdrop root. */ #alfred-site .am-capture::before { content: "" !important; position: absolute !important; inset: 1px !important; z-index: 0 !important; border-radius: 100px !important; pointer-events: none !important; background: radial-gradient(ellipse at 77% 90%, rgba(246,139,66,.42), transparent 52%), radial-gradient(ellipse at 22% 0%, rgba(239,228,210,.24), transparent 47%), linear-gradient(115deg, transparent 15%, rgba(206,221,74,.15) 43%, rgba(68,43,34,.14) 62%, transparent 82%) !important; filter: none !important; opacity: 1 !important; transform: none !important; box-shadow: none !important; } #alfred-site .am-capture .am-capture-inner { position: relative !important; z-index: 1 !important; background: linear-gradient(116deg, rgba(255,255,255,.17), rgba(255,255,255,.035) 30%, transparent 51%, rgba(255,255,255,.065) 72%, transparent) !important; border: 1px solid transparent !important; border-top-color: rgba(255,255,255,.32) !important; border-left-color: rgba(255,255,255,.20) !important; border-bottom-color: rgba(68,43,34,.15) !important; border-right-color: rgba(68,43,34,.08) !important; box-shadow: inset 0 1px 1px rgba(255,255,255,.16), inset 0 -2px 4px rgba(68,43,34,.10), 0 7px 14px -5px rgba(68,43,34,.24) !important; -webkit-backdrop-filter: blur(14px) !important; backdrop-filter: blur(14px) !important; } /* A directional surface reflection, above the glass but below the controls. */ #alfred-site .am-capture .am-capture-inner::before { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(113deg, transparent 12%, rgba(255,255,255,.10) 24%, rgba(255,255,255,.015) 36%, transparent 46%); } #alfred-site .am-capture .am-capture-inner:focus-within { border-color: rgba(68,43,34,.22) !important; } /* v3 optical rim delta. Append after approved v2 + espresso rules. No new motion, script, size, typography or backdrop-color changes. */ #alfred-site .am-capture .am-capture-inner { /* Clear central lens; reflection is concentrated near the curved edges. */ background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.015) 26%, transparent 60%, rgba(68,43,34,.025)) !important; border-color: rgba(68,43,34,.08) !important; box-shadow: inset 0 1px 1px rgba(255,255,255,.28), inset 0 -2px 3px rgba(68,43,34,.12), inset 2px 0 3px rgba(255,255,255,.12), 0 2px 3px -1px rgba(68,43,34,.17), 0 9px 17px -8px rgba(68,43,34,.23) !important; } #alfred-site .am-capture .am-capture-inner::before { /* End-cap reflections: transparent across the readable central area. */ inset: 1px; background: radial-gradient(ellipse 12% 80% at 0% 36%, rgba(255,255,255,.30), transparent 75%), radial-gradient(ellipse 10% 75% at 100% 70%, rgba(255,255,255,.15), transparent 78%); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 -1px 0 rgba(255,255,255,.14); } /* A 1px annular highlight, masked only on this decorative overlay. The actual backdrop-filter layer and its ancestors are not masked. */ #alfred-site .am-capture .am-capture-inner::after { content: ""; position: absolute; inset: -1px; padding: 1px; border-radius: inherit; pointer-events: none; background: conic-gradient(from 225deg, rgba(255,255,255,.05), rgba(255,255,255,.73) 12%, rgba(255,255,255,.38) 29%, transparent 43%, rgba(68,43,34,.18) 56%, rgba(255,255,255,.55) 68%, rgba(255,255,255,.08) 82%, transparent); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: exclude; } @supports not ((mask-composite: exclude) or (-webkit-mask-composite: xor)) { #alfred-site .am-capture .am-capture-inner::after { display: none; } } /* v4: capture-only espresso backdrop, restrained rim, opaque foreground. */ #alfred-site .am-capture::before { background: radial-gradient(ellipse at 76% 92%, rgba(68,43,34,.16), transparent 56%), radial-gradient(ellipse at 19% 0%, rgba(255,255,255,.10), transparent 46%), linear-gradient(115deg, transparent 24%, rgba(68,43,34,.08) 62%, transparent 88%) !important; } #alfred-site .am-capture .am-capture-inner { box-shadow: inset 0 1px 1px rgba(255,255,255,.18), inset 0 -2px 3px rgba(68,43,34,.12), 0 2px 3px -1px rgba(68,43,34,.15), 0 9px 17px -8px rgba(68,43,34,.22) !important; } #alfred-site .am-capture .am-capture-inner::before, #alfred-site .am-capture .am-capture-inner::after { z-index: 0; pointer-events: none; } #alfred-site .am-capture .am-capture-inner::before { background: radial-gradient(ellipse 10% 80% at 0% 36%, rgba(255,255,255,.18), transparent 75%), radial-gradient(ellipse 9% 75% at 100% 70%, rgba(255,255,255,.10), transparent 78%); box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 -1px 0 rgba(255,255,255,.08); } #alfred-site .am-capture .am-capture-inner::after { background: conic-gradient(from 225deg, transparent, rgba(255,255,255,.38) 12%, rgba(255,255,255,.16) 29%, transparent 43%, rgba(68,43,34,.16) 56%, rgba(255,255,255,.24) 68%, transparent 82%); } /* Direct foreground siblings paint ABOVE both optical overlays. */ #alfred-site .am-capture .am-plat-row, #alfred-site .am-capture .am-capture-field { position: relative !important; z-index: 2 !important; filter: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } #alfred-site .am-capture .am-plat-row { opacity: 1 !important; } #alfred-site .am-capture:not(.is-chosen) .am-plat-icon.is-preselected:not(:hover):not(:active):not(.is-selected), #alfred-site .am-capture:not(.is-chosen) .am-plat-icon, #alfred-site .am-capture.is-chosen .am-plat-icon.is-selected { opacity: 1 !important; color: #442B22 !important; filter: none !important; } #alfred-site .am-capture .am-plat-icon svg { opacity: 1 !important; filter: none !important; } /* Existing hidden-icon collapse and field reveal behavior remain intact. */ /* Capture-only composer, appended after visual.css. */ #alfred-site .am-capture { display:flex!important; align-items:center; gap:10px; width:100%!important; max-width:580px!important; position:relative; } #alfred-site .am-capture::before {display:none!important;} #alfred-site .am-capture .am-plat-row {display:grid!important;grid-template-columns:repeat(2,32px);gap:2px!important;flex:0 0 66px!important;width:66px!important;max-width:none!important;margin:0!important;padding:0!important;overflow:visible!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon, #alfred-site .am-capture.is-chosen .am-plat-row .am-plat-icon:not(.is-selected) {width:32px!important;min-width:32px!important;max-width:32px!important;height:32px!important;margin:0!important;padding:4px!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;flex:0 0 32px!important;filter:none!important;color:#442B22!important;border:1px solid transparent!important;border-radius:10px!important;transition:background .15s!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon.is-selected {background:rgba(68,43,34,.16)!important;border-color:#442B22!important;box-shadow:0 1px 2px rgba(68,43,34,.16);} #alfred-site .am-capture .am-plat-row .am-plat-icon:hover {background:rgba(68,43,34,.09)!important;} #alfred-site .am-capture .am-capture-inner {flex:1!important;min-width:0!important;width:auto!important;height:66px!important;padding:0 8px 0 15px!important;border-radius:33px!important;overflow:visible!important;background:linear-gradient(150deg,rgba(255,255,255,.15),rgba(68,43,34,.055))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.30),0 5px 8px -6px rgba(68,43,34,.38)!important;} #alfred-site .am-capture .am-capture-inner::before,#alfred-site .am-capture .am-capture-inner::after {display:none!important;} #alfred-site .am-capture .am-capture-field {display:flex!important;align-items:center;gap:8px;opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;position:relative!important;height:100%;overflow:visible!important;} #alfred-site .am-capture .am-capture-input {flex:1!important;min-width:0!important;width:100%!important;height:44px!important;padding:0!important;margin:0!important;opacity:1!important;background:transparent!important;border:0!important;color:#442B22!important;font-size:16px!important;} #alfred-site .am-capture .am-capture-input:disabled {visibility:hidden;} #alfred-site .am-composer-instruction {position:absolute;left:0;right:52px;font-size:13px;line-height:1.25;color:#442B22;pointer-events:none;} #alfred-site .is-chosen .am-composer-instruction {display:none;} #alfred-site .am-capture .am-capture-submit {display:block!important;position:static!important;flex:0 0 44px!important;width:44px!important;height:44px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:#442B22!important;color:#FFFAF0!important;font:600 12px/44px sans-serif!important;opacity:1!important;transform:none!important;cursor:pointer;} #alfred-site .am-capture .am-capture-submit:disabled {background:rgba(68,43,34,.14)!important;color:#442B22!important;cursor:default;} #alfred-site .am-capture button:focus-visible,#alfred-site .am-capture input:focus-visible {outline:2px solid #442B22!important;outline-offset:3px!important;} #alfred-site .am-composer-status {position:absolute;top:calc(100% + 5px);left:76px;font-size:11px;color:#442B22;} @media(min-width:1200px){#alfred-site .am-capture .am-plat-row{grid-template-columns:repeat(4,32px);flex-basis:134px!important;width:134px!important;}#alfred-site .am-composer-status{left:144px;}} /* Approved unified chat/reminder modes. One input and one glass pill. */ #alfred-site .am-capture {display:block!important;} #alfred-site .am-compose-line {display:flex;align-items:center;gap:10px;} #alfred-site .am-capture[data-mode="chat"] .am-plat-row,#alfred-site .am-capture[data-mode="chat"] .am-composer-instruction {display:none!important;} #alfred-site .am-composer-tabs {display:flex;gap:20px;margin:0 0 7px 8px;} #alfred-site .am-composer-tabs button {background:none;border:0;border-bottom:1px solid transparent;padding:5px 0;color:#442B22;font:500 13px/1.3 sans-serif;cursor:pointer;} #alfred-site .am-composer-tabs button[aria-selected="true"] {border-bottom-color:#442B22;font-weight:700;} #alfred-site .am-demo-label {font:11px/1.3 sans-serif;color:#442B22;margin:0 0 9px 8px;} #alfred-site .am-capture .am-capture-inner {height:58px!important;} #alfred-site .am-composer-status {position:static;display:block;font:11px/1.4 sans-serif;margin:7px 8px 0;} #alfred-site .am-composer-status:empty {display:none;} #alfred-site .am-conversation {max-height:180px;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:8px;padding:8px 2px 12px;} #alfred-site .am-conversation[hidden] {display:none;} #alfred-site .am-demo-bubble {align-self:flex-end;max-width:85%;margin:0;padding:9px 13px;border-radius:16px 16px 4px 16px;background:rgba(68,43,34,.10);color:#442B22;font:14px/1.4 sans-serif;overflow-wrap:anywhere;white-space:pre-wrap;} /* Fio: inline icons inside pill, centered lower caption. */ #alfred-site .am-capture .am-capture-inner {display:flex!important;align-items:center;gap:10px!important;} #alfred-site .am-capture .am-plat-row {display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;flex:0 0 134px!important;width:134px!important;gap:2px!important;} #alfred-site .am-capture[data-mode="chat"] .am-plat-row {display:none!important;} #alfred-site .am-capture .am-capture-field {flex:1!important;width:auto!important;} #alfred-site .am-hero-copy > .am-no-spam {width:100%!important;max-width:580px!important;margin:16px 0 0!important;text-align:center!important;font-size:16px!important;line-height:1.4!important;} @media(max-width:600px){ #alfred-site .am-capture .am-capture-inner {padding-left:8px!important;gap:5px!important;} #alfred-site .am-capture .am-plat-row {flex-basis:110px!important;width:110px!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon,#alfred-site .am-capture.is-chosen .am-plat-row .am-plat-icon:not(.is-selected){width:26px!important;min-width:26px!important;max-width:26px!important;flex-basis:26px!important;padding:2px!important;} #alfred-site .am-composer-instruction {font-size:11px!important;} } /* Horizontal selection collapse, right to left. */ #alfred-site .am-capture .am-plat-row {--icon-step:34px;--icon-size:32px;position:relative!important;height:32px!important;transition:width .32s ease,flex-basis .32s ease!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon {position:absolute!important;left:0!important;top:0!important;transform:translateX(calc(var(--i)*var(--icon-step)))!important;transition:transform .32s ease,opacity .22s ease,visibility .32s!important;} #alfred-site .am-plat-icon:nth-child(1){--i:0}#alfred-site .am-plat-icon:nth-child(2){--i:1}#alfred-site .am-plat-icon:nth-child(3){--i:2}#alfred-site .am-plat-icon:nth-child(4){--i:3} #alfred-site .am-capture.is-chosen .am-plat-row {width:var(--icon-size)!important;flex-basis:var(--icon-size)!important;} #alfred-site .am-capture.is-chosen .am-plat-row .am-plat-icon.is-selected {transform:translateX(0)!important;} #alfred-site .am-capture.is-chosen .am-plat-row .am-plat-icon:not(.is-selected) {transform:translateX(-12px)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;} @media(max-width:600px){#alfred-site .am-capture .am-plat-row{--icon-step:28px;--icon-size:26px;}} @media(prefers-reduced-motion:reduce){#alfred-site .am-capture .am-plat-row,#alfred-site .am-capture .am-plat-row .am-plat-icon{transition:none!important;}} /* Fio polish: no rectangular focus box, paper-plane send, brand accents. */ #alfred-site .am-capture input.am-capture-input:focus,#alfred-site .am-capture input.am-capture-input:focus-visible {outline:none!important;box-shadow:none!important;} #alfred-site .am-capture .am-capture-inner:focus-within {outline:none!important;outline-offset:0;} #alfred-site .am-capture .am-plat-row .am-plat-icon.is-selected,#alfred-site .am-capture .am-plat-row .am-plat-icon:hover {background:transparent!important;border-color:transparent!important;box-shadow:none!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon[data-plat="whatsapp"] {color:#25D366!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon[data-plat="telegram"] {color:#229ED9!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon[data-plat="imessage"] {color:#34C759!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon[data-plat="email"] {color:#007AFF!important;} #alfred-site .am-capture .am-capture-submit,#alfred-site .am-capture .am-capture-submit:hover,#alfred-site .am-capture .am-capture-submit:disabled {display:flex!important;align-items:center;justify-content:center;background:transparent!important;color:#442B22!important;box-shadow:none!important;} #alfred-site .am-capture .am-capture-submit:disabled {opacity:.45!important;} #alfred-site .am-hero-copy > .am-no-spam {font-size:17.6px!important;font-weight:700!important;} /* Larger, tighter app glyphs. */ #alfred-site .am-capture .am-plat-row {--icon-step:30px;flex-basis:122px!important;width:122px!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon {padding:1px!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon svg {width:22px!important;height:22px!important;max-width:none!important;} #alfred-site .am-capture .am-plat-row .am-plat-icon[data-plat="email"] {color:#EA4335!important;} #alfred-site .am-capture.is-chosen .am-plat-row {width:var(--icon-size)!important;flex-basis:var(--icon-size)!important;} @media(max-width:600px){#alfred-site .am-capture .am-plat-row{--icon-step:26px;flex-basis:104px!important;width:104px!important;}#alfred-site .am-capture .am-plat-row .am-plat-icon svg{width:20px!important;height:20px!important;}#alfred-site .am-capture.is-chosen .am-plat-row{width:var(--icon-size)!important;flex-basis:var(--icon-size)!important;}} /* Espresso glass depth remains behind opaque foreground controls. */ #alfred-site .am-no-spam[hidden]{display:none!important;} #alfred-site .am-capture .am-capture-inner {isolation:isolate;position:relative!important;background:linear-gradient(155deg,rgba(255,255,255,.19) 0%,rgba(68,43,34,.035) 42%,rgba(68,43,34,.15) 100%)!important;box-shadow:inset 0 1px 1px rgba(255,255,255,.58),inset 0 -2px 3px rgba(68,43,34,.22),inset 1px 0 1px rgba(255,255,255,.26),0 7px 12px -7px rgba(68,43,34,.4)!important;} #alfred-site .am-capture .am-capture-inner::before {content:"";display:block!important;position:absolute!important;inset:0!important;border-radius:inherit;z-index:0!important;pointer-events:none;background:linear-gradient(170deg,rgba(255,255,255,.22),transparent 32%,transparent 70%,rgba(68,43,34,.07));} #alfred-site .am-capture .am-capture-inner > .am-plat-row,#alfred-site .am-capture .am-capture-inner > .am-capture-field {position:relative!important;z-index:2!important;filter:none!important;opacity:1!important;} /* Brown-only optical layers; black foreground. */ #alfred-site .am-capture .am-capture-inner {background:linear-gradient(155deg,rgba(68,43,34,.025),rgba(68,43,34,.065) 45%,rgba(68,43,34,.18))!important;border:1px solid rgba(68,43,34,.22)!important;box-shadow:inset 0 1px 1px rgba(68,43,34,.10),inset 0 -2px 3px rgba(68,43,34,.26),inset 1px 0 1px rgba(68,43,34,.08),0 7px 12px -7px rgba(68,43,34,.4)!important;} #alfred-site .am-capture .am-capture-inner::before {background:linear-gradient(170deg,rgba(68,43,34,.045),transparent 32%,transparent 70%,rgba(68,43,34,.08))!important;box-shadow:none!important;border:none!important;} #alfred-site .am-capture .am-capture-input,#alfred-site .am-capture .am-composer-instruction,#alfred-site .am-capture .am-capture-submit,#alfred-site .am-capture .am-capture-submit:hover,#alfred-site .am-capture .am-capture-submit:disabled {color:#000!important;-webkit-text-fill-color:#000!important;} #alfred-site .am-capture .am-capture-input::placeholder {color:#000!important;-webkit-text-fill-color:#000!important;opacity:1!important;} #alfred-site .am-capture .am-capture-submit:disabled {opacity:1!important;} /* Trim unused right-hand space without changing type or height. */ #alfred-site .am-capture {max-width:420px!important;} #alfred-site .am-capture[data-mode="chat"] {max-width:340px!important;} #alfred-site .am-hero-copy > .am-no-spam {max-width:420px!important;} /* Collapse spare width with the selected email icon. */ #alfred-site .am-capture.is-chosen:has([data-plat="email"].is-selected){max-width:280px!important;} /* Reminder caption keeps its full width when the input contracts. */ /* Shared app selection in both modes. */ #alfred-site .am-capture[data-mode="chat"] {max-width:420px!important;} #alfred-site .am-capture[data-mode="chat"] .am-plat-row {display:flex!important;} #alfred-site .am-capture[data-mode="chat"]:not(.is-chosen) .am-composer-instruction {display:block!important;} #alfred-site .am-capture[data-mode="chat"].is-chosen .am-composer-instruction {display:none!important;} #alfred-site .am-capture.is-chosen .am-plat-row .am-plat-icon.is-selected {transform:translateX(0) scale(1.18)!important;} @media(hover:hover){#alfred-site .am-capture:not(.is-chosen) .am-plat-row .am-plat-icon:hover {transform:translateX(calc(var(--i)*var(--icon-step))) scale(1.24)!important;}}