/* =========================================================
ARCANUS OUTFITTERS — CONTACT US
FULL WIDTH • PREMIUM • ANIMATED
========================================================= */
.arcanus-contact-page{
--teal:#19aaa6;
--teal-dark:#087f7c;
--teal-deep:#045c5b;
--mint:#e7f8f7;
--mint-2:#d7f2f0;
--dark:#102f30;
--text:#526869;
--white:#fff;
--border:#d8eceb;
--shadow:0 22px 55px rgba(4,92,91,.12);
width:100vw !important;
max-width:100vw !important;
margin-left:calc(50% - 50vw) !important;
margin-right:calc(50% - 50vw) !important;
overflow:hidden;
background:#fff;
color:var(--dark);
font-family:Arial,Helvetica,sans-serif;
line-height:1.6;
}
.arcanus-contact-page *,
.arcanus-contact-page *::before,
.arcanus-contact-page *::after{
box-sizing:border-box;
}
.arcanus-contact-page a{
text-decoration:none;
}
.arcanus-contact-container{
width:min(1180px,92%);
margin:auto;
}
/* =========================================================
TOP STRIP
========================================================= */
.arcanus-contact-top{
padding:11px 20px;
background:var(--teal-deep);
color:#fff;
text-align:center;
font-size:11px;
font-weight:800;
letter-spacing:2.5px;
text-transform:uppercase;
}
/* =========================================================
HERO
========================================================= */
.arcanus-contact-hero{
position:relative;
min-height:610px;
display:flex;
align-items:center;
overflow:hidden;
background:
radial-gradient(
circle at 85% 25%,
rgba(25,170,166,.25),
transparent 30%
),
radial-gradient(
circle at 10% 85%,
rgba(25,170,166,.14),
transparent 30%
),
linear-gradient(
135deg,
#faffff 0%,
#eafafa 50%,
#d9f4f2 100%
);
}
.arcanus-contact-hero-grid{
position:relative;
z-index:3;
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center;
padding:90px 0;
}
.arcanus-contact-eyebrow{
display:inline-flex;
align-items:center;
gap:10px;
padding:9px 17px;
border:1px solid rgba(8,127,124,.2);
border-radius:50px;
background:rgba(255,255,255,.72);
color:var(--teal-dark);
font-size:11px;
font-weight:900;
letter-spacing:2px;
text-transform:uppercase;
margin-bottom:24px;
}
.arcanus-contact-eyebrow span{
width:7px;
height:7px;
border-radius:50%;
background:var(--teal);
box-shadow:
0 0 0 6px rgba(25,170,166,.12);
animation:contactPulse 2s infinite;
}
@keyframes contactPulse{
0%,100%{
box-shadow:0 0 0 5px rgba(25,170,166,.10);
}
50%{
box-shadow:0 0 0 10px rgba(25,170,166,.02);
}
}
.arcanus-contact-hero h1{
margin:0 0 20px;
font-size:clamp(48px,6vw,80px);
line-height:.95;
letter-spacing:-4px;
font-weight:900;
}
.arcanus-contact-hero h1 span{
color:var(--teal);
}
.arcanus-contact-hero h2{
margin:0 0 18px;
color:var(--teal-deep);
font-size:clamp(25px,3vw,38px);
line-height:1.12;
}
.arcanus-contact-hero p{
max-width:650px;
margin:0;
color:var(--text);
font-size:17px;
line-height:1.85;
}
.arcanus-contact-actions{
display:flex;
flex-wrap:wrap;
gap:14px;
margin-top:30px;
}
.arcanus-contact-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:53px;
padding:0 27px;
border-radius:50px;
font-size:11px;
font-weight:900;
letter-spacing:1px;
text-transform:uppercase;
transition:.35s ease;
}
.arcanus-contact-btn-primary{
background:var(--teal);
color:#fff !important;
box-shadow:
0 14px 30px rgba(25,170,166,.25);
}
.arcanus-contact-btn-primary:hover{
transform:translateY(-4px);
background:var(--teal-dark);
}
.arcanus-contact-btn-outline{
background:#fff;
border:1px solid rgba(8,127,124,.25);
color:var(--teal-dark) !important;
}
.arcanus-contact-btn-outline:hover{
transform:translateY(-4px);
background:var(--mint);
border-color:var(--teal);
}
/* =========================================================
HERO VISUAL
========================================================= */
.arcanus-contact-visual{
position:relative;
min-height:430px;
}
.arcanus-contact-circle{
position:absolute;
left:50%;
top:50%;
width:330px;
height:330px;
transform:translate(-50%,-50%);
border-radius:50%;
border:1px solid rgba(8,127,124,.17);
animation:contactRotate 18s linear infinite;
}
.arcanus-contact-circle::before{
content:"";
position:absolute;
inset:45px;
border-radius:50%;
border:1px dashed rgba(8,127,124,.18);
}
@keyframes contactRotate{
from{
transform:translate(-50%,-50%) rotate(0deg);
}
to{
transform:translate(-50%,-50%) rotate(360deg);
}
}
.arcanus-contact-center{
position:absolute;
left:50%;
top:50%;
width:205px;
height:205px;
transform:translate(-50%,-50%);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
border-radius:50%;
background:#fff;
border:1px solid rgba(25,170,166,.18);
box-shadow:
0 25px 65px rgba(4,92,91,.15);
text-align:center;
animation:contactFloat 4s ease-in-out infinite;
}
@keyframes contactFloat{
0%,100%{
transform:translate(-50%,-50%);
}
50%{
transform:translate(-50%,-57%);
}
}
.arcanus-contact-center small{
color:var(--teal);
font-size:10px;
font-weight:900;
letter-spacing:2px;
text-transform:uppercase;
}
.arcanus-contact-center strong{
margin-top:8px;
color:var(--dark);
font-size:25px;
line-height:1;
}
.arcanus-contact-center span{
margin-top:9px;
color:var(--teal-dark);
font-size:11px;
font-weight:800;
letter-spacing:1px;
}
.arcanus-contact-orbit{
position:absolute;
width:82px;
height:82px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:#fff;
border:1px solid rgba(25,170,166,.17);
box-shadow:
0 13px 30px rgba(4,92,91,.10);
color:var(--teal-dark);
font-size:9px;
font-weight:900;
text-align:center;
line-height:1.3;
animation:orbitContact 4s ease-in-out infinite;
}
.arcanus-contact-orbit.one{
left:30px;
top:35px;
}
.arcanus-contact-orbit.two{
right:25px;
top:60px;
animation-delay:1s;
}
.arcanus-contact-orbit.three{
left:35px;
bottom:35px;
animation-delay:2s;
}
.arcanus-contact-orbit.four{
right:20px;
bottom:30px;
animation-delay:3s;
}
@keyframes orbitContact{
0%,100%{
transform:translateY(0);
}
50%{
transform:translateY(-10px);
}
}
/* =========================================================
CONTACT INFORMATION
========================================================= */
.arcanus-contact-section{
padding:105px 0;
}
.arcanus-contact-section-soft{
background:#f5fbfb;
}
.arcanus-contact-heading{
max-width:780px;
margin:0 auto 60px;
text-align:center;
}
.arcanus-contact-kicker{
margin-bottom:12px;
color:var(--teal);
font-size:11px;
font-weight:900;
letter-spacing:2.5px;
text-transform:uppercase;
}
.arcanus-contact-heading h2{
margin:0 0 17px;
font-size:clamp(35px,4vw,54px);
line-height:1.05;
letter-spacing:-2px;
}
.arcanus-contact-heading p{
margin:0;
color:var(--text);
font-size:16px;
line-height:1.8;
}
/* =========================================================
INFORMATION CARDS
========================================================= */
.arcanus-contact-info-grid{
display:grid;
grid-template-columns:
repeat(2,1fr);
gap:22px;
}
.arcanus-contact-info-card{
position:relative;
min-height:245px;
padding:32px;
border-radius:25px;
background:#fff;
border:1px solid var(--border);
overflow:hidden;
box-shadow:
0 8px 30px rgba(4,92,91,.05);
transition:.4s ease;
}
.arcanus-contact-info-card::before{
content:"";
position:absolute;
width:150px;
height:150px;
right:-75px;
top:-75px;
border-radius:50%;
background:var(--mint);
transition:.45s ease;
}
.arcanus-contact-info-card:hover{
transform:translateY(-9px);
border-color:rgba(25,170,166,.35);
box-shadow:
0 22px 50px rgba(4,92,91,.11);
}
.arcanus-contact-info-card:hover::before{
transform:scale(1.65);
}
.arcanus-contact-icon{
position:relative;
z-index:2;
width:55px;
height:55px;
display:flex;
align-items:center;
justify-content:center;
border-radius:17px;
background:var(--mint);
color:var(--teal-dark);
font-size:21px;
margin-bottom:28px;
}
.arcanus-contact-info-card h3{
position:relative;
z-index:2;
margin:0 0 12px;
color:var(--teal-dark);
font-size:12px;
font-weight:900;
letter-spacing:1.7px;
text-transform:uppercase;
}
.arcanus-contact-info-card p{
position:relative;
z-index:2;
margin:0;
color:var(--text);
font-size:15px;
line-height:1.75;
}
.arcanus-contact-info-card strong{
color:var(--dark);
}
/* =========================================================
BUSINESS ENQUIRY
========================================================= */
.arcanus-contact-business{
display:grid;
grid-template-columns:
1fr 1fr;
gap:70px;
align-items:center;
}
.arcanus-contact-business-copy h2{
margin:0 0 18px;
font-size:clamp(35px,4vw,52px);
line-height:1.05;
letter-spacing:-2px;
}
.arcanus-contact-business-copy p{
margin:0;
color:var(--text);
font-size:16px;
line-height:1.85;
}
.arcanus-business-list{
display:grid;
gap:13px;
margin-top:28px;
}
.arcanus-business-list-item{
display:flex;
align-items:center;
gap:12px;
color:var(--text);
font-size:14px;
font-weight:700;
}
.arcanus-business-check{
width:26px;
height:26px;
flex:none;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
background:var(--mint);
color:var(--teal-dark);
font-size:13px;
font-weight:900;
}
.arcanus-business-box{
position:relative;
padding:45px;
border-radius:30px;
background:
linear-gradient(
145deg,
#e9faf9,
#d6f1ef
);
border:1px solid var(--border);
overflow:hidden;
}
.arcanus-business-box::after{
content:"";
position:absolute;
width:250px;
height:250px;
right:-110px;
bottom:-130px;
border-radius:50%;
border:1px solid rgba(4,92,91,.13);
}
.arcanus-business-box h3{
position:relative;
z-index:2;
margin:0 0 13px;
color:var(--teal-deep);
font-size:25px;
}
.arcanus-business-box p{
position:relative;
z-index:2;
margin:0 0 25px;
color:var(--text);
font-size:14px;
line-height:1.8;
}
.arcanus-business-box a{
position:relative;
z-index:2;
display:inline-flex;
align-items:center;
justify-content:center;
min-height:52px;
padding:0 25px;
border-radius:50px;
background:var(--teal);
color:#fff !important;
font-size:11px;
font-weight:900;
letter-spacing:1px;
transition:.35s ease;
}
.arcanus-business-box a:hover{
transform:translateY(-4px);
background:var(--teal-dark);
}
/* =========================================================
FIND US
========================================================= */
.arcanus-find-section{
background:#fff;
}
.arcanus-map-box{
position:relative;
min-height:420px;
display:flex;
align-items:center;
justify-content:center;
border-radius:32px;
overflow:hidden;
background:
linear-gradient(
135deg,
#e7f8f7,
#ccebe9
);
border:1px solid var(--border);
box-shadow:var(--shadow);
}
.arcanus-map-grid{
position:absolute;
inset:0;
opacity:.3;
background-image:
linear-gradient(
rgba(4,92,91,.12) 1px,
transparent 1px
),
linear-gradient(
90deg,
rgba(4,92,91,.12) 1px,
transparent 1px
);
background-size:45px 45px;
}
.arcanus-map-circle{
position:absolute;
width:300px;
height:300px;
border:1px solid rgba(4,92,91,.15);
border-radius:50%;
animation:mapPulse 3s infinite;
}
.arcanus-map-circle::before{
content:"";
position:absolute;
inset:45px;
border:1px dashed rgba(4,92,91,.15);
border-radius:50%;
}
@keyframes mapPulse{
0%,100%{
transform:scale(1);
opacity:.7;
}
50%{
transform:scale(1.08);
opacity:.35;
}
}
.arcanus-map-pin{
position:relative;
z-index:3;
width:125px;
height:125px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
border-radius:50%;
background:#fff;
box-shadow:
0 20px 55px rgba(4,92,91,.17);
color:var(--teal-dark);
text-align:center;
animation:pinFloat 3s ease-in-out infinite;
}
@keyframes pinFloat{
0%,100%{
transform:translateY(0);
}
50%{
transform:translateY(-8px);
}
}
.arcanus-map-pin-icon{
font-size:30px;
margin-bottom:4px;
}
.arcanus-map-pin strong{
font-size:11px;
letter-spacing:1px;
text-transform:uppercase;
}
.arcanus-map-note{
position:absolute;
left:30px;
bottom:25px;
padding:12px 17px;
border-radius:12px;
background:rgba(255,255,255,.8);
backdrop-filter:blur(8px);
color:var(--text);
font-size:11px;
font-weight:800;
z-index:4;
}
/* =========================================================
EXPLORE ARCANUS
========================================================= */
.arcanus-explore-section{
padding:100px 0;
background:#f5fbfb;
}
.arcanus-explore-grid{
display:grid;
grid-template-columns:
1fr 1.5fr;
gap:60px;
align-items:center;
}
.arcanus-explore-title h2{
margin:0;
font-size:clamp(36px,4vw,53px);
line-height:1;
letter-spacing:-2px;
}
.arcanus-explore-links{
display:grid;
grid-template-columns:
repeat(3,1fr);
gap:15px;
}
.arcanus-explore-link{
min-height:130px;
display:flex;
flex-direction:column;
justify-content:center;
padding:25px;
border-radius:20px;
background:#fff;
border:1px solid var(--border);
color:var(--dark);
transition:.4s ease;
}
.arcanus-explore-link:hover{
transform:translateY(-8px);
background:var(--teal);
color:#fff;
box-shadow:
0 18px 40px rgba(25,170,166,.2);
}
.arcanus-explore-link small{
margin-bottom:9px;
color:var(--teal);
font-size:10px;
font-weight:900;
letter-spacing:1px;
}
.arcanus-explore-link:hover small{
color:#bafff9;
}
.arcanus-explore-link strong{
font-size:14px;
line-height:1.35;
}
/* =========================================================
FINAL CTA
========================================================= */
.arcanus-contact-final{
position:relative;
padding:105px 0;
text-align:center;
overflow:hidden;
background:
radial-gradient(
circle at 15% 25%,
rgba(255,255,255,.13),
transparent 22%
),
radial-gradient(
circle at 85% 75%,
rgba(255,255,255,.10),
transparent 25%
),
linear-gradient(
135deg,
#087f7c,
#045c5b
);
color:#fff;
}
.arcanus-contact-final-inner{
position:relative;
z-index:3;
max-width:850px;
margin:auto;
}
.arcanus-contact-final .arcanus-contact-kicker{
color:#70e9e3;
}
.arcanus-contact-final h2{
margin:0 0 18px;
font-size:clamp(38px,5vw,62px);
line-height:1;
letter-spacing:-2px;
}
.arcanus-contact-final p{
max-width:700px;
margin:0 auto 30px;
color:#c4e5e3;
line-height:1.8;
}
.arcanus-contact-final .arcanus-contact-btn{
background:#fff;
color:var(--teal-dark) !important;
}
.arcanus-contact-final .arcanus-contact-btn:hover{
background:#eaffff;
}
/* =========================================================
FOOTER
========================================================= */
.arcanus-contact-footer{
padding:35px 20px;
background:#032f2e;
text-align:center;
color:#b5d1d0;
}
.arcanus-contact-footer strong{
color:#fff;
font-size:13px;
letter-spacing:2px;
}
/* =========================================================
REVEAL
========================================================= */
.arcanus-contact-reveal{
opacity:0;
transform:translateY(35px);
transition:
opacity .8s ease,
transform .8s ease;
}
.arcanus-contact-reveal.show{
opacity:1;
transform:translateY(0);
}
/* =========================================================
RESPONSIVE
========================================================= */
@media(max-width:1000px){
.arcanus-contact-hero-grid{
grid-template-columns:1fr;
gap:35px;
}
.arcanus-contact-business{
grid-template-columns:1fr;
}
.arcanus-explore-grid{
grid-template-columns:1fr;
}
}
@media(max-width:700px){
.arcanus-contact-section{
padding:75px 0;
}
.arcanus-contact-hero{
min-height:auto;
}
.arcanus-contact-hero-grid{
padding:70px 0;
}
.arcanus-contact-hero h1{
font-size:52px;
letter-spacing:-3px;
}
.arcanus-contact-hero p{
font-size:15px;
}
.arcanus-contact-actions{
flex-direction:column;
}
.arcanus-contact-btn{
width:100%;
}
.arcanus-contact-visual{
min-height:360px;
}
.arcanus-contact-circle{
width:280px;
height:280px;
}
.arcanus-contact-center{
width:175px;
height:175px;
}
.arcanus-contact-orbit{
width:70px;
height:70px;
font-size:7px;
}
.arcanus-contact-info-grid{
grid-template-columns:1fr;
}
.arcanus-business-box{
padding:30px;
}
.arcanus-map-box{
min-height:350px;
}
.arcanus-map-circle{
width:245px;
height:245px;
}
.arcanus-explore-links{
grid-template-columns:1fr;
}
}
CONTACT
EMAIL
OUTFITTERS
Let’s Start
/* =========================================================
SCROLL REVEAL
========================================================= */
const arcanusContactReveal =
document.querySelectorAll(
'.arcanus-contact-reveal'
);
const arcanusContactObserver =
new IntersectionObserver(
(entries)=>{
entries.forEach((entry)=>{
if(entry.isIntersecting){
entry.target.classList.add('show');
arcanusContactObserver.unobserve(
entry.target
);
}
});
},
{
threshold:0.12
}
);
arcanusContactReveal.forEach((element)=>{
arcanusContactObserver.observe(element);
});
/* =========================================================
SMOOTH SCROLL
========================================================= */
document.querySelectorAll(
'.arcanus-contact-page a[href^="#"]'
).forEach((link)=>{
link.addEventListener('click',(event)=>{
const targetId =
link.getAttribute('href');
if(!targetId || targetId === '#'){
return;
}
const target =
document.querySelector(targetId);
if(target){
event.preventDefault();
target.scrollIntoView({
behavior:'smooth',
block:'start'
});
}
});
});
CONTACT ARCANUS • CONNECT • DISCOVER • BUILD
CONTACT US
CONTACT
ARCANUS.
Let’s Start a Conversation
Have a product requirement, wholesale enquiry or business opportunity in mind? Connect with the ARCANUS OUTFITTERS team.
VISIT
US
US
PHONE
WHATSAPP
BUSINESS
ENQUIRY
ENQUIRY
EMAIL
US
US
ARCANUS
OUTFITTERS
EST. 2003
GET IN TOUCH
Connect With ARCANUS
Find our location, business hours and official contact details below.
⌖
VISIT US
546/528 Gol Market
Mahanagar, Lucknow
Uttar Pradesh – 226006
India
◷
BUSINESS HOURS
10:00 AM – 6:00 PM
☎
PHONE / WHATSAPP
[Official Phone / WhatsApp Number]
@
[Official Business Email]
BUSINESS ENQUIRY
Let’s Discuss Your Requirement
For wholesale, reseller, retail partnership, franchise, distribution or other business requirements, submit an enquiry through our Business With Us page.
✓
Wholesale
✓
Reseller
✓
Retail Partnership
✓
Franchise
✓
Distribution
Business With ARCANUS
Explore the different ways you can work with ARCANUS OUTFITTERS and find the business model that fits your requirements.
SEND BUSINESS ENQUIRY →
FIND US
Visit Our Location
546/528 Gol Market, Mahanagar, Lucknow, Uttar Pradesh – 226006, India
⌖
ARCANUSOUTFITTERS
[Google Maps / Location Embed]
EXPLORE ARCANUS
Discover More
ARCANUS OUTFITTERS
Let’s Start
a Conversation.
Have a question, product requirement or business opportunity? Connect with our team and let’s discuss the possibilities.
SEND BUSINESS ENQUIRY