:root {
--color-red: #d90000;
--color-red-dark: #b90000;
--color-orange: #ff7100;
--color-orange-light: #fff2df;
--color-navy: #222222;
--color-blue: #168fc4;
--color-blue-light: #eaf8ff;
--color-green: #19a83b;
--color-green-light: #eaf8ed;
--color-purple: #7d2cac;
--color-purple-light: #f6ecfb;
--color-gray-text: #333333;
--color-gray-sub: #666666;
--color-gray-border: #dddddd;
--color-gray-light: #f7f7f7;
--color-white: #ffffff;
--content-width: 1080px;
}
* {
box-sizing: border-box;
}
body {
overflow-x: hidden;
}
.stronger{
color: var(--color-orange);
}
.indentation{
text-indent: -1em;
padding-left: 1em;
display: inline-block;
}
a {
color: inherit;
text-decoration: none !important;
transition: all 0.3s;
}
a:hover {
opacity: 0.7;
}
img {
max-width: 100%;
height: auto;
}
.container {
width: calc(950px);
max-width: 100%;
margin-right: auto;
margin-left: auto;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.skip {
position: fixed;
top: -60px;
left: 12px;
z-index: 999;
padding: 8px 14px;
background: var(--color-white);
}
.skip:focus {
top: 10px;
}
.sp-only {
display: none;
} #header{
height: 123px;
padding-top: 20px;
}
#contents.subPage {
max-width: 950px;
width: auto;
}
.site-header {
position: relative;
z-index: 100;
background: var(--color-white);
border-bottom: 1px solid #cfcfcf;
}
.header-inner {
display: flex;
align-items: center;
width: calc(100% - 40px);
max-width: var(--content-width);
min-height: 74px;
margin: 0 auto;
}
.brand {
display: flex;
align-items: center;
gap: 8px;
color: var(--color-orange);
font-size: 25px;
font-weight: 700;
white-space: nowrap;
}
.brand-mark {
display: grid;
place-items: center;
width: 40px;
height: 40px;
border: 2px solid var(--color-orange);
border-radius: 50%;
font-size: 17px;
}
.global-nav {
display: flex;
align-self: stretch;
margin-left: auto;
}
.global-nav a {
display: flex;
align-items: center;
padding: 0 14px;
color: #3f3a35;
border-left: 1px solid #eeeeee;
font-size: 13px;
font-weight: 700;
}
.global-nav a:hover,
.global-nav a.current {
color: var(--color-white);
background: var(--color-orange);
}
.header-cta {
display: flex;
align-items: center;
min-height: 42px;
margin-left: 12px;
padding: 8px 18px;
color: var(--color-white);
background: var(--color-orange);
border-radius: 22px;
font-weight: 700;
}
.menu-button,
.mobile-nav {
display: none;
} .hero {
position: relative;
overflow: hidden;
background: var(--color-white); }
.hero-bg {
display: none;
}
.hero-grid {
display: block;
min-height: 0; }
.breadcrumb {
margin: 0 0 18px;
color: var(--color-gray-sub);
font-size: 12px;
}
.breadcrumb span {
margin: 0 8px;
}
.hero h1 {
border-left: 5px solid #ff7301;
padding-left: 15px !important;
padding-top: 0px;
padding-bottom: 0px;
font-size: 28px;
font-weight: bold;
}
.lead {
margin: 0;
padding: 17px 20px;
color: #222222;
background: var(--color-orange-light);
border-left: 3px solid var(--color-orange);
font-size: 16px;
font-weight: 700;
}
.lead strong {
color: var(--color-red);
font-size: 1em;
}
.hero-copy > p:last-child {
margin: 0;  font-size: 16px;
line-height: 1.6;
margin-top: 15px;
}
.hero-panel {
margin-top: 22px;
padding: 20px;
background: var(--color-gray-light);
border: 1px solid var(--color-gray-border);
border-radius: 6px;
box-shadow: none;
}
.features {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 12px;
margin-bottom: 18px;
}
.features > div {
display: flex;
align-items: center;
min-height: 74px; color: #222222;
background: var(--color-white);
border: 1px solid var(--color-gray-border);
font-size: 16px;
line-height: 1.5;
}
.feature-icon {
display: grid;
place-items: center;    color: var(--color-orange);
border: 2px solid var(--color-orange);
border-radius: 50%; background: #fff;
}
.feature-cell .stronger {
color: var(--color-orange);
font-size: 20px;
}
.feature-cell strong{
letter-spacing: -0.05em;
}
.features em {
color: var(--color-red);
font-style: normal;
}
.hero-actions {
display: flex; gap: 15px;
} .button {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 48px;
padding: 0px 0px;
border-radius: 64px;
font-weight: 700;
line-height: 1.4;
text-align: center;
}
.button span:last-child {
margin-left: 14px;
}
.button-primary {
color: var(--color-white) !important;
background: var(--color-orange);
border: 1px solid var(--color-orange);
box-shadow: none;
}
.button-primary:hover { opacity: 0.8;
}
.button.button-primary.track-web{
position: relative; }
.button.button-primary.track-web .la-angle-right::before {
position: absolute;
right: 15px;
top: calc(50% - 8px);
}
.button-outline {
color: var(--color-orange) !important;
background: var(--color-white);
border: 1px solid var(--color-orange);
}
.button-outline:hover {  opacity: 0.8;
}
.button-faq{
width: 240px;
font-size: 15px;
min-height: 40px;
position: relative;
}
.button-faq .la-angle-right::before {
position: absolute;
right: 15px;
top: calc(50% - 8px);
}
.button-large { min-height: 48px;
font-size: 17px; }
.button.button-outline.button-large{
margin-top: 15px;
} .section {
margin-top: 30px;
padding-top: 0;
padding-bottom: 0;
}
.section-tint {
background: var(--color-white);
}
.section-heading {
display: block; }
.section-heading > span {
display: none;
}
.section-heading p,
.eyebrow {
display: none;
}
.section-heading h2 {
margin: 0;
padding: 2px 0px 2px 15px;
color: #111111;
border-left: 5px solid var(--color-orange); font-size: 24px;
line-height: 1.5;
}
.section-intro {
font-size: 16px;
margin-top: 15px; } .steps {
display: grid;
grid-template-columns: 1fr;
gap: 16px;
margin-top: 48px;
}
.step-card {
position: relative;
display: grid;
grid-template-columns: 82px 1fr auto;
column-gap: 16px;
min-height: 0;
padding: 0 20px 20px;
background: var(--color-white);
border: 1px solid var(--color-gray-border);
border-radius: 6px; }
.step-card::after{
content: "";
position: absolute;
width: 22px;
height: 32px;
background: #ffc390;
clip-path: polygon(0 0, 100% 50%, 0 100%);
top: calc(50% - 20px);
right: calc(-22px + 0px);
transform-origin: 0% 50%;
transform: rotate(0deg);
z-index: 1;
}
.step-card:last-of-type::after{
width: 0;
height: 0;
background: none;
}
.step-number {
position: relative;
z-index: 2;
font-size: 14px; width: 80px;
height: 80px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-left: auto;
margin-right: auto;
background: #ff7100;
border-radius: 100%;
color: #fff;
line-height: 1.1;
margin-top: -42px;
border: 4px solid #fff;
}
.step-number b {
display: grid;
place-items: center;
width: 38px;
height: 38px;
margin-top: -3px;
color: var(--color-white);
background: var(--color-blue);
border-radius: 50%;
font-size: 18px;
}
.step-number strong{
font-size: 24px;
}
.step-card h3 {
grid-column: 2 / -1;
margin: 0 0 8px;
color: #111111;
font-size: 20px;
}
.step-card p {
grid-column: 2 / -1;
margin: 0 0 7px;
font-size: 14px;
}
.step-card .button,
.step-card .text-link {
grid-column: 2;
justify-self: start;
margin-top: 8px;
}
.step-illustration{
display: flex;
justify-content: center;
align-items: center;
font-size: 64px;
color: var(--color-orange);
margin-bottom: 5px;
margin-top: 15px;
}
.text-link {
color: #ff7100 !important;
font-weight: bold;
text-decoration: underline; display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.text-link .la-play{
font-size: 20px;
margin-right: 2px
}
.text-link .la-angle-right::before {
position: absolute;
right: 15px;
top: calc(50% - 8px);
} .docs-grid {
display: grid;
grid-template-columns: 2fr 1fr;
grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
gap: 20px;
margin-top: 20px;
}
.table-wrap {
overflow-x: auto;
background: var(--color-white);
border: 1px solid var(--color-gray-border);
border-radius: 4px;
}
table {
width: 100%;
border-collapse: collapse; }
th,
td {
font-size: 15px;
padding: 15px 15px;
text-align: left;
vertical-align: middle;
border-right: 1px solid var(--color-gray-border);
border-bottom: 1px solid var(--color-gray-border);
}
tr:last-child th,
tr:last-child td {
border-bottom: 0;
}
th:last-child,
td:last-child {
border-right: 0;
}
thead th { background: #eee;
font-weight: bold; text-align: center;
font-size: 18px; }
tbody th {
width: 35%; background: #fafafa; }
thead {
border-bottom: 1px solid var(--color-gray-border);
}
.info-card {
padding: 20px;
background: #fff8f2;
border: 1px solid #ffc390;
border-radius: 4px;
}
.info-card h3,
.credit-card h3 {   border-bottom: 2px solid var(--color-orange); }
.info-icon {
display: none;
}
.check-list {
margin: 0;
padding: 0px 0px 0px 20px;  }
.check-list li::marker {
color: var(--color-orange);
}
.check-list li::before {
display: none;
}
.credit-card {
display: grid;
grid-template-columns: 1.5fr 1fr;
gap: 20px;
align-items: center;
margin-top: 16px;
padding: 20px;
background: #ffffff;
border: 1px solid #dddddd;
border-radius: 4px;
}
.credit-card p {
margin: 0;
}
.note {
margin-top: 10px !important; font-size: 12px;
}
.card-brands {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0px;
align-items: center;
}
.card-brands span {
padding: 15px 15px;
color: #333333;
background: var(--color-white);    } .option-grid-header{
width: 950px;
margin-left: auto;
margin-right: auto;
}
.option-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
.option-card {
display: grid;
grid-template-columns: 135px 1fr;
gap: 15px;
padding: 16px;
background: var(--color-white);
border: 1px solid #dddddd;
border-radius: 10px; }
.option-card h3 {
margin: 0px 0 0px; font-size: 18px;
}
.option-card p { font-size: 15px;
margin-top: 15px;
}
.option-card .button {
width: 100%;
min-height: 40px;
padding: 0px 0px;
font-size: 16px;
margin-top: 15px;
width: 100%;
font-size: 15px;
position: relative;
display: flex;
align-items: center;
letter-spacing: -0.04em;
}
.option-visual {
position: relative;    overflow: hidden;
background: #eef8ff; border-radius: 5px;
}
.option-visual::before,
.option-visual::after {
content: "";
position: absolute;
}
.tour::before {
top: 20px;
left: 19px;
width: 88px;
height: 62px;
background: #ceeafa;
border: 7px solid var(--color-white);
}
.tour::after {
right: 12px;
bottom: 30px;
left: 12px;
height: 20px;
background: #d69b72;
}
.mail {
background: #fff7ec;
border-color: #f2ddc0;
}
.mail::before {
top: 15px;
left: 25px;
width: 72px;
height: 90px;
background: var(--color-white);
border: 1px solid #cccccc;
transform: rotate(-5deg);
}
.mail::after {
right: 10px;
bottom: 25px;
width: 38px;
height: 48px;
border: 2px solid var(--color-red);
}
.option-visual span {
position: relative;
z-index: 2;
padding: 3px 7px;
color: var(--color-white);
background: var(--color-orange);
font-size: 11px;
font-weight: 700;
}
.help-bar {
display: grid;
grid-template-columns: 64px 1fr auto;
gap: 15px;
align-items: center;
margin-top: 20px;
padding: 18px 20px;
background: #fff8f2;
border: 1px solid #ffc390;
border-radius: 10px;
}
.help-icon {
display: grid;
place-items: center;
width: 64px;
height: 64px;
color: var(--color-orange);  font-size: 64px;
font-weight: 700;
}
.mobile-help-icon {
display: none;
}
.help-bar h3,
.help-bar p {
margin: 0;
}
.help-bar h3 { font-size: 20px;
font-weight: bold;
}
.help-bar p{
font-size: 15px;
margin-top: 5px;
letter-spacing: -0.04em;
letter-spacing: revert-layer;
letter-spacing: revert-layer;
letter-spacing: -0.04em;
}
.video-link {
margin: 20px 0 0;
text-align: center;
font-size: 16px;
} .final-cta {
padding: 15px;
margin-top: 20px;
background: #fff8f2;
border: 1px solid #ffc390;
border-radius: 10px;
}
.final-grid {
display: grid;
grid-template-columns: 1fr 380px; align-items: center;
}
.final-grid h2 {  font-size: 24px;
font-weight: bold;
}
.final-grid p {
margin: 0;
}
.legal-links {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px 15px;
margin-top: 20px;
margin-bottom: 20px;
color: #666666;
font-size: 15px;
}
.legal-links a {
text-decoration: underline;
font-weight: 700;
color: var(--color-orange);
display: inline-flex;
align-items: center;
}
.legal-links .las.la-file-pdf {
margin-right: 2px;
font-size: 20px;
}
footer {
padding: 22px 0;
color: var(--color-white);
background: #594c43;
}
.footer-inner {
display: flex;
align-items: center;
gap: 25px;
}
.footer-brand {
color: var(--color-white);
font-size: 18px;
}
.footer-brand .brand-mark {
width: 31px;
height: 31px;
color: var(--color-white);
border-color: var(--color-white);
font-size: 13px;
}
.footer-inner p {
margin-right: auto;
}
.footer-inner > a:last-child {
font-size: 12px;
text-decoration: underline;
}
.sticky-cta {
display: none;
}
.final-cta-buttons{
display: flex;
flex-direction: column;
}  .hero {
background:
linear-gradient(
90deg,
#ffffff 0%,
#ffffff 58%,
#fff8ef 58%,
#fff8ef 100%
);
}
.hero-grid {
display: grid;
grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr); align-items: center;  }
.hero-copy {
min-width: 0;
}
.lead {
padding: 0;
color: #222222;
background: transparent;
border-left: 0;
font-size: 19px;
}
.lead strong {
color: var(--color-orange);
font-size: 1.05em;
}
.hero-panel {
margin-top: 36px;
padding: 18px;
background: rgba(255, 255, 255, 0.96);
border: 1px solid #efcda8;
border-radius: 10px;
}
.features {
grid-template-columns: 1fr;
gap: 0;
margin-bottom: 16px;
}
.features > div { padding: 0px 10px;
border: 0;
border-bottom: 1px solid #eeeeee;
}
.features > div:last-child {
border-bottom: 0;
}
.feature-icon { width: 54px;
height: 54px;
padding: 5px;
margin-right: 10px; }
.hero-actions {
display: grid; }
.hero-actions .button {
width: 100%;
font-size: 16px;
position: relative;
display: flex;
align-items: center;
letter-spacing: -0.04em;
}
.hero-actions .button .la-angle-right:before{
position: absolute;
right: 15px;
top: calc(50% - 8px);
} .section {
padding-top: 48px;
padding-bottom: 48px;
}
.section-heading h2 {
font-size: 26px;
} .steps {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
}
.step-card {
display: flex;
flex-direction: column;
min-height: 440px;
padding: 0 20px 20px;
border-radius: 10px;
}
.step-number b,
.step-card:nth-child(2) .step-number b,
.step-card:nth-child(3) .step-number b {
width: 36px;
height: 36px;
margin-top: 0;
color: var(--color-white);
background: var(--color-orange);
}
.step-card h3 {
margin-bottom: 10px;
color: #222222;
font-size: 19px;
text-align: center;
}
.step-card p {
margin-bottom: 0px;
margin-top: 10px;
}
.step-card .button,
.step-card .text-link {  width: 100%;
margin-top: auto;
font-size: 16px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.no-addr{
background: #fff;
border: 1px solid #dddddd;
border-radius: 4px;
padding: 4px 8px;
line-height: 1;
margin-left: 5px;
}
.use-addr{
background: #ff7100;
border: 1px solid #ff7100;
border-radius: 4px;
padding: 4px 8px;
line-height: 1;
color: #ffffff;
margin-left: 5px;
} .info-card h3,
.credit-card h3 {
border-bottom-color: var(--color-orange);
}
.credit-card {
grid-template-columns: minmax(0, 1.5fr) minmax(300px, 0.7fr);
} .option-card {
grid-template-columns: 150px 1fr;
}
.option-card .button:hover {
color: var(--color-white);
}
.option-card .button.button-outline .la-angle-right::before{
position: absolute;
right: 15px;
top: calc(50% - 8px);
}  .image-placeholder {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
.image-placeholder span {
position: static;
z-index: auto;
padding: 0;
color: #666666;
background: transparent;
font-size: 14px;
font-weight: 700;
}
.image-placeholder small {
display: block;
margin-top: 3px;
color: #888888;
font-size: 11px;
font-weight: 400;
} .hero {
background: var(--color-white);
}
.hero-grid {   align-items: stretch;  }
.hero-copy {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.breadcrumb {
margin-bottom: 14px;
}
.lead {
margin-bottom: 0px;
font-size: 20px;
margin-top: 15px;
}
.hero-photo-placeholder {
min-height: 240px;
aspect-ratio: 5 / 3;
}
.hero-photo-placeholder img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 10px;
}
.hero-panel {
grid-column: 1 / -1;
display: grid;
grid-template-columns: minmax(0, 1fr) 280px; align-items: center;
margin-top: 15px;
padding: 15px 15px 15px 5px;
background: #fff8f2;
border: 1px solid #ffc390;
}
.features {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0;
margin-bottom: 0;
}
.features > div {
min-height: 110px; background: transparent;
border-right: 1px solid #ffc390;
border-bottom: 0;
}
.features > div:last-child {
border-right: 0;
} .section {
margin-top: 30px;
padding-top: 0;
padding-bottom: 0;
}
.section-heading h2 {
font-size: 24px;
font-weight: bold;
} .steps {
gap: 20px;
}
.step-card {
min-height: 408px;
padding: 0px 20px 20px;
}
.step-card h3 {
font-size: 20px;
margin-bottom: 0;
font-weight: bold;
line-height: 1.2;
margin-top: 15px;
}
.step-card p {
font-size: 15px;
line-height: 1.5;
} .section-tint .container {
display: grid;
grid-template-columns: minmax(0, 1fr);
}
.table-wrap,
.info-card,
.credit-card {
border-radius: 10px;
}
.info-card h3,
.credit-card h3 {
margin-bottom: 15px;
padding-bottom: 5px;
font-size: 18px;
font-weight: bold;
}
.check-list {
padding-top: 0px;
padding-bottom: 0px;
font-size: 15px;
}
.check-list li{
margin-top: 15px;
}
.credit-card {
grid-template-columns: minmax(0, 2fr) minmax(296px, 1fr);
margin-top: 20px;
padding: 15px;
}
.credit-card p {
font-size: 15px;
} .option-grid {
gap: 20px;
width: 950px;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
}
.option-card {
grid-template-columns: 154px 1fr; padding: 15px;
}
.option-visual::before,
.option-visual::after,
.tour::before,
.tour::after,
.mail::before,
.mail::after {
display: none;
content: none;
}
.option-card h3 {
font-size: 20px;
font-weight: bold;
line-height: 1.5;
letter-spacing: -0.04em;
}
.option-card p {
line-height: 1.5;
}
.help-bar {
padding: 15px;
} .final-grid p {
font-size: 16px;
margin-top: 15px;
}
@media screen and (max-width: 540px) {
.hero {
overflow-x: clip;
}
.hero-grid {
width: 100%;
grid-template-columns: minmax(0, 1fr);
}
.hero-copy,
.hero-photo-placeholder,
.hero-panel,
.features,
.feature-cell,
.hero-actions {
min-width: 0;
}
.hero-panel {
grid-template-columns: minmax(0, 1fr);
}
.hero-actions .button {
min-width: 0;
white-space: normal;
}
.check-list li{
margin-top: 5px;
}
#contents.subPage{
width: auto;
padding-left: 10px;
padding-right: 10px;
}
#page-title br{
display: none;
}
.hero{
overflow: auto;
}
.hero-copy{
margin-top: 10px;
width: 100%;
max-width: 100%;
}
.hero-grid{
width: auto;
grid-template-columns: 1fr;
}
.hero-photo-placeholder{
min-height: auto;
background: url(https://entre-salon.com/wordpress/wp-content/themes/wp.vicuna/images/flow/flow_cover_img.png);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
border-radius: 10px;
margin-top: 10px;
}
.hero-panel{
grid-template-columns: 1fr;
padding: 15px 15px 15px 15px;
}
.hero-actions{
margin-top: 15px;
}
.features{
grid-template-columns: 1fr;
}
.features > div{
min-height: auto;
border-right: none;
margin-top: 10px;
padding: 0;
}
.features > div:first-of-type {
margin-top: 0px;
} .feature-cell .stronger{
font-size: 22px;
margin-left: 2px;
}
.steps{
grid-template-columns: 1fr;
}
.step-card{
min-height: auto;
padding: 0px 20px 20px;
margin-bottom: 48px;
}
.step-card::after{
top: inherit;
bottom: -24px;
right: inherit;
transform: rotate(90deg);
left: 50%;
width: 20px;
height: 48px;
}
.step-card:last-of-type{
margin-bottom: 0;
}
.option-grid {
width: auto;
grid-template-columns: repeat(1, 1fr);
}
.option-grid-header{
width: auto;
}
.docs-grid{
grid-template-columns: 1fr;
}
.help-bar{
grid-template-columns: 1fr;
}
.credit-card{
grid-template-columns: 1fr;
}
.option-card{
grid-template-columns: 1fr;
}
.image-placeholder img{
aspect-ratio: 16 / 9;
object-fit: cover;
}
.option-visual {
aspect-ratio: 16 / 9;
}
.option-visual img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.docs-grid th,
.docs-grid td{
padding: 12px 12px;
letter-spacing: -0.06em;
}
.docs-grid tbody th{
width: 40%;
}
.no-addr{
display: inline-block;
padding: 4px 4px;
}
.use-addr{
display: inline-block;
padding: 4px 4px;
}
.card-brands{
justify-content: space-between;
}
.card-brands span{
padding: 0px 0px;
}
.help-icon{
display: none;
}
.mobile-help-icon {
color: var(--color-orange);
display: inline-block;
margin-right: 4px;
font-size: 40px;
}
.help-bar h3{
display: inline-flex;
align-items: center;
justify-content: flex-start;
line-height: 1.2;
}
.final-cta{
width: auto;
}
.final-grid{
grid-template-columns: 1fr;
}
.final-cta-buttons{
margin-top: 15px;
}
.button-faq{
width: auto;
}
.legal-links {
margin-bottom: 0;
}
.legal-links span{
display: none;
}
.mobile-cv-links{
height: 86px;
}
.mobile-cv-links table td {
padding: 0px !important;
padding-right: 0px !important;
width: 33.333% !important;
text-align: center;
border: none;
}
}